0


JavaScript-语言基础(操作符)

文章目录

操作符:用于实现赋值、比较和执行算数运算等功能的符号

一、一元操作符

只操作一个值的操作符叫一元操作符(unary operator)

1.1 递增/递减操作符(++、- -)

如果需要反复给数字变量添加或减去 1,可以使用递增(++)和递减( - - )操作符来完成

在 JavaScript 中,递增(++)和递减( - - )既可以放在变量前面,也可以放在变量后面。放在变量前面时,我们可以称为前缀递增(递增)操作符,放在变量后面时,我们可以称为后缀递增(递减)操作符

注意:递增和递减操作符必须和变量配合使用

前缀版

  • 无论前缀递增还是递减操作符,变量的值会在语句被求值前改变
let age =29;let anotherAge =--age +2;
console.log(age);//28
console.log(anotherAge);//30
  • 前缀递增和递减在语句中的优先级是相等的,因此会从左到右依次求值
let num1 =2;let num2 =20;let num3 =--num1 +++num2;// 1 + 21let num4 = num1 + num2 // 1 + 21
console.log(num3);// 22
console.log(num4);// 22

后缀版

  • 后缀版递增和递减在语句被求值后才发生
let num1 =2;let num2 =20;let num3 = num1--+ num2;// 2 + 20let num4 = num1 + num2;// 1 + 20let num5 = num1+++ num2--// 1 + 20
console.log(num3);// 22
console.log(num4);// 21
console.log(num5);// 21
console.log(num1);// 2
console.log(num2);// 19

递增和递减操作符都遵循如下规则(不限于整数)

  • 对于字符串,如果是有效的数值形式,则转换为数值再应用改变。变量类型从字符串变成数值
  • 对于字符串,如果不是有效的数值形式,则将变量的值设置为NaN 。变量类型从字符串变成 数值
  • 对于布尔值,如果是false,则转换为0 再应用改变。变量类型从布尔值变成数值
  • 对于布尔值,如果是true,则转换为1 再应用改变。变量类型从布尔值变成数值
  • 对于浮点值,加 1 或减 1
  • 如果是对象,则调用其 valueOf() 方法取得可以操作的值。对得到的值应用上述规则。如果是NaN,则调用toString()并再次应用其他规则。变量类型从对象变成数值

1.2 一元加和减(+、-)

  • 一元加由一个加号( + )表示,放在变量前面,对数值没有任何影响
let num =25;
num =+num;
console.log(num);// 25
  • 如果将一元加应用到非数值,则会执行与使用 Number() 转型函数一样的类型转换
let s1 ='01';
s1 =+s1;// 1let s2 ='1.1';
s2 =+s2;// 1.1let s3 ='z';
s3 =+s3;// NaNlet b =false;
b =+b;// 0let f =1.1;
f =+f;// 1.1let o ={valueOf(){return-1;}};
o =+o;// -1
  • 一元减由一个减号( - )表示,放在变量前面,主要用于把数值变成负值
let num =25;
num =-num;
console.log(num);// -25
  • 在遇到非数值时,一元减会遵循和一元加一样的规则
let s1 ='01';
s1 =-s1;// -1let s2 ='1.1';
s2 =-s2;// -1.1let s3 ='z';
s3 =-s3;// NaNlet b =false;
b =-b;// 0let f =1.1;
f =-f;// -1.1let o ={valueOf(){return-1;}};
o =+o;// 1

二、位操作符

用于数值的底层操作,也就是操作内存中表示数据的比特(位)

三、布尔操作符(!、&&、||)

布尔操作符一共有 3 个:逻辑非、逻辑与、逻辑或

布尔操作符是用来进行布尔值运算的操作符,其返回值也是布尔值。开发中经常用于多个条件的判断

3.1 逻辑非( ! )

逻辑非操作符首先将操作数转化为布尔值,然后在取反

数据类型取反对象false空字符串true非空字符串false数值0true非0数值(包括 Infinity)falsenulltrueNaNtrueundefinedtrue

逻辑非操作符也可以用于把任意值转换为布尔值,即同时使用两个叹号( !! ),相当于调用了转型函数 Bollean()

console.log(!!'张三');// true
console.log(!!0);// false
console.log(!!NaN);// false
console.log(!!'');// false
console.log(!!123);// true

3.2 逻辑与( && )

口诀:一假则假,只要两边有一个为假,就返回假(false)

let result =2<1&&3>1// false && true
console.log(result);//false

3.3 逻辑或( || )

口诀:一真则真,只要两边有一个为真,就返回真( true )

let result =2<1||3>1// false || true
console.log(result);// true

3.4 短路运算(逻辑中断)

当有多个表达式(值)时,左边的表达式值可以确定结果时,就不再继续运算右边的表达式的值

通俗的讲,哪边表达式能确定最终结果,就返回哪边

逻辑与

语法: 表达式1 && 表达式2

  • 如果表达式1的值为真,则返回表达式2,因为只有确定表达式2的真假,才能判断整体的真假
  • 如果表达式1的值为假,则返回表达式1,因为表达式1 已经可以确定整体的真假了
