JS的运算符

7、JS的运算符

①.算术运算符

 * 加减乘除  取余(求余数)
 * + - * /   %
 * 注意：+ 运算符，相加时如果两边都是数字，那么会运算数字的相加操作
 *                相加时如果两边有一个不是数字的，比如出现一个字符串，那么运行的  不是在相加，而是拼接操作
 *    拼接操作只有＋运算时会出现，其他符号不出现
 *    其他运算符在遇到两边有非数字类型时，会将其转换为数字(这一步就叫做隐式操作)，然后在运算
 ```js
     console.log(1 + 1) //先将小括号内的运算完毕,然后打印在控制台
     console.log(3 + 4) //7
     console.log(5 + 0) //5
     console.log(5 + '0') 
     //数字5+字符串0  因为加号两边出现了一个非数字类型的字符串，所以会运行两个值的拼接 50
     
     console.log(1 - 1) //0
     console.log(9 - 4) //5
     console.log(5 - '0') //5
     // 两边出现了一个字符串类型的0，JS 会帮助我们将他的类型先转换为数字 然后在运算减法 
     // 也就是会计算  数字5 - 数字0 ---> 5
     
     console.log(1 * 1) //1
     console.log(3 * 4) // 12
     console.log(5 * '0')
     //两边出现了一个字符串类型的 0,JS会帮助我们将他的类型先转为数字，然后在运算减法
     //也就是会计算 数字5 * 数字0 ---> 0
     
     console.log(5 / 1) //5
     console.log(8 / 2) //4
     console.log(6 / '2')
     //两边出现了一个字符串类型的'2'，JS会帮助我们将他的类型先转为数字，然后在运算除法
     // 也就是会计算 数字6 / 数字2 -->3
     
     console.log(5 % 1) //取余0
     console.log(10 %  3) //计算10除以3 取余1
     //两边出现了一个字符串类型的'2'，JS会帮助我们将他的类型先转为数字，然后在运算除法
     // 也就是会计算 数字10 % 数字3 -->1
     
     console.log(5 / 0) //Infinity 表明 无穷的意思
     console.log(5 % 0) //NaN
     // 0.1 + 0.2  不等于 0.3
 ```

②.赋值运算符

 * = 一个赋值号
 * +=  相当于是“我自身”加上一个新值。就可以用这个 += 来优化，例子:a = a + 10 优化后:a += 10
 * -= *= /= %=   运算逻辑与+=是完全相同的
 ```js
      //+=
      var a = 1
      a = a + 10 //将变量a重新赋值为变量a + 10  a = a + 10   a = 1 + 10   a = 11
      console.log(a) //11
      
      var a = 1
      a += 10 // a += 10 ---> a=a+10--->a=1+10-->a=11
      console.log(a)//11
      
      // -=
      var a = 5
      a -= 5 //将变量a重新赋值为 变量a - 5 a= a - 5 -->a = 5 - 5-->a = 0
      console.log(a)//0
      
      // *=
      var a = 2
      a *= 2// a *= 2 --->a = a * 2 --->a = 2 * 2 --->a = 4
      console.log(a)//4
      
      // /=
      var a = 4
      a /= 4// a /= 4 ---> a = a / 4 --->a = 4 /4 --->a = 1
      console.log(a) //1
      
      // %=
      var a = 10
      a %= 3 //a %= 3 ---> a = a % 3 ---> a = 10 % 3 --->a = 1
      console.log(a)//1
 ```

③.比较运算符

比较运算符 比较运算符两边的值之后，返回一个布尔值，也就是返回一个true或者false
 * 判断
 *    > < >= <=
 * 判断相等
 *    == ===  在js中等号出现两次或者三次时代表等于的意思
 *
 * 判断不相等
 *    !=  !==
 *    共同点：判断符号两边的值是否不相等,不相等时返回true  相等时返回false
 *    不同点
 *         != 不会对比数据类型
 *         !-= 会对比数据类型
 * */ 
 ```js
     //  比较两边的值，然后返回一个布尔值，也就是返回一个true或者false
     console.log(3 > 4)
     //打印时先看3是否大于4，因为3小于4，不满足大于4的条件，所以返回的是 false
     console.log(3 < 4) //打印时先看4是否大于 3，因为4大于3，满足条件，所以返回的是true
     console.log(5 < 6) //因为5<6 满足条件,所以返回的是true
     console.log(6 < 5) //因为6<5不满足条件,所以返回的是false
     
     console.log(1 > 1)
     console.log(1>=1)//判断1是否大于或等于1 此时满足第二个条件也就是1等于1 所以会返回true
     
     console.log(1<1)
     console.log(1<=1) 
     //判断1是否小于或等丁于1 此时满足第二个条件也就是1等于1 所以会返回true
     
     console.log(1 == 1)//判断符号两边的值是否相等true
     console.log(99 === 99)//判断符号两边的值是否相等true
     
     console.log(1 == '1') //判断符号两边的值是否相等(不会对比数据类到) true
     console.log(1 === '1')//判断符号两边的值是否相等(这里会对比数据类型) false 因为数据类型不同!
     
     console.log(3 != 4)//7断符号两边是否不相等true
     console.log(9 !== 10)//7断符号两边是否不相等true
     
     console.log(3 != '3') 
     //判断符号两边是否不相等 且不会对比数据类型，所以这他认为3和"'3’是相等的 所以会返回false
     console.log(3 !== '3') 
     //判断符号两边是否不相等 且会对比数据类型，所以这他认为3和"'3’是不相等的 所以会返回true
 ```

