JavaScript学习手册三：JS运算符

系统管理员 2022-11-19 06:29 198阅读 0赞

### JS运算符 ###

*  A、算术运算符
 *   *  任务描述
     *  相关知识
     *   *  \+ - \* / %运算符
         *  递增运算符和递减运算符
         *  代码文件
 *  B、比较和逻辑运算符
 *   *  任务描述
     *  相关知识
     *   *  代码文件
 *  C、条件和赋值运算符
 *   *  任务描述
     *  相关知识
     *   *  代码文件
 *  D、运算符的优先级和结合性
 *   *  任务描述
     *  相关知识
     *   *  代码文件

【天呼噜~我不知道有大佬写了一样的，我放个链接在这里吧，我也只是想记录一下： [JS 运算符][JS]】

# A、算术运算符 #

## 任务描述 ##

*  给定两个字符串变量，把它们转为数字后相除，拼接被除数、除数和余数为一个新的字符串。
 *  例如：a为"5"，b为"3"，则c为数字2，拼接后结果为字符串"532"。
 *  a为"23asdf"，b为"3fe"，则c为数字2，拼接后结果为字符串"23asdf3fe2"。
 *  本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：
 *  1.完成函数mainJs()；
 *  2.将两个字符串参数a和b转换为数字；
 *  3.计算a除以b的余数c；
 *  4.将a、b、c分别转换为字符串；
 *  5.拼接字符串a、b和c；

具体请参见后续测试样例。

本关涉及的代码文件ArithSymbol.js的代码框架如下：

function mainJs(a,b) {
    //请在此处编写代码
    /********** Begin **********/
    /********** End **********/
        return a+b+c;
    }

**测试过程：**

1.  平台将读取用户补全后的ArithSymbol.js；
2.  调用其中的mainJs()方法，输入若干组测试数据；
3.  最后根据测试的输出判断程序是否正确
4.  以下是测试样例：

测试输入：
    100,9
    预期输出：
    10091
    
    测试输入：
    -10,3
    预期输出：
    -103-1
    
    测试输入：
    23as,3ss
    预期输出：
    23as3ss2

## 相关知识 ##

*  JavaScript中的算术运算符除了数学中常见的加减乘除外，还有递增、递减和取余等。

### \+ - \* / %运算符 ###

*  JavaScript中的加号除了具有数学中将两个数字相加的作用外，还能对字符串做连接操作。
 *  对两个数字相加和数学中一样，字符串相加就是拼接字符串的意思，比如Java+Script的结果是字符串JavaScript。
 *  当字符串和数字相加时需要进行类型转换，数字会先转为字符串，然后再做字符串的拼接。

> var resultNumber = 1+1;//结果是2  
> var resultString1 = “1”+“1”;//结果是“11”  
> var resultString2 = 1+“2”;//结果是“12”

*  减法、乘法、除法以及取余运算符只能用于数字之间的计算，不能做字符串操作。

-和数学中减号用法相同；
    
    *和数学中乘号用法相同；
    
    /表示除以，结果是浮点数，不做四舍五入；
    
    %表示取余数，a%b返回a除以b得到的余数，结果与a的符号相同。

> var floatNumber = 3/2;//结果是1.5  
> var intNumber1 = 3%2;//结果是1  
> var intNumber2 = -3%2; //结果是-1

### 递增运算符和递减运算符 ###

*  递增运算符++表示对一个数做加1的操作，递减运算符–表示对一个数做减1的操作。
 *  \++符号在数字的左边还是右边会影响运算的顺序，当++在数的左边时，表示先对数加1，再返回加1后的结果。在右边时，表示先返回该数的值，再加1。下面的例子展示了这种区别。
 *  递减运算符–同理。
 *  递增只对数字有效，不做字符串的拼接。

var i = 1,j = 0;
    j = i++;//j为1,i为2
    var m = 1,n = 0;
    n = ++m;//n为2,m为2

### 代码文件 ###

function mainJs(a,b) { 
    //请在此处编写代码
    /***********Begin**********/
    var a;
    var b;
    var d;
    var e;
    d = parseInt(a);
    e = parseInt(b);
    c=d%e;
    c.toString();
    
    /*********End************/
        return a+b+c;
    }