console.log(123&&456);// 456
console.log(0&&456);// 0
console.log(123&&456&&789);// 789

场景返回值第一个操作数是对象返回第二个操作数第二个操作数是对象只有第一个操作数求值为true 才会返回该对象两个操作数都是对象返回第二个操作数有一个操作数是nul返回null有一个操作数是NaN返回NaN有一个操作数是undefined返回undefined
逻辑或

语法: 表达式1 || 表达式2

  • 如果表达式1的值为真,则返回表达式1
  • 如果表达式1的值为假,则返回表达式2
console.log(123||456);//  123
console.log(0||456);//  456
console.log(123||456||789);//  123

场景返回值第一个操作数是对象第一个操作数第二个操作数是对象返回第二个操作数两个操作数都是对象返回第一个操作数两个操作数都是null返回null两个操作数都是NaN返回NaN两个操作数都是undefined返回undefined

四、乘性操作符( * 、 / 、%)

ECMAScript 定义了 3 个乘性操作符:乘法、除法、取模

4.1 乘法操作符( * )

用于计算两个数值的乘积

let result =3*6
console.log(result);// 18

乘法操作符在处理特殊值时,也会有一些特殊行为

  • 如果操作数都是数值,则执行常规的乘法运算,即两个正值相乘是正值,两个负值相乘也是正值,正负符号不同的值相乘得到负值。如果 ECMAScript 不能表示乘积,则返回 Infinity 或 -Infinity
  • 如果有任一操作数是 NaN,则返回 NaN
  • 如果是 Infinity 乘以 0,则返回NaN
  • 如果是 Infinity 乘以非 0 的有限数值,则根据第二个操作数的符号返回 Infinity 或 -Infinity
  • 如果是 Infinity 乘以 Infinity,则返回Infinity
  • 如果有不是数值的操作数,则先在后台用 Number()将其转换为数值,然后再应用上述规则

4.2 除法操作符( / )

用于计算第一个操作数除以第二个操作数的商

let result =6/3
console.log(result);// 2

与乘法操作符一样,除法操作符针对特殊值时也有一些特殊行为

  • 如果操作数都是数值,则执行常规的除法运算,即两个正值相除是正值,两个负值相除也是正值,符号不同的值相除得到负值。如果ECMAScript不能表示商,则返回 Infinity 或 -Infinity。
  • 如果有任一操作数是 NaN,则返回 NaN
  • 如果是 Infinity 除以 Infinity,则返回 NaN
  • 如果是 0 除以 0,则返回 NaN
  • 如果是非 0 的有限值除以 0,则根据第一个操作数的符号返回 Infinity 或 -Infinity
  • 如果是 Infinity 除以任何数值,则根据第二个操作数的符号返回 Infinity 或 -Infinity
  • 如果有不是数值的操作数,则先在后台用 Number() 函数将其转换为数值,然后再应用上述规则

4.3 取模(取余)操作符( % )

let result =26%5
console.log(result);// 1

与乘法操作符一样,取模操作符针对特殊值时也有一些特殊行为

  • 如果操作数是数值,则执行常规除法运算,返回余数
  • 如果被除数是无限值,除数是有限值,则返回 NaN
  • 如果被除数是有限值,除数是 0,则返回 NaN
  • 如果是 Infinity 除以 Infinity,则返回NaN
  • 如果被除数是有限值,除数是无限值,则返回被除数
let result =26%Infinity
console.log(result);// 26
  • 如果被除数是 0,除数不是 0,则返回 0
  • 如果有不是数值的操作数,则先在后台用 Number() 函数将其转换为数值,然后再应用上述规则

五、指数操作符( ** )

  • ES7新增了指数操作符,Math.pow() 现在有了自己的操作符( ** )
console.log(Math.pow(3,2));// 9
console.log(3**2);// 9

console.log(Math.pow(16,0.5));// 4
console.log(16**0.5);// 4
  • 指数操作符也有自己的指数赋值操作符(**=)
let num =3;
num **=2;
console.log(num);//9

六、加性操作符(+、-)

加性操作符,即加法和减法操作符

6.1 加法操作符( + )

如果两个操作符都是数值,遵循如下规则:
场景返回值如果有任一操作数是 NaNNaNInfinity + InfinityInfinity-Infinity + (-Infinity )-Infinity-Infinity + InfinityNaN+0 + (+0)+0-0 + (+0)+0-0 + (-0)-0两个操作数都是字符串将第二个字符串拼接到第一个字符串后面只有一个操作数是字符串将另一个操作数转换为字符串,再将两个字符串拼接在一起

如果有任一操作数是对象、数值或布尔值,则调用它们的 toString() 方法以获取字符串,然后再应用前面的关于字符串的规则

对于undefined 和null,则调用 String() 函数,分别获取 “undefined"和"null”。

特别提醒:

let num1 =5;let num2 =10;let message1 ='Hello'+ num1 + num2;
console.log(message1);// 'Hello510'let message2 ='Hello'+(num1 + num2);
console.log(message2);//Hello15

6.2 减法操作符( - )

