运算符及优先级


运算符也叫操作符
通过运算符可以对一个或多个值进行运算,并获取运算结果
比如: typeof就是运算符,可以来获得一个值的类型
它会将该值的类型以字符串的形式返回
number string boolean undefined object

算数运算符:

+,-,*,/,%;

当对非Number类型的值进行运算时,会将这些值转换为Number然后在运算(除了字符串加法)
任何值和NaN做运算都得NaN

  • “+” 加号:
    可以对两个值进行加法运算,并将结果返回
    如果对两个字符串进行加法运算,则会做拼串
    会将两个字符串拼接为一个字符串,并返回(常用于换行拼串)
    任何的值和字符串做加法运算,都会先转换为字符串,然后再和字符串做拼串的操作

我们可以利用这一特点,来将一个任意的数据类型转换为String我们只需要为任意的数据类型+一个" ”即可将其转换为String,这是一种隐式的类型转换,由浏览器自动完成,实际上它也是调用String (0)函数

运算是从左向右的,所以

result = 1+2+"3";//输出为33,类型为string
result = "1"+2+3;//输出为123,类型为string
console.log("result"+result);
  • “-” 减号:
    可以对两个值进行减法运算,并将结果返回
    任何值做减法,运算时都会自动转换为Number
    我们可以利用这一特点做隐式的类型转换
    可以通过为一个值-0 *1 /1来将其转换为Number
    原理和Number()函数一样,使用起来更加简单

  • “*” 乘法:
    对两值进行乘法运算,

  • “/” 除法:
    对两值进行除法运算,

  • “%” 取余:
    对两值进行除法并返回余数,

逻辑运算符

JS中为我们提供了三种逻辑运算符

“!”非
可以用来对一个值进行非运算

  • 所谓非运算就是值对一个布尔值进行取反操作,
    true变false,false变true

    • 如果对一个值进行两次取反,它不会变化

    • 如果对非布尔值进行元素,则会将其转换为布尔值,然后再取反
      所以我们可以利用该特点,来将一个其他的数据类型转换为布尔值可以为一个任意数据类型取两次反,来将其转换为布尔值,

      原理和Boolean()函数一样

“&&”与
&&可以对符号两侧的值进行与运算并返回结果

  • 运算规则
    • 如果两个值都是true则返回true
    • 只要有一个值是false,就返回false

第一个值为true,会检查第二个值
第一个值为false,不会检查第二个值

“||”或

  • 运算规则

    • 两个都是false,则返回false
    • 只要有一个true,就返回true
  • JS中的“或”属于短路的与
    第一个值为false,会检查第二个值
    第一个值为true,不会检查第二个值

非布尔值的与或运算

对于非布尔值进行与或运算时,
会先将其转换为布尔值,然后再运算,并且返回原值

  • 与运算:

    • 如果两个值都为true,则必然返回第二个值
    • 如果两个值中有false,则直接返回第一个值
  • 或运算:

    • 如果两个值都为true,则必然返回第一个值
    • 如果两个值中有false,则直接返回第二个值

赋值运算符

“=” 可以将符号右侧的值赋值给符号左侧的变量

  • "+="
    a += 5等价于a = a +5

  • "-="
    a -= 5等价于a = a -5

  • "*="

    a *= 5等价于a = a *5

  • "/="

    a /= 5等价于a = a /5

关系运算符

通过关系运算符可以比较两个值之间的大小关系,
如果关系成立它会返回true,如果关系不成立则返回false

例如:大于号
判断符号左侧的值是否大于右侧的
如果关系成立,返回true,如果关系不成立则返回false

对于非数值情况
会将其转换为数值,再进行比较
如果两边都是字符串,不会将其转换为数字进行比较而是对字符串的编码进行比较
比较字符串编码时是一位一位进行比较,如果两位一样,则比较下一位

console.log("123456" < "5");//返回true

相等运算符

“==”相等运算符

如果相等会返回true,否则返回false

  • 使用==来做相等运算
    • 当使用==来比较两个值时,如果值的类型不同,
      则会自动进行类型转换,将其转换为相同的类型然后在比较
    • null不会转换为0,所以会返回false;
      undefined 衍生自null,所以这两个值做相等判断时,会返回true
    • NaN不和任何值相等,包括他本身
      可以通过isNaN()函数来判断一个值是否是NaN

“!=”不相等运算符

如果不相等会返回true,否则返回false
不相等也会对变量进行自动的类型转换

“===”全等

判断两值是否相等,不做类型转换。类型不同直接返回false

“!==”不全等

判断两值是否不全等,不做类型转换。类型不同直接返回true

条件运算符(三元运算符)

语法:
条件表达式?语句1:语句2;

  • 执行的流程:
    条件运算符在执行时,首先对条件表达式进行求值,
    • 如果该值为true,则执行语句1,并返回执行结果
    • 如果该值为false,则执行语句2,并返回执行结果
a > b ? alert("语句1"):alert("语句2");

可以嵌套使用,但不方便阅读,不推荐使用。

运算符的优先级

,运算符
使用,可以分割多个语句,一般可以在声明多个变量时使用,
使用,运算符同时声明多个变量。可以同时声明多个变量并赋值

就和数学中一样,在]S中运算符也有优先级,比如:先乘除 后加减;

优先级 运算符类型 结合性 运算符
21 分组 n/a(不相关) ( … )
20 成员访问 从左到右 … . …
需计算的成员访问 从左到右 … [ … ]
new(带参数列表) n/a new … ( … )
函数调用 从左到右 … ( … )
可选链(Optional chaining) 从左到右 ?.
19 new(无参数列表) 从右到左 new …
18 后置递增 n/a … ++
后置递减 … --
17 逻辑非 (!) 从右到左 ! …
按位非 (~) ~ …
一元加法 (+) + …
一元减法 (-) - …
前置递增 ++ …
前置递减 -- …
typeof typeof …
void void …
delete delete …
await await …
16 幂 (**) 从右到左 … ** …
15 乘法 (*) 从左到右 … * …
除法 (/) … / …
取余 (%) … % …
14 加法 (+) 从左到右 … + …
减法 (-) … - …
13 按位左移 (<<)< /td> 从左到右 … << …
按位右移 (>>) … >> …
无符号右移 (>>>) … >>> …
12 小于 (<)< /td> 从左到右 … < …
小于等于 (<=)< /td> … <= …
大于 (>) … > …
大于等于 (>=) … >= …
in … in …
instanceof … instanceof …
11 相等 (==) 从左到右 … == …
不相等 (!=) … != …
一致/严格相等 (===) … === …
不一致/严格不相等 (!==) … !== …
10 按位与 (&) 从左到右 … & …
9 按位异或 (^) 从左到右 … ^ …
8 按位或 (|) 从左到右 … | …
7 逻辑与 (&&) 从左到右 … && …
6 逻辑或 (||) 从左到右 … || …
5 空值合并 (??) 从左到右 … ?? …
4 条件(三元)运算符 从右到左 … ? … : …
3 赋值 从右到左 … = …
… += …
… -= …
… **= …
… *= …
… /= …
… %= …
… <<= …
… >>= …
… >>>= …
… &= …
… ^= …
… |= …
… &&= …
… ||= …
… ??= …
2 yield 从右到左 yield …
yield* yield* …
1 逗号 / 序列 从左到右 … , …
posted @ 2021-12-24 20:03  苏槿年  阅读(218)  评论(0编辑  收藏  举报