海到无边天作岸，山登绝顶我为峰。 —— 林则徐

# B、比较和逻辑运算符 #

## 任务描述 ##

**本关任务：**

*  判断两个字符串的大小，第一个大于第二个则返回两者逻辑相与的结果，否则返回第二个逻辑取反的结果。
 *  例如：a为字符串"d"，b为字符串"b"，因为字符串"d"大于字符串"b"，所以返回"d"逻辑与"b"，即字符串"b"。

**本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：**

1.  完成函数mainJs()；
2.  比较字符串a和b的大小；
3.  如果a>b，则返回a逻辑与b的结果，否则返回a逻辑取反的结果（返回时使用return）；

**具体请参见后续测试样例。**

比较需要用到条件表示式，如下：

//打印a和b中较大的哪一个
    var a = 1,b = 2;
    if(a > b) { 
        console.log(a);
    }
    else { 
        console.log(b);
    }

**本关涉及的代码文件LoginBoolSymbol.js的代码框架如下：**

function mainJs(a,b) { 
    //请在此处编写代码
    /********** Begin **********/
    /********** End **********/
    }

**测试过程：**

*  平台将读取用户补全后的LoginBoolSymbol.js；
 *  调用其中的mainJs()方法，输入若干组测试数据；
 *  最后根据测试结果判断程序是否正确。

**以下是测试样例：**

测试输入：
    b,d
    预期输出：
    b
    
    测试输入：
    z,zz
    预期输出：
    False

## 相关知识 ##

**1.比较运算符**

*  JavaScript中的比较运算符有==,===,>,<,!=,>=等。  
    ==叫做相等，===叫做严格相等。
 *  双等号和三等号的区别是：三等号要求数据类型和值都相等，双等号只需要值相等即可，相等包含严格相等。
 *  从比较过程来看，严格相等先比较两个对象的数据类型是否相等，不相等则结束比较，返回false，相等在数据类型不同时，尝试进行数据类型转换，例如，在字符串和数字的比较中，字符串会被转为数字再比较；布尔值true转为数字1，布尔值false转为数字0。
 *  如果数据类型相同，相等和严格相等都会直接比较值，值相等返回true。

**需要特别注意的是，以上仅仅适用于非对象类型。对于对象类型，相等或者严格相等比较的都是对象的引用，而不是具体的值，就是说，一个对象和其他任何对象都是不相等的，即使两者属性、值都相等。下面给出一些例子：**

var stringVariable = "2";
    var number1 = 2;
    var number2 = 2;
    console.log(stringVariable == number1);//true
    console.log(stringVariable === number1);//false
    console.log(number1 === number2);//true
    var studentA = { 
    name:"Bob",
    age:22
    }
    var studentB = { 
    name:"Bob",
    age:22
    }
    console.log(studentA == studentB);//false，因为不是同一个对象
    var studentC = studentA;
    console.log(studentA == studentC);//true，因为是同一个对象

*  将studentA赋值给studentC，这时studentC和studentA指向内存中的同一个地址块，视为同一个对象，所以两者相等。

**不等 对应于上面的等号，不等号也有两种：!=和!。 !=和互为相反，==成立，!=一定不成立。 !和=互为相反，严格相等成立，则严格不相等不成立。**

*  其它 大于，小于，大于等于，小于等于的比较规则如下： 比较的两个对象都是数字，按照数学中数字的比较方法。
 *  数字和字符串比较，字符串转为数字后再比较。
 *  字符串和字符串比较，从第一个字符开始，逐个比较，发现不相等立即返回。字符按照ASCII编码值的大小比较，一般只要记住：**数字<大写字母<小写字母，字母a小于字母z，A小于Z，**  
    比较过程中，当一个字符串结束另外一个字符串还有，还没有比较出大小，则长的字符串较大。

var number1 = 1;//定义变量number1
    var number2 = 2;//定义变量number2
    var string1 = "3";//string1
    var lowerLetter = "a";//定义变量lowerLetter
    var upperLetter = "A";//定义变量upperLetter
    var string1 = "aa";//定义变量string1
    var String2 = "ab";//定义变量String2
    console.log(number1<number2);//输出true
    console.log(number2<string1);//输出true
    console.log(upperLetter<lowerLetter);//输出true
    console.log(lowerLetter<string1);//输出false
    console.log(string1<string2);//输出true

