运算符

126 阅读8分钟

js支持的运算符

  • 在js中可以使用那些运算符对数据进行运算。
  1. 赋值运算符
  2. 算数运算符
  3. 复合赋值运算符
  4. 关系运算符
  5. 逻辑运算符
  6. 位运算符
  7. 条件运算符
  • 设计到的概念:
    1:运算符
    2:操作数  1+1:参与运算符运算的数据。
        + :运算符
        1 、1 操作数
    3:表达式:1+1 就是一个表达式:
        运算符和操作数的整体就称为表达式。
        常量表达式:所有的操作数都是常量。
        变量表达式:有操作数是变量。
    4:返回值:
        表达式的返回值:表达式计算得到的结果。

    所有的计算,都是表达式或者是操作数的返回值参与的。

赋值运算符

  • 作用:将右边的操作数或者是表达式的返回值赋值给左边的变量或者是只读变量。
  • 语法: 变量 = 表达式;
var userId= 10086;
  • 注意:= 运算符在所有的运算符中的优先级最低。 赋值运算符最后做。

算数运算符

  • 一元运算符:只有一个操作数的运算符。 比如:+1 正数1 也称为单目运算符
  • 二元运算符:需要两个操作数的运算符。比如:1+1 也称为双目运算符。
  • 三元运算符:需要三个操作数的运算符。比如:条件运算符。 ? : 也称为三目运算符。
let type = Math.floor(Math.random()*2)
const gender = type==1?'男''女'
  • 算数运算符:
+:加 
-:减 
*:乘 
/: 除 
%: 取余 
++:自增
    ++ : 自增运算符:对变量进行自增1的操作。 
    语法: 
        1:前缀模式: ++ num; 
        2:后缀模式: num ++; 
        后缀模式:后缀模式的表达式的返回值是自增之前的值。先返回后自增。 
        前缀模式:先自增,后返回。
--:自减 作用:对变量自减1. 语法同上。 模式同上。

复合赋值运算符

  • +=
let a = 1,b = 1
a += b 等价于 a = a+b
  • -=
let a = 1,b = 1
a -= b 等价于 a = a-b
  • *=
let a = 1,b = 1
a *= b 等价于 a = a*b
  • /=
let a = 1,b = 1
a /= b 等价于 a = a/b
  • %=
let a = 1,b = 1
a %= b 等价于 a = a%b

关系运算符

> < >= <= == !=

  1. 一共有6个关系运算符。都是双目运算符。需要两个操作数。
  2. 作用:用来比较两个操作数的关系是否成立的
  3. 返回:如果关系成立,关系表达式,返回true。不成立,返回false。
  4. 关系表达式返回结果为布尔值(boolean)。
let a = 1,b=1;
console.log(a>b)
if(a<b){}else{}

逻辑运算符

  • 逻辑运算符:参与逻辑运算的操作数都是布尔值。
  • 如果操作数不是布尔值。那么会进行类型的转换,转换为布尔值
  • 逻辑表达式的返回值都是布尔值。
  • &&:逻辑与,二元运算符。
if(true&&true){
    console.log('同真才真')
}
  • ||: 逻辑或,二元运算符。
if(true||false){
    console.log('有真就真')
}
  • !:逻辑非,逻辑取反,单目运算符。
逻辑与 && 逻辑或 ||,都具有短路的特点。
  • 逻辑与的短路:当有一个操作数的结果为false,那么其他的操作数将直接被短路掉,不再执行。
var num = 0; 
console.log (num < 0 && num++ == 0);//false 
console.log (num);

&& 同true则true 遇flase则flase;当遇到第一个flase时,后面的判断表达式直接短路(跳过)

  • 逻辑或的短路:当有一个操作数的结果为true,那么其他的操作数将被短路,不再执行。
var num = 0; 
console.log (num < 1 || num++ == 0); 
console.log (num);

||遇true则true ,同flase则flase;当遇到第一个true时,后面的判断表达式直接短路(跳过)

#### 逻辑与&& ,逻辑或|| 的返回值
  • 逻辑与:a&&b
a&&b
如果a==true 返回值b 
    a==false 返回值a
  • 逻辑或:a||b
a||b
如果a==true 返回值为a 
如果a==false 返回值为b

这个返回值也是逻辑运算出现短路的底层原因

位运算符:

  1. 运算符只能对整数做操作。如果不是整数,就会对操作数的小数部分做截断。
  2. 位运算符直接对底层的二进制位做操作。所以效率比较高。所以如果能用位运算符实现的功能 就使用位运算实现。
  3. 位运算符:& | ^ ~ >> << >>>
  • & 按位与:二元运算符。对应的二进制位进行与操作。规则:有0则0,全1则1.
  • 0b 表示二进制数
3 = 0b11
7 = 0b111
console.log (3 & 7);//3 0b111
5 = 0b101 等价于 0b0101
8 = 0b1000
console.log (5 & 8);//0 0b0000
  • | 按位或:二元运算符。对应的二进制位进行或操作。规则:有1则1,全0则0.
