资讯专栏INFORMATION COLUMN

上云采购季！| 爆款云服务器低至4.6元/月，首单享0.9折

免费试用
首页/文章专栏/javascript操作符知识点整理

javascript操作符知识点整理

JerryZou / 3386人阅读

摘要：中的操作符的不同之处在于，它们能够适用于很多值，例如字符串数字值布尔值甚至对象。在应用于布尔值时，先将其转换为再执行加减的操作。布尔值变量变为数值变量。在有一个操作数不是布尔值的情况下，逻辑与操作就不一定返回布尔值。

前言

初学者会觉得操作符的知识很简单，但是随着学习的深入会发现很多语句都可以用操作符来简化，所以深入理解操作符可以帮助你写出高性能的代码。这篇文章主要记录不同操作符所遵循的规则。
javascript的操作符有一元操作符、位操作符、布尔操作符、乘性操作符、加性操作符、关系操作符、相等操作符、条件操作符、赋值操作符。其中值得注意的是，一元操作符和相等操作符都有可能改变操作数的数值类型。js中的操作符的不同之处在于，它们能够适用于很多值，例如字符串、数字值、布尔值、甚至对象。不过在应用于对象时，相应的操作符都会调用对象的valueOf()方法或者toString()方法来转换成可以操作的数据类型。

一元操作符

递增操作符 ++

递减操作符 --

正数 +

负数 -

递增和递减操作符遵循的规则.
1.在应用于包含有效数字的字符串时，先将其转换为数字值，再执行加减1的操作。字符串变量变成数值变量。
2.在应用于一个不包含有效数字字符的字符串时，将变量的值设置为NaN。字符串变量变成数值变量。
3.在应用于布尔值false/true时，先将其转换为0再执行加减1的操作。布尔值变量变为数值变量。
4.在应用于浮点数值时，执行加减1的操作。
5.在应用于对象时，先调用对象的valueOf()方法以取得一个可供操作的值，然后对该值应用前面的四条规则。如果结果是NaN，则在调用toSring()方法后再应用前面的规则。对象变量变成数值变量。

var num = 1;
++num;    //2

var num ="12s";
++num;    //NaN
typeof num;    //number

var num = false;
++num;    //1
typeof num;    //number
位操作符

位操作符用于最基本的层次上，我们一般比较少用到。ECMAscript中所有数值都以IEEE-754 64位格式存储，但是位操作符并不直接操作64位的值，而是先将64位转换成32位的整数，然后执行操作，最后将结果转换回64位。这会带来一个严重的副效应，即在对特殊的NaN和Infinity值应用位操作时，两个值都会被当做0来处理。

按位非 ~

按位与 &

按位或 |

按位异或 ^

左移 <<

有符号右移 >>

无符号右移 >>>

布尔操作

布尔操作的重要性不言而喻。布尔操作用来测试两个值的关系，如果没有它们，那么如if...else这类的判断语句也就无用武之地了。

逻辑非 !

逻辑与 &&

逻辑或 ||

逻辑非(!)

只操作1个操作数，无论操作数是什么数据类型，都返回一个布尔值。逻辑非操作不会改变操作数的数据类型。
逻辑非(!)操作符的规则：
1.如果操作数是一个对象，则返回false。
2.日字旁操作数是一个空字符串，则返回true。
3.如果操作数是一个非空字符串，则返回false。
4.如果操作数值是0，则返回true。
5.如果操作数是任意非0数值（包括Infinity），返回false。
6.如果操作数是null，返回true。
7.如果操作数是NaN,返回true。
8.如果操作数是undefined，返回true。

逻辑与(&&)

逻辑与有两个操作数，它可以应用于任何类型的操作数，而不仅仅是布尔值。在有一个操作数不是布尔值的情况下，逻辑与操作就不一定返回布尔值。
逻辑与（&&）操作符的规则
1.如果第一个操作数是对象，则返回第二个操作数。
2.如果第二个操作数是对象，则只有在第一个操作数的求值结果为true时才返回这个对象。
3.如果两个操作数都是对象，则返回第二个操作数。
4.如果有一个操作数时null，则返回null。
5.如果有一个操作数时undefined，则返回undefined。
可见逻辑与是一种短路操作，如果第一个操作数能够决定结果（如null，undefined），那么就不会对第二个操作数求值。

var a = {};
var b;
a && b;  //undefined

var a = 3;
var b = {};
a && b;  //b

var a = null;
var b = {};
a && b;  //null
逻辑或(||)

逻辑或的操作数有两个，如果其中有一个操作数不是布尔值，逻辑或也不一定返回布尔值，它遵循的规则如下：
1.如果第一个操作数是对象，则返回第一个操作数；
2.如果第一个操作数求值结果为false，则返回第二个操作数；
3.如果两个操作数都为对象，则返回第一个操作数；
4.如果两个操作数都是null，则返回null；
5.如果两个操作数都是NaN,则返回NaN；
6.如果连个操作数都是undefined，则返回undefined。
可见逻辑或也是一种短路语句，如果第一个操作数的求值结果为true则不会对第二个操作数进行求值。
注意：由以上规则可知，逻辑操作符均不会改变操作数的数据类型。
利用逻辑与来避免为变量赋null或者undefined的值，如下：

var myObject = preferObject || backupObject;
乘性操作符

乘性操作符和其他语言中的乘性操作符用法类似，只不过在操作数为非数值的情况下会执行自动的类型转换。即参与乘性计算的某个操作数不是数值，会先使用Number()转型函数将其转换为数值。但是乘性操作不会改变操作数数值类型。

