三、运算符

1. 算术运算符

运算符（操作符）

运算符可以用来对一个或多个操作数（值）进行运算

算术运算符：

运算符符号	运算符名称
+	加法运算符
—	减法运算符
*	乘法运算符
/	除法运算符
**	幂运算符
%	模运算，两个数相除取余数

注意：算术运算符时，除了字符串的加法，其他运算的操作数是非数值时，都会转换为数值然后再运算

   let a = 1 + 1
     a = 10 - 5
     a = 2 * 4
     a = 20 / 2
     a = 20 / 2 / 2
     a = 20 / 7
     a = 20 / 0   // 返回Infinity
     a = 20 % 4 // 0
     a = 20 % 8  // 4
     a = 4 ** 2   //16
     a = 9 ** .5 //开方

     /*
       JS是一门弱类型语言，当进行运算符时会通过自动的类型转换来完成运算
     */ 
     a = 10 - '5' // 返回 5 (不会报错)，会把字符串5 转换为数字，然后再进行运算
     a = 10 + true  // 10 + 1
     a = 10 + false  // 10 + 0
     a = 10 + null //10 +0
     a = 10 + undefined  // 10 - NaN --> NaN

当任意一个值和字符串做加法运算时，它会先将其他值转换为字符串，然后再做并串的操作。可以利用这一特点来完成类型转换

可以通过为任意类型 + 一个空串的形式来将其转换为字符串，其原理和String()函数相同，但使用起来更加简洁

a = 1 + '2' // '1' + '2' ---> 12
     a = 'hello' + 'world'  // helloworld
    
     a = true  // true

    //  a = String(a)  //true

    //  a = true + 'hello'   // truehello 
    //  a = true + ''  // true
    //   a = a + ''  // true


     console.log(typeof a, a)

2. 赋值运算符

赋值运算符用来将一个值赋值给一个变量

运算符号	运算符名称	定义
=	等于	将符号右侧的值赋值给左边的变量
??	空赋值	只有当变量的值为null或undefined时才会对变量进行赋值
+=	加等于	a +=n 等价于 a = a + n
-+	减加	a -=n 等价于 a = a - n
*=	乘等于	a *=n 等价于 a = a * n
/=	除等于	a /=n 等价于 a = a / n
%=	模等于	a %=n 等价于 a = a % n
**=	次幂等于	a **=n 等价于 a = a ** n

        let a = 10
        a = 5 //将右边的值  赋值  给左边的变量
        let b = a // 一个变量只有在等号左边时才是变量，在等号右边时它是值
        
        a = 11
        a + 11 // 返回11, 运算符不会改变变量的值，赋值给变量才会变
        a = a + 11  // 返回22

        a = 4
        a += 4 // a = a + 4
        a /= 4  // a = a / 4

        // a = 101
        a = null  // 102
        a = undefined  //102
        a = NaN  // 返回NaN
        a ??= 102 // 问号和等号之间没有空格，有空格就会出现语法错误，syntax error
        console.log(a)

3. 一元的正负

一元的±

符号	名称	意义
+	正号	不会改变数值的符号
-	负号	可以对数值进行符号位取反

let a = 10
       a = -a  //-10

       a = -10
       a = -a  // 10

       console.log(a)
       
       let b = '123'
    //    b = Number(b)
       b = -b //返回 number -123
       console.log(typeof b,b)

4. 自增和自减

++ 自增运算符

++ 使用后会使得原来的变量立刻增加1
自增分为前自增(++a)和后自增(a++)
无论是++a还是a++都会使原变量立刻增加1
不同的是++a和a++所返回的值不同
a++ 是自增前的值 旧值
++a 是自增后的值 新值

（自增和自减会影响到原来变量值）

        let a = 10
        a ++  //11  :  10+1
        a ++  //12  :  11+1
        a ++  //13  :  12+1
        
        a += 1 //14  : 13+1 （一样的效果，都会使原来的值增加1）
        
        // let b = a ++    // a++ = 14  
        // console.log("a++ =",b)  //a++ = 14 ,因为a++是自增前的值，所以 b = a++ 返回14
        // console.log(a)  // 对于a， a++ 会使原变量增加1
        

        // let b = ++a
        // console.log("++a =",b)  // ++a = 15， 因为++a是自增后的值，所以 b = ++a 返回15
        // console.log(a)    // 对于a, 无论是++a还是a++都会使原变量立刻增加1,所以 ++a 返回15
   
        let n = 5
        //            5  +  7  + 7
        let result = n++ + ++n + n
        // console.log(result) //19

