03 JS的运算符(算数,赋值,比较,逻辑,自增自减)

111 阅读5分钟

1. 算术运算符

  1. 加+ 减- 乘* 除/ 取余%(求余数)
  2. 注意: + 运算符,相加时如果两边都是数字,那么会进行数字的相加操作; 如果两边有一个不是数字的,比如出现一个字符串,那么运行的不再是相加,而是拼接操作
  3. 拼接操作只有 + 运算时会出现,其他符号不出现
  4. 其他运算符在遇到两边有非数字类型时,会将其转换为数字(这一步就叫做隐式转换),然后再运算
console.log(1+1)//2  先将小括号内的运算完毕,然后打印在控制台
console.log(5+'0') //50 (因为 + 号两边出现了一个非数字类型的字符串,所以会运行两个值的拼接)

console.log(5-'0')//5 ( - 两边出现了一个字符串类型的'0', JS 会帮助我们将他的类型先转换为数字,然后在进行计算)

console.log(5*0)//0
console.log(5*'0')//0  两边出现了一个字符串类型的 '0' ,JS会帮助我们将她的类型先转换为数字,然后再运算乘法;也就是会计算 数字5 * 数字0 --->0

console.log(6/2)//3
console.log(6/'2')//3  /两边出现了一个字符串类型的 '2' ,JS会帮助我们将它的类型先转换为数字,然后再运算除法

console.log(6%2)//计算6/2的余数  余数为0
console.log(6%'2')//计算6/2的余数  余数为0

console.log(5/0)//Infinity 表明 无穷的意思

2.赋值运算符

  1. =
  2. +=
  3. -=
  4. *=
  5. /=
  6. %=
//   =
     var a=1
     console/log(a)//a:1
     var b=2
     console/log(b)//b:2
     
 //   +=
    var a=1
    a = a + 10//将变量a重新赋值为变量a+10  a=a+10--->a=1+10---->a=11
    console.log(a)//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)//a:0

//    *=
    var a=2
    a*=5//a*=5-->a=a*5-->a=2*5-->a=10
    console.log(a)//10
    
//    /=
    var a=4
    a/=2//a/=2-->a=a/2-->a=4/2-->a=2
    console.log(a)//2
    
//    %=
    var a=10
    a%=3//a%=3-->a=a%3-->a=10%3-->a=1
    console.log(a)//1

3.比较运算符

比较运算符两边的值之后,返回一个布尔值,也就是返回一个true或者false

  1. 判断大于 (>) ; 小于 (<) ; 大于等于(>=) ; 小于等于( <=)
console.log(3>4)//打印的时候,先看3是否大于4,因为3小于4,不满足大于4的条件,所以返回的是false 
console.log(4>3)//打印的时候,先看4是否大于3,因为4大于3,满足条件,所以返回的是true
console.log(1>=1)//判断1是否大于或等于1  此时满足第二个条件,也就是1等于1,所以返回的是true
  1. 判断相等: == === 在JS中等号出现两次或者三次时代表等于的意思
  • 两个等号与三个等号的区别(面试可能会问):
    == 在JS中判断时会隐式转换,也就是说 只会对比较值是否相等,不会对比数据类型

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

console.log(1 == 1)//判断符号两边的值是否相等 true
console.log(1 == '1')//判断符号两边的值是否相等(不会对比数据类型) true
console.log(1 === '1')//判断符号两边的值是否相等(会对比数据类型) false  因为数据类型不同!
  1. 判断不相等: != !==

共同点:判断符号两边的值是否不相等,不相等时返回 true 相等时返回 false

不同点: !=不会对比数据类型; !== 会对比数据类型

console.log(3 != 4)//判断符号两边是否不相等 true
console.log(9 !== 20)//判断符号两边是否不相等 true
console.log(3 != '3')//判断符号两边是否不相等 且不会对比数据类型,所以这里他认为3和'3'是相等的  所以会返回false
console.log(3 !== '3')//判断符号两边是否不相等 且会对比数据类型,所以他认为3和'3'是不相等的  所以会返回true

4.逻辑运算符

4.1 && 逻辑与(相当于并且的意思)

  • 逻辑与运算符的特性
  1. 符号左边的值 如果为真(也就是转为布尔值后为true),那么会返回符号右边的值
  2. 符号左边的值 如果为假,也就是转为布尔值后为false,那么会将自身返回出去
    console.log(1 && 100)//100 根据逻辑与运算符的特性,返回的值是100
    console.log(0 && 99)// 根据逻辑与运算符的特性,返回的值是0
    console.log(true && 'qwer')//qwer
    console.log(false && 'qwer')//false

4.2 || 逻辑或(相当于或者的意思)

  • 逻辑或运算符特性
  1. 符号左边的值 如果为真,那么会将自身返回出去
  2. 符号左边的值 如果为假,那么会将符号右边的值返回出去
    console.log(1 || 100)//1  根据逻辑或的特性
    console.log(0 || 99)//99  根据逻辑或的特性

4.3 ! 逻辑非(取反,反义词)

  • 逻辑非运算符特性
  1. 语法 !值
  2. 返回值:将值转换为布尔值之后,做一个取反的操作,也就是true改变为false false改变为true
    console.log(!99)//!99--->!true--->false
    console.log(!0)//!0--->!false--->true
    console.log(!true)//false

5.自增自减运算符

  • 语法:(自增自减都是相同的语法,这里就拿自增为例)
    1. ++值
    1. 值++
  • 作用:自增运算符的能力就是将自身的值+1;自减运算符的能力就是将自身的值-1
  • 自增自减运算符写法不同,运行结果也不同
  1. ++值(++在前)

    如果 ++ 在前,那么会先将自身的值 +1 然后参与其他的

  2. 值++(++在后)

    如果 ++ 在后,那么会先参与其他的 然后将自身的值 +1

     var a=1
     var b=1
     console.log(++a)//2  如果 ++ 在前,那么会先将自身的值 +1 然后打印到控制台
     console.log(b++)//1  如果 ++ 在后,那么会先将目前的值打印到控制台 然后将自身的值 +1  也就是说,这行运行完毕后,b的值变为2了
     console.log(a,b)//2  2