* 两个等号和三个等号的区别(面试题)

 * == 在的js中判断时会做隐式转换，也就是说只会对比值是否相等，不会对比数据类型
 * === 在JS中也叫做全等，在判断的时候不会做隐式转换，也就是说，
         在对比时除了会对比值是否相等，还会判断数据类型是否相同

④.逻辑运算符

 * &&  逻辑与(相当于并且的意思)
 * ||  逻辑或(相当于或者的意思)
 * !  逻辑非(取反，反义词)
 * 
 * !逻辑与运算符(&&)的特性!!!
 *      符号左边的值 如果为真(也就是转为布尔值后为true)，那么会返回符号右边的值
 *                  如果为假(也就是转为布尔值后为false)，那么会将自身返回出去
 * !逻辑或运算符的特性!!!
 *      符号左边的值  如果为真,那么会将自身返回出去
                     如果为假。那么会将符号右的值返回出去
 * !逻辑非运算符的特性!!!
        语法：!值
        返回值：将值转换为布尔值之后，做一个取反的操作。也就是true改变false，false改变为 true
 * */ 
 ```js
     //  &&
     console.log(1 && 100) //根据逻辑与运算符的特性,返回的是100
     console.log(0 && 99) //根据逻辑与运算符的特性,返回的是0
     console.log(true && 'qwer') //qwer
     console.log(false && 'qwer') //false
     
     //  ||
     console.log(1 || 100) //根据逻辑或的特性,返回的是1
     console.log(0 || 99) //根据逻辑或的特性,返回的是99
     
     // !(布尔值中除了0都是true)
     console.log(!99) //!99 ---> !true --->false
     console.log(!0) //!0 ---> !false --->true
     console.log(!true) //false
 ```

⑤.自增自减运算符

 ++   --
 * 语法：(自增自减都是相同的语法,这里就拿自增为例)
 *  1.++值
 *  2.值++
 * 
 *    自增运算符的能力就是将自身的值+1
 *    自减运算符的能力就是将自身的值-1
 * 
 *    自增自减运算符写法不同，运行结果也不同
 *       1. ++值(++在前)
 *              如果++在前，那么会先将自身的值+1  然后参与其他的
 *       2. 值++(++在后)
 *              如果++在后，那么会先参与周围的运算，然后将自身的值+1
 * 
 * 自减运算符在前与在后的作用与自增运算符完全相同，只不过是-1
 ```js
     var a = 1
     var b = 1
     
     console.log(++a) 
     //如果++在前，那么会先将自身的值+1 然后打印到控制台
     console.log(b++) 
     //如果++在后，那么会先将目前的值打印到控制台(也就是1)，然后将自身的值+1   也就是说这行运行完华后，变量b的值变为2了
     console.log(a,b) //2,2
 ```

8、JS的优先级

 * 运算符优先级从高到低
 *    自增自减运算符++ -- !
 *    算术运算符 先* / % 后+ -
 *    比较运算符中的 > >= < <=
 *    比较运算符中的 == != === !==
 *    逻辑运算符 先&& 后||
 *    赋值运算符

9、课后练习

 ```js
     //1. `var a = 3; var b = a++; a + b + a++`该代码输出的值为11
     var a = 3; 
     var b = a++; //a++先赋值后自增  所以b=3 a=4
     console.log(a + b + a++)// a + b + a++ = 4 + 3 + 4 =11
     //2. `console.log(parseInt(1 * 100 / 3 + ""))`该代码输出的值为33
     //100 / 3 + "" = "33.33333" = 33
     //3. `var a = 3; a++; a++; var b = a+2; ++a; console.log(a)` 该代码输出的值为6
     //b = 7  a = 6
     //4. `3 - "36" % 5 + "2" - 2`该代码输出的值为20
     //36 % 5 = 1    3 - 1 + "2" - 2 = 22 - 2 = 20
     // 5. `var a = 4; var num = 1 * (2 + 3) && a++ || 5 > 6 && 7 < 8 || !9;` num的值是 4
     // num = 4 || false || false = 4
     //6. 在不考虑四舍五入的情况下对一个数字进行保留两位小数(提醒: 使用 parseInt)
    ```JS
        var orign = 123.456789
        // code run here ...
        // 输出结果: 123.45
    
        var orign1 = 987.654321
        // code run here ...
        // 输出结果: 987.65
    ```
var orign = 123.456789
console.log(typeof (parseInt(orign)), parseInt(orign * 100) / 100)
 ```