详解加法运算符

刘永祥发布于2019-08-19 18:21 / 1114人阅读

摘要：数字加转为，再做加法运算。在这里，被解析成一个空的因此实际上解析成这样就是把一个空数组转换成数值，调用之后还是自身，因此调用得到一个空字符串，转换成数字。参考详解的加法运算符中和的返回值情况是怎样的

JavaScript 里面不同的类型做加法之前，需要做各种转换，这里做一个比较完善的总结。

基本转换规则

运算双方存在对象时

如果有一个对象，那么先把它转换成基本类型值

转换之后，如果有字符串，另一个值先转换成字符串，然后再做连接操作

如果没有，把二者转换成数字再相加

如果二者都是基本类型值，先检查是否有字符串类型，如果有就做连接操作；如果没有，就把二者转换成数字相加。

对象转换成基本类型值

如果是 Date 对象，那么用toString()

其它情况下，用valueOf()

其他情况下(valueOf()不存在或者不返回基本类型值)，那么用toString()

举例 数字加字符串

var result = 1 + "5" // 15

二者都是基本类型值，且有字符串，因此做连接操作。

数字加数组

var result = [1, 3, 5] + 1 // "1, 3, 51"

数组是引用类型，先用valueOf()进行转换，但是数组的valueOf()的结果还是原来的数组，所以用toString()方法得到一个字符串"1, 3, 5"；然后是一个字符串加一个数字，做连接操作。

数字加 boolean

var result = 10 + true // 11

二者都是基本类型值，且没有字符串，所以把true转换成数字相加。

数字加对象

var result = 15 + {} // "15[object Object]"

首先对对象做转换，对象的valueOf还是自身，所以用toString()来转换，{}.toString()的结果是"[object Object]",所以最后的结果就是"15[object Object]"。

数字加 null

var result = 8 + null // 8

null 转为0，再做加法运算。

字符串加 null

var result = "queen" + null // "queennull"

数字加 undefined

var result = 12 + undefined // NaN

把undefined转换成数字，得到NaN,因此加法的结果就是NaN。

[] + {}

var result = [] + {} // "[object Object]"

二者都是对象，而且二者的valueOf方法的结果都是自身，所以要调用toString方法。空数组调用的结果是个空字符串，空对象调用的结果是"[object Object]", 字符串连接之后的结果就是"[object Object]"。

{} + []

var result = {} + [] // 0

在这里，{}被解析成一个空的 block,因此实际上解析成这样：

{ // empty block }
+ []

就是把一个空数组转换成数值，调用valueOf之后还是自身，因此调用toString, 得到一个空字符串，转换成数字0。

参考：

详解 JavaScript 的加法运算符

JS中{}+[]和[]+{}的返回值情况是怎样的

服务器托管混合云三元运算符详解位运算详解小数加法大数加法

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

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

温故js系列（17）-详解加法运算符

摘要：数字和解释因为没有任何一个操作数是字符串，将转换为一个数字做数字加法运算因为没有操作数是对象或字符串，将转换为。结论以避免潜在的问题，不使用加法运算符处理对象，除非你清楚地使用或方法。前端学习：教程&模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试资源汇总 JavaScript一路走来，备受争议，与其说它备受争议，不如说它不够完美。不够完美？那完美了还得了，它的...

gxyz 2019-08-22 12:46 评论0 收藏0
JavaScript 运算符规则与隐式类型转换详解

摘要：我们再来回顾下文首提出的这个比较运算，首先为对象，则调用函数将其转化为字符串对于右侧的，首先会进行显式类型转换，将其转化为。 JavaScript 运算符规则与隐式类型转换详解从属于笔者的现代 JavaScript 开发：语法基础与工程实践系列文章，主要探讨 JavaScript 中令人迷惑的加减乘除与比较等常见运算中的规则与隐式类型转换；本文中涉及的参考资料全部声明在了JavaSc...

snifes 2019-08-21 16:17 评论0 收藏0
JavaScript 运算符规则与隐式类型转换详解

摘要：我们再来回顾下文首提出的这个比较运算，首先为对象，则调用函数将其转化为字符串对于右侧的，首先会进行显式类型转换，将其转化为。 JavaScript 运算符规则与隐式类型转换详解从属于笔者的现代 JavaScript 开发：语法基础与工程实践系列文章，主要探讨 JavaScript 中令人迷惑的加减乘除与比较等常见运算中的规则与隐式类型转换；本文中涉及的参考资料全部声明在了JavaSc...

Kyxy 2019-08-21 12:05 评论0 收藏0
javascript变量运算符详解

摘要：代码示例等号检查，类型转换后返回全等检查，由于时类型，时类型，类型不同，返回关系运算符关系运算符执行的是比较运算，通常用于判断两个变量哪个大哪个小关系运算符都返回一个布尔值。逻辑或运输符用双竖线表示。 1.运算符 JavaScript中常见的运算符包含：赋值运算符、算数运算符、等性运算符、关系运算符、条件运算符、布尔运算符、逻辑运算符…… 1.赋值运算符 = 赋值运算符=，用于给某个变...

Sourcelink 2019-08-22 18:49 评论0 收藏0
详解js运算符

摘要：对象返回第二个操作数对象对象逻辑或与逻辑与操作相似，如果有一个操作数不是布尔值，逻辑或也不一定返回布尔值此时，它遵循下列规则如果第一个操作数是对象，则返回第一个操作数。无论这个值是什么数据类型，这个运算符都会返回一个布尔值。加法运算符如果算术运算的值不是数值，那么js后台会先使用Number()转型函数将其转换为数值： var num = 1 + NaN;//NaN,只要有一个Na...

Dean 2019-08-21 12:35 评论0 收藏0