-- 自减运算符

--使用后会使得原来的变量立刻减少1
自增分为前自减(--a)和后自减(a--)
无论是--a还是a--都会使原变量立刻减少1
不同的是--a和a--所返回的值不同
a-- 是自减前的值 旧值
--a 是自减后的值 新值

   let a = 10
       a--  //9
       --a  //8
        // console.log('--a',--a)   // --a 7
       console.log('a--',a--)   // a-- 8 (自减前的值)

       console.log(a)

5. 逻辑运算符

! 逻辑非

！ 可以用来对一个值进行非运算
它可以对一个布尔值进行取反操作
true --> false
false --> true
如果对于一个非布尔值进行取反，它会先将其转换为布尔值然后再取反,可以利用这个特点将其他类型转换为布尔值

类型转换

转换类型	转换形式	书写语法
转为字符串	显示转换	String()
	隐式转换	+ ""
转为字数值	显示转换	Number()
	隐式转换	+
转为字布尔值	显示转换	Boolean()
	隐式转换	!!

  <script>
    let a = true
    a = !a  //false
    a = !!a   //true

    // let a = 1
    // a =!a   // false ,先将 a=1转换为布尔值--> true，再对true取反
       
    // let a = NaN
    // a = !a    // true, NaN的布尔值为false，再将其取反
    // console.log(a)

   
    a = 123
    // a = Boolean(a)  //true
    a =!a  // false
    console.log(typeof a,a)
    </script>

6. 逻辑与和或

&& 逻辑与

• 可以对两个值进行与运算

• 当&&左右都为true时，则返回true，否则返回false

• 与运算是短路的与，如果第一个值为false，则不看第二个值

• 与运算是找false的，如果找到false则直接返回，没有false才会返回true

• 对于非布尔值进行与运算，它会转化为布尔值然后运算，但是最终会返回原值

• 如果第一个值为false，则直接返回第一个值

• 如果第一个值为true，则返回第二个值

  let result = true && true  //true
        result = true && false  //false
        result = false && true   //false
        result = false && false   // false

        // result = true && alert(123)  // alert 会执行，但是返回undefined

        //  true && alert(123)  // 返回false, 第一个值为true，alert会执行        
        //  false && alert(123)  //  返回false, 第一个值为false，alert不会执行 

        // 对于非布尔值
        //    true && true  -->true
        result = 1 && 2   //返回2
 
        //    true && false --> false
        result = 1 && 0    //  返回0,返回第一个值
 
        //   false && false --> false
        result = 0 && NaN   // 返回0，返回第一个值

      console.log(result)

|| 逻辑或

• 可以对两个值进行或运算

• 当||左右true时，则返回true，否则返回false (只要有true就会返回true)

• 或运算也是短路的或，如果第一个值为true，则不看第二个值

• 或运算是找true，如果找到true则直接返回，没有true才会返回false

• 对于非布尔值进行或运算，它会转化为布尔值然后运算，但是最终会返回原值

• 如果第一个值为true，则直接返回第一个值

• 如果第一个值为false，则返回第二个值

result = true || false   // true
        result = false || true   // true
        result = true || true   // true
        result = false || false  //false
    
        // result = false || alert(123)  //返回undefined
        // false || alert(123)  // 返回false， 第一个值为false，所以alert会执行
        true || alert(123)  // 返回false，第一个值为true，所以alert不会执行

       result = 1 || 2  //返回1，第一值为true
       result = "hello" || NaN  //返回hello
       result = NaN || 1  //1
       result = NaN || null   //null    

        console.log(result)

7. 关系运算符

关系运算符：关系运算符用来检查两个值之间的关系是否成立，成立返回true，不成立返回false

>	用来检查左值是否大于右值
>=	用来检查左值是否大于或等于右值
<	用来检查左值是否小于右值
<=	用来检查左值是否小于或等于右值

注意：

• 当对非数值进行关系运算时，它会先将前转换为数值然后再比较