**逻辑运算符**  
在介绍逻辑运算符之前，我们必须明确逻辑运算符的操作数只能是布尔型，其他类型都会被转换为布尔型：除了`0，null，undefined，""`外，其他的值转换为布尔值都是true。

**逻辑与**

1.  逻辑与有两个操作数，中间用`&&`连接，只有两个操作数都是true结果才是true；
2.  其中一个操作数不是布尔型，当左操作数为真值时，返回右操作数。当左操作数为假值时，返回左操作数。

**逻辑或**

1.  逻辑或同样有两个操作数，用||连接，至少有一个操作数为true时结果为true；
2.  其中一个操作数不是布尔型，当左操作数为真值时，返回左操作数。当左操作数为假值时，返回右操作数。

**逻辑非**

1.  逻辑非只有一个操作数，!后连接操作数或表达式，意思是将操作数取反；
2.  如果操作数不是布尔型，编译器首先将其他类型转换为布尔型，然后返回true或者false。

console.log(true&&false);//false
    console.log(true||false);//true
    console.log(!false);//true
    var number1 = 1;
    var number2 = 0;
    var string = "a";
    console.log(number1&&string);//输出字符串"a"
    console.log(number1||string);//输出数字1
    console.log(!number1);//false

### 代码文件 ###

# C、条件和赋值运算符 #

## 任务描述 ##

**本关任务：**

*  计算并返回两个字符串中较大的字符串。字符串的大小比较直接使用比较运算符>或者<即可。
 *  例如：对于字符串aa和ab，要求返回ab。

## 相关知识 ##

*  条件运算符最主要的作用是代替选择结构，简化代码。

**条件运算符**

*  条件运算符由?和:构成，三个操作数分别在?的左边、右边以及:的右边，
 *  第一个操作数如果是真值，整个表达式返回第二个操作数的值；
 *  第一个操作数如果是假值，返回第三个操作数的值。
 *  一般我们说到JavaScript中的三元运算符，指的就是条件运算符，因为它有三个操作数。条件运算符通常用来简化表达式。

var result1 = a>b?a:b;//result1赋值为a和b中大的那一个
    var result2 = (a==5)?(a+1):(a-1);//a为5，返回a+1，否则返回a-1

**赋值运算符**

*  赋值运算符就是=号，其实这个在前面出现过很多次了。赋值运算符的左边是一个变量或者对象的属性，右边是这个变量的值，意思是设置左边变量的值为右边的具体值。
 *  除了基本的等号外，赋值运算符还可以和算术运算符结合。例如a+=1表示a=a+1，其中就把相加和赋值结合了起来。同理，相减、相乘、相除、取余、位运算都可以和赋值结合起来。如下：

var b = 1;
    b += 1;//等价于b = b+1
    b *= 1;//等价于b = b*1
    b /= 1;//等价于b = b/1
    b %= 1;//等价于b = b%1
    b &= 1;//等价于b = b&1

**编程要求**

本关的编程任务是补全右侧代码片段中begin至end中间的代码，具体要求如下：

1.  完成函数mainJs()；
2.  返回参数a和b中较大的字符串；
3.  判断字符串的大小直接用<和>即可；
4.  具体请参见后续测试样例。

本关涉及的代码文件ConditionSymbol.js的代码框架如下：

function mainJs(a,b) { 
    //请在此处编写代码
    /********** Begin **********/
    /********** End **********/
    }

**测试过程：**

1.  平台将读取用户补全后的ConditionSymbol.js；
2.  调用其中的mainJs()方法，输入若干组测试数据；
3.  接着根据测试的输出判断程序是否正确。
4.  以下是测试样例：

测试输入：
    a,aa
    预期输出：
    aa
    
    测试输入：
    1,2
    预期输出：
    2

### 代码文件 ###

function mainJs(a,b) { 
    //请在此处编写代码
    /*********begin*********/
    var result = a>b?a:b;
    return result;
    /*********end*********/
    }

# D、运算符的优先级和结合性 #

## 任务描述 ##

**本关任务：**