场景返回值两个操作数都是数值执行数学减法运算并返回结果如果有任一操作数是 NaNNaNInfinity - InfinityNaN-Infinity - (-Infinity )NaNInfinity + (-Infinity)Infinity-Infinity -Infinity)-Infinity+0 - (+0)+0+0 - (-0)-0-0 - (-0)+0

如果有任一操作数是字符串、布尔值、null 或 undefined,则先在后台使用 Number() 将其转
换为数值,然后再根据前面的规则执行数学运算。如果转换结果是NaN,则减法计算的结果是
NaN

如果有任一操作数是对象,则调用其 valueOf() 方法取得表示它的数值。如果该值是 NaN,则
减法计算的结果是 NaN。如果对象没有 valueOf() 方法,则调用其 toString() 方法,然后再
将得到的字符串转换为数值

let result1 =5-true;// true被转换为1,结果为 4let result2 =NaN-1;// NaNlet result3 =5-3;// 2let result4 =5-"";// ""被转换为 0 ,结果为 5let result5 =5-"2"// 3let result6 =5-null// null被转换为 0 ,结果为 5

七、关系操作符(<、>、<=、>=)

小于(<)、大于(>)、小于等于(<=)、大于等于(>=),用法跟数学课上学的一样。这几个操作符都返回布尔值

场景规则操作数都是数值执行数值比较操作数都是字符串逐个比较字符串中对应字符的编码有任一操作数是数值将另一个操作数转换为数值,执行数值比较有任一操作数是对象调用其valueOf()方法,取得结果后再根据前面的规则执行比较。如果没有valueOf()操作符,则调用toString()方法,取得结果后再根据前面的规则执行比较。有任一操作数是布尔值将其转换为数值再执行比较有任一操作数是NaN直接返回falseundefined直接返回false

八、相等操作符(==、!=、 ===、 !==)

8.1 等于和不等于(==、!=)

  • ECMAScript 中的等于操作符用两个等于号(==)表示,如果操作数相等,则会返回true
  • 不等于操作符用叹号和等于号(!=)表示,如果两个操作数不相等,则会返回true
  • 两个操作符都会先进行类型转换(通常称为强制类型转换)再确定操作数是否相等

在转换操作数类型时,这两个操作符遵循如下规则:
场景规则如果任一操作数是布尔值将其转换为数值再比较是否相等。false 转换为0,true 转换为1。如果一个操作数是字符串,另一个操作数是数值尝试将字符串转换为数值,再比较是否相等如果一个操作数是对象,另一个操作数不是调用对象的 valueOf() 方法取得其原始值,再根据前面的规则进行比较
在进行比较时,这两个操作符遵循如下规则:

  • null 和 undefined 相等
  • null 和 undefined 不能转换为其他类型的值再进行比较
  • 如果有任一操作数是NaN,则相等操作符返回false,不相等操作符返回true。记住:即使两个操作数都是NaN,相等操作符也返回false,因为按照规则,NaN 不等于NaN
  • 如果两个操作数都是对象,则比较它们是不是同一个对象。如果两个操作数都指向同一个对象,则相等操作符返回true。否则,两者不相等。
    表达式结果null == undefinedtrue“NaN” == NaNfalse5 == NaNfalseNaN == NaNfalseNaN != NaNtruefalse == 0truetrue == 1truetrue == 2falseundefined == 0falsenull == 0false“5” == 5true

    8.2 全等与不全等(

    ===、!==
    

全等和不全等操作符与相等和不相等操作符类似,只不过它们在比较相等时不转换操作数

  • 全等( === )
let result1 =("55"==55);// truelet result2 =("55"===55);//false
  • 不全等( !== )
let result1 =("55"!=55);// falselet result2 =("55"!==55);// true

九、条件操作符( ? )

条件表达式为 true ,返回第一个、false 返回第二个

let num1 =5;let num2 =10;let max = num1 > num2 ? num1 : num2;
console.log(max);//10

十、赋值操作符( =,+= )

简单赋值用等于号(=)表示,将右手边的值赋给左手边的变量

let num =10;
num = num +10;//通过复合赋值,可以写成let num =10;
num +=10;

每个数学操作符以及其他一些操作符都有对应的复合赋值操作符:

  • 乘后赋值( *= )
  • 除后赋值( /= )
  • 取模后赋值( %= )
  • 加后赋值( += )
  • 减后赋值( -= )
  • 左移后赋值( <<= )
  • 右移后赋值(>>= )
  • 无符号右移后赋值( >>>= )

十一、逗号操作符( , )

  • 逗号操作符可以用来在一条语句中执行多个操作
let num1 =1, num2 =2, num3 =3;
  • 在赋值时使用逗号操作符分隔值,最终会返回表达式最后一个值
let num =(5,1,4,8,0)//num的值为 0

十二、操作符优先级

优先级顺序1( )2++、- -、!3先 *、/、% 后 +、-4>、>=、<、<=5

== 、!=、===、!==

6先 && 后||7=8,

标签: 前端 javascript

本文转载自: https://blog.csdn.net/weixin_41071974/article/details/123644941
版权归原作者 每天内卷一点点 所有, 如有侵权,请联系我们删除。

“JavaScript-语言基础(操作符)”的评论:

还没有评论