• 当关系运算符的两端是两个字符串，它不会将字符串转换为数值，而是逐位的比较字符的Unicode编码,利用这个特点可以对字符串按照字母排序

• 注意比较两个字符串格式的数字时一定要进行类型转换

<script> 
        let result = 10 > 5   //true
        result = 5 > 5 //false
        result = 5 >= 5  // true

        result = 5 < "10" // true
        result = "1" > false // true , false 转数字为0，所以 1 > 0


        // 运算符两边都为字符串的情况
        result = "a" < "b"  // true 
        result = "a" > "b"  //false
        result = "h" < "i"   //true
        result = "g" > "k" // false
        result = "abc" < "b" //true --> 右边的b与左边字符串的第一位相比较，若与第一位相等，与第二位相比依次类推

        result = "12" < "2"  //true --> 右边的2与左边字符串的第一位1相比较，因此显示true
        result = +"12" < "2"  //false  --> 只要对任意一遍进行类型转换就可以，

        // 检查num是否在 5 和 10 之间
        let num = 60
        // 错误的写法
        // result = 5 < num < 10   //true ，会先比较5 < num 然后与它的值比较10 ，所以会返回true
        // 正确的写法
        result = num > 5 && num < 10   //false，使用逻辑运算符
        

        console.log(result) 
    </script>

8. 相等运算符

运算符符号	运算符名称	作用
==	相等运算符	用来比较两个值是否相等
===	全等运算符	用来比较两个值是否全等
!=	不相等运算符	用来比较两个值是否不相等
!==	不全等运算符	用来比较两个值是否不全等

相等运算符与全等运算符的区别

相等运算符(==):
· 使用相等运算符比较两个不同类型的值时，它会将其转换为相同的类型（通常转换为数值）然后再比较，类型转换后值相同也会返回true
·null和undefined进行相等比较时会返回true
·NaN不和任何值相等，包括它自身

全等运算符(===):

·它不会进行自动的类型转换，如果两个值的类型不同直接返回false

不等运算符与不全等运算符的区别：

·不等运算符会自动的进行类型转换，不全等运算符不会自动的类型转换，

==相等运算符

     let result = 1 == 1  // true
        result = 1 == 2 //false
        result = 1 == '1' // true ,相等运算符将字符串1转换为数字1再做比较
        result = true == "1" //true, 将其字符串1转换为布尔值true，再做比较

        result = null == undefined // true,null的布尔值为false，undefined的布尔值也为false，所以等号成立
        result = NaN == NaN  // false
      console.log(result)

===全等运算符

    let result = 1 === 1  //true
        result = 1 === '1'  //false，类型不同所以直接返回false
        result = null === undefined  //false
      console.log(result)

!=不相等运算符

    let result = 1 != 1 //false
        result = 1 != 2  //true
        result = 1 != '1'  //false
     console.log(result)

!==不全等

let result = 1 !== "1" //true
console.log(result)

9. 条件运算符

条件运算符

运算符名称	表达式	执行顺序
条件运算符	条件表达式 ? 表达式1 : 表达式2	条件运算符在执行时，会先对条件表达式进行求值判断， 如果结果为true，则执行表达式1 如果结果为false，则执行表达式2

  true ? alert(123) : alert(2)     //执行alert(123)
  false ? alert(123) : alert(2)      // 执行alert(2)

例子：

   let a = 10
        let b = 20
        a > b ? alert('bigger') : alert('smaller') //a > b为false，所以执行第二个表达式
       
        let c = 100
        let d = 200
        let max = c > d ? c : d
        alert(max)  //alert ---> 200

10.运算符的优先级

和数学一样，JS中的运算符也有优先级，比如先乘除和加减。

可以通过优先级的表格来查询运算符的优先级

在表格中位置越靠上的优先级越高，优先级越高越先执行，优先级一样自左向右执行

优先级我们不需要记忆，甚至表格都不需要看

因为()拥有最高的优先级，使用运算符时，如果遇到拿不准的，可以直接通过()来改变优先级即可

   <script>
       let a = 1 + 2 * 3  // 7

       a = 1 && 2 || 3  //2
       a = 1 && (2 || 3)    // 用括号来改变它的优先级就可以

       console.log(a)
    </script>