3 = 0b11
7 = 0b111
console.log (3 | 7);//7  0b111
5 = 0b101 等价于 0b0101
8 = 0b1000
console.log (5 | 8);//13 0b1101
1 0b1
2 0b10
console.log (1 | 2);//3 0b11
4 0b100
console.log (1 | 2 | 4);//7 0b111

console.log (1 | 2 | 4 | 8);//15 0b1111
16 0b10000
console.log (8 | 16);//24 0b11000
  • ^ :按位异或。二元运算符。对应的二进制位进行异或操作。规则:相异为1,相同为0
  • 特点:一个数,先后异或同一个数两次,结果是它自身。
5 0b101
2 0b10 等价于 0b010
console.log (5 ^ 2);//7 0b111
console.log (7 ^ 7);//0 ob000
console.log (7 ^ 7 ^ 7);//7
  • 应用:不用定义第三方变量,实现交换两个变量的值。
var num1 = 97;       //0b1100001
var num2 = 20;       //0b0010100  
num1 = num1 ^ num2;  //0b1110101
//将num1初始值赋值给了num2.但是num1 的值是变化了的。 
num2 = num1 ^ num2;  //0b1100001
//将num2原始的值赋值给了num1。 
num1 = num1 ^ num2;  //0b0010100 
console.log (num1);// 20
console.log (num2);// 97
  • ~ 按位取反:单目运算符。所有的二进制位全部取反,1变0,0变1.
  • 运算符只能对整数做操作。如果不是整数,就会对操作数的小数部分做截断。
5 0b101
console.log (~~5.999999999999);
  • 取整的应用。
console.log (~~(Math.random()*10));
  • 返回 [MIN,MAX) 中随机一个整数
function getRandomIntNum(MIN,MAX){
  return ~~(Math.random()*(MAX-MIN)+MIN);
}
  • >>右移运算符:用于将一个数的二进制表示向右移动指定的位数。
  • 语法:x >> y,其中 x 是要进行移位的数,y 是要右移的位数。
  1. 右移运算符将 x 的二进制表示向右移动 y 位,并用 0 填充左侧空出的位。
  2. x 是正数,则右移操作会在左侧填充 0
  3. x 是负数,则右移操作会在左侧填充 1。
let x = 10; // 0b1010 
let y = 2; 
let result = x >> y; // 将 x 右移 2 位 
console.log(result); // 输出结果为 2,0b10
  • <<左移运算符:用于将一个数的二进制表示向左移动指定的位数。
  • 语法:x << y,其中 x 是要进行移位的数,y 是要左移的位数。
  1. 左移运算符将 x 的二进制表示向左移动 y 位,并在右侧用 0 填充空出的位
  2. 左移运算的结果是将原始数乘以 2 的 y 次幂。
let x = 5; // 0b101
let y = 2;
let result = x << y; // 将 x 左移 2 位
console.log(result); // 输出结果为 20,0b10100
  • >>> 是无符号右移运算符,用于将一个数的二进制表示向右移动指定的位数,且右移操作时用零填充左侧的空位。
  • 语法: x >>> y,其中 x 是要进行移位的数,y 是要右移的位数。
  1. 与右移运算符 >> 不同的是,>>> 在移位时不管符号位,始终用 0 来填充左侧空位。
let x = -10; // 负数 -10 的二进制表示为 11111111111111111111111111110110 
let y = 2; let result = x >>> y; // 将 x 无符号右移 2 位 
console.log(result); // 输出结果为 1073741821,二进制表示为 00111111111111111111111111110110

条件运算符

条件运算符是js中的唯一的一个三目运算符。需要三个操作数。

 语法: 操作数1 ? 操作数2 :操作数3;
 操作数1:必须是一个返回值为布尔值的表达式。
 操作数2:任意的js的合法的表达式即可。有返回值就可以。
 操作数3和2一样的。
  • 执行过程:
  1. 先计算操作数1的返回值。
  2. 如果返回是true。那么执行操作数2.并将操作数2的返回值作为整个条件表达式的返回值。
  3. 如果操作数1返回值为false,那么就跳过操作数2, 执行操作数3,并将3的表达式的返回值作为整个条件表达式的返回值。
let  achievement = ~~(Math.random()*101)
let comment = achievement<60?'未及格':achievement<80?'良好':achievement<100?'优秀':'满分'
console.log(`你的这次成绩为:${comment}`);

# 运算符的优先级的规律

  1. 乘除取余大于加减。
  2. 一元运算符大于二元运算符
  3. 二元运算符大于三元运算符。
  4. 赋值运算符的优先级最低。
  5. 移位操作的优先级低于 加减。
  6. 小括号的优先级最高。如果想让某些表达式优先计算,使用小括号配合。

js运算符优先级.png