*  我们将给出函数mainJs()的完整代码，要求在函数体内第三句以及第五句中添加适当的括号，实现编程要求里面的要求。
 *  要想完成本关任务，必须熟悉运算符的优先级和结合性，请阅读下面的相关知识。

## 相关知识 ##

在我们平时的学习中，经常会看到一些前辈的代码短小精悍却功能复杂，大部分是通过把大量运算符放在一起结合使用实现的，所以我们要深入理解运算符的优先级和结合性，写出漂亮的代码!

**运算符的优先级**

*  JavaScript中运算符的优先级和数学中运算符的优先级意思相同，优先级高的运算符比优先级低的运算符先计算，例如数学中`1+2*3`算式，先计算`2*3`,结果再与1相加，所以乘法的优先级高于加法，在JavaScript中，不同的优先级也是这个作用。

下面是常见的运算符的优先级：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1ODIzMTE4_size_16_color_FFFFFF_t_70]  
![在这里插入图片描述][20210414235215666.png]  
从上到下优先级逐渐降低。第一栏数字相同的运算符优先级相同，对于这个表格，不需要全部记住，但是常见的需要记住，比如加减乘除的优先级高于比较运算符，赋值运算符的优先级几乎是最低的，下面给出例子帮助理解：

var a = 1;
    var b = 2;
    var c = ++a+b;

因为++的优先级高于+，所以上面的第三个句子等价于：

var c = (++a)+b;

**运算符的结合性**

*  运算符的优先级是针对不同优先级的运算符来说的，对于同一级的运算符，运算顺序取决于运算符的结合性，比如加法和减法的优先级相同，而加法和减法都是从左向右结合，所以a+b-c式中，会先计算a+b，即按照阅读的顺序计算。
 *  也有很多运算符是从右到左结合的，比如取反、逻辑非。
 *  上面图中的第三栏就是结合性，R表示从右向左结合，L表示从左到右结合，从左向右的占多数，这和我们在数学中的习惯相同。

var d = a*b/c;//先计算乘法后计算除法
    var aa = 2;
    var bb = 3;
    var cc = aa *= bb;//先计算aa*=bb，再把结果赋值给cc，为6

上面第一个式子是从左到右结合，第四个式子是从右到左结合。

分别等价于：

var d = (a*b)/c;
    var cc = (aa *= bb);

**编程要求**

本关的编程任务是补全右侧代码片段中begin至end中间的代码，在函数体内第三句以及第五句添加适当的括号，以实现如下功能：

1.  参数a先减去1,所得差再与参数b相加，然后将结果再与b相乘；
2.  上面的结果为24则给参数c赋值1，否则赋值0；
3.  计算c与d（d 等于4）的积，这个积再与参数d求和，所得结果赋值给参数e；
4.  函数参见下面的测试说明部分。

本关涉及的代码文件Priority.js的代码框架如下：

function mainJs(a,b) { 
        var a = parseInt(a);
        var b = parseInt(b);
        //请在此处编写代码
        /********** Begin **********/
        var c = --a+b*b==24?1:0;
        var d = 4;
        var e = c*=d+d;
        /********** End **********/
        return e;
    }

**测试过程：**

1.  平台将读取用户补全后的Priority.js；
2.  调用其中的mainJs()方法，输入若干组测试数据；
3.  接着根据测试后的输出判断程序是否正确。
4.  以下是测试样例：

测试输入：
    6,3
    预期输出：
    8
    测试输入：
    5,1
    预期输出：
    4

### 代码文件 ###

function mainJs(a,b) { 
        var a = parseInt(a);
        var b = parseInt(b);
    //请在此处编写代码
    /*********begin*********/
    var bb = ((--a)+b)*b;
    if(bb==24)
        var c = 1;
    else
        var c = 0;
    var d = 4;
    var e = (c*d)+d;
    
    
    /*********end*********/
        return e;
    }

[JS]: https://blog.csdn.net/m0_47174730/article/details/111774864
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1ODIzMTE4_size_16_color_FFFFFF_t_70]: /images/20221022/a10b306d1aa1434eabf2e57bb79c6356.png
[20210414235215666.png]: /images/20221022/d0de55588d6a4c4a8031c40912bae47e.png