乘法（＊）

除法（／）

求模（％）

var a = 1;
var b = false;
a*b; //0
typeof b;  //boolean
加性操作符

加性操作符在操作数都为数值的时候执行常规的加减法操作，在为非数值时会有特殊的转化规则。但是同乘性操作符一样加性操作符不会改变数值类型。

加法（＋）

减法（－）

加性操作符

加性操作符在有操作数为字符串时遵循以下规则：
1.如果两个操作数都为字符，则将第二个操作数与第一个操作数拼接起来；
2.如果只有一个操作数是字符串，则将另一个操作数转换为字符串，然后将两个字符串拼接起来；

减性操作符

1.如果有一个操作数是字符串，布尔值、null或者undefined，则先调用Number()方法，然后再根据数值减法规则执行减法计算。
2.如果有一个操作数是对象，则调用对象的valueOf()方法取得该对象的数值。如果对象没有valueOf()方法方法，则调用tostring()方法并将得到的字符串转换为数值。

关系操作符

小于（<）

大于（>）

小于等于（<=）

大于等于（>=）

相等操作符

相等（==）

不相等（!=）

全等（===）

不全等（!==）

相等和不相等

这组操作符是先转换再比较，即操作符会改变操作数的数值类型。
1.如果有一个操作数是布尔值，则在比较之前会转换为数值；
2.一个操作数是字符，另一个是数值，那么在比较相等性之前会将字符串转换为数值再进行比较；
3.如果一个操作符是对象，另一个不是，则调用valueOf()方法，将得到的结果进行比较。
4.如果两个都是对象，则比较是否是同一个对象，如果两个操作数都指向同一个对象，那么认为它们相等。

var a = "3";
var b = 3;
a == b;  //true
typeof a;  //number

var a = {};
var b = {};
a == b;  //false

var a = {};
var b = a;
var c = a;
b == c;  //true
全等和不全等

全等和不全等操作符不会改变操作数的数值类型。

条件操作符 
value = boolean_expression ? true_value : false_value

条件操作符会根据boolean_expression的求值结果来决定给变量value赋哪个值，求值为真是赋true_value值，为假时赋false_value值。

赋值操作符

赋值（＝）

乘／赋值（*=）

初／赋值（/=）

模／赋值（%=）

加／赋值（+=）

减／赋值（-=）

左移／赋值（<<=）

无符号右移／赋值（>>>=）

有符号右移／赋值（>>=）

逗号操作符

逗号操作符用于在一条语句中执行多个操作。

var num1=1, num2=2, num3=3;
操作符优先级

服务器托管 私有云 javascript知识点 javascript知识 javascript基本知识 javascript基础知识

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/87919.html

相关文章

  • 前端知识点整理

    摘要：难怪超过三分之一的开发人员工作需要一些知识。但是随着行业的饱和，初中级前端就业形势不容乐观。整个系列的文章大概有篇左右，从我是如何成为一个前端工程师，到各种前端框架的知识。 为什么 call 比 apply 快？ 这是一个非常有意思的问题。 作者会在参数为3个（包含3）以内时，优先使用 call 方法进行事件的处理。而当参数过多（多余3个）时，才考虑使用 apply 方法。 这个的原因...

    Lowky 评论0 收藏0

  • 前端知识点整理

    摘要：难怪超过三分之一的开发人员工作需要一些知识。但是随着行业的饱和，初中级前端就业形势不容乐观。整个系列的文章大概有篇左右，从我是如何成为一个前端工程师，到各种前端框架的知识。 为什么 call 比 apply 快？ 这是一个非常有意思的问题。 作者会在参数为3个（包含3）以内时，优先使用 call 方法进行事件的处理。而当参数过多（多余3个）时，才考虑使用 apply 方法。 这个的原因...

    snowLu 评论0 收藏0

  • JavaScript易错知识点整理

    摘要：知识点变量作用域上方的函数作用域中声明并赋值了，且在之上，所以遵循就近原则输出等于。上方的函数作用域中被重新赋值，未被重新声明，且位于之下，所以输出全局作用域中的。上方利用方法进行对象的深拷贝可以避免源对象被篡改的可能。 前言 本文是我学习JavaScript过程中收集与整理的一些易错知识点，将分别从变量作用域，类型比较，this指向，函数参数，闭包问题及对象拷贝与赋值这6个方面进行由...

    vincent_xyb 评论0 收藏0

  • JavaScript易错知识点整理

    摘要：知识点变量作用域上方的函数作用域中声明并赋值了，且在之上，所以遵循就近原则输出等于。上方的函数作用域中被重新赋值，未被重新声明，且位于之下，所以输出全局作用域中的。若执行则会输出。上方利用方法进行对象的深拷贝可以避免源对象被篡改的可能。 前言 本文是我学习JavaScript过程中收集与整理的一些易错知识点，将分别从变量作用域，类型比较，this指向，函数参数，闭包问题及对象拷贝与赋值...

    2shou 评论0 收藏0

  • 【连载】前端个人文章整理-从基础到入门

    摘要：个人前端文章整理从最开始萌生写文章的想法，到着手开始写，再到现在已经一年的时间了，由于工作比较忙，更新缓慢，后面还是会继更新，现将已经写好的文章整理一个目录，方便更多的小伙伴去学习。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 个人前端文章整理 从最开始萌生写文章的想法，到着手...

    madthumb 评论0 收藏0

发表评论

登陆后可评论

0条评论

JerryZou

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<