JS 加法知多少？

xuhong 发布于2019-08-23 15:41 / 3290人阅读

摘要：今天收到一个问题别用控制台，能说出来是多少一下没反应过来，不知道你说对了没反正我说错了，哈哈哈好了，先公布结果下面好好分析分析到底是啥原理。

今天收到一个问题

var a = +[]

别用控制台，能说出来是多少？

一下没反应过来，不知道你说对了没

反正我说错了，哈哈哈~

好了，先公布结果

console.log(+[]) // 0 
console.log(0 + []) // "0"
console.log(0 - []) // 0
console.log([] + []) // ""
console.log({} + []) // "[object Object]"

下面好好分析分析到底是啥原理。

加法运算

1、加号运算符只能用于原始数据类型，对于对象类型的值，需要进行数据转换

2、在转换后，如果其中一个运算元出现原始数据类型是“字符串”类型值时，则另一运算元强制转换为字符串，然后做字符串的连接运算

3、在其他情况时，所有运算元都会转换为原始数据类型的“数字”类型值，然后作数字的相加

Number() 转换规则

如果是 Boolean 值，true 和 false 将分别转换为 1 和 0。

如果是数字值，只是简单的传入和返回。

如果是 null 值，返回 0。

如果是 undefined ,返回 NaN。

如果是字符串，遵循下列规则：

   (1) 如果字符串截去开头和结尾的空白字符后，不是纯数字字符串，那么最终返回结果为 `NaN`。 

   (2) 如果是字符串中只包含数字（包括前面带正号或负号的情况），则将其转换为十进制数值，即“1”变成1，“123”会变成123，而“011”会变成11（前导的零被忽略了）； 

   (3) 如果字符串中包含有效的浮点格式，如“1.1”，则将其转换为对应的浮点数值（同样也会忽略前导零）； 

   (4) 如果字符串中包含有效的十六进制格式，例如 `0xf`，则将其他转换为相同大小的十进制整数值； 

   (5) 如果字符串是空的（不包含任何字符），则将其转换为 0； 

   (6) 如果字符串中包含除上述格式之外的字符，则将其他转换成 `NaN`。

如果是对象，则调用对象的 valueOf() 方法，然后依照前面的规则转换返回的值。如果转换的结果是 NaN，则调用对象的 toString()
方法，然后再次依照前面的规则转换返回的字符串值。

示例

console.log(Number(undefined)) // NaN
console.log(Number(null)) // 0
console.log(Number(NaN)) // NaN
console.log(Number("")) // 0
console.log(Number({})) // NaN
console.log(Number({a:1})) // NaN
console.log(Number([])) // 0
console.log(Number([1])) // 1
console.log(Number([1,2])) // NaN

console.log(String(undefined)) // "undefined"
console.log(String(null)) // "null"
console.log(String(NaN)) // "NaN"
console.log(String({})) // "[object Object]"
console.log(String({a:1})) // "[object Object]"
console.log(String([])) // ""
console.log(String([1])) // "1"
console.log(String([1,2])) // "1,2"

分析

+[]，[] 是对象，依据第六条规则，转换的结果是 NaN，然后调用对象的 toString() 方法，得到 "" 空字符串，Number("") => 0，所以 +[] => 0，结果为数字 0

0 + []，得到 0 + "" => "0" ，结果为字符串 0

{} + []，得到 "[object Object]" + "" => "[object Object]"，结果为字符串 [object Object]

其他以此类推可得。

懂了没~

GPU云服务器云服务器 js里面怎么表达加法 js教程视频知乎 js视频教程知乎小数加法

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

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

【JS基础】类型转换知多少

摘要：正确的解释是允许在相等比较中进行强制类型转换，而不允许。参考资料小议下字符串比较大小中的强制类型转换核心概念类型转换对象和方法隐式类型转换小结开胃菜先说一个题外话，我在工作中遇到一个问题，需要比较 08:00 和 09:00 的大小，最后我找到三种方法：在两个字符串前后各拼接相同的年月日和秒，拼成完整的时间格式进行比较： var head = 2016-01-01 var fo...

AdolphLWQ 2019-08-23 17:59 评论0 收藏0
[js高手之路]this知多少

摘要：关键字在中的变化非常的灵活，如果用的不好就非常恶心，用的好程序就非常的优雅，灵活，飘逸所以掌握的用法，是每一个前端工程师必知必会的而且这个也是一些大公司笔试中常见的考察项第一种单独的，指向的是这个对象注当前的执行环境是所以指向了第二种全局函 this关键字在javascript中的变化非常的灵活，如果用的不好就非常恶心，用的好,程序就非常的优雅，灵活，飘逸.所以掌握this的用法，是每...

APICloud 2019-08-20 19:07 评论0 收藏0
document.write知多少

摘要：原生的里绝对是重量级的。第二个案例，如果是异步引入的加或者动态加入的，里面的因安全原因是无法工作的。页面在状态，即使没有调用操作也会自动调用方法从而将页面清空了。有的同学说将是不是可以避免，结论是。所以使用一定要知道执行的时机。原生JavaScript的API里document.write绝对是重量级的。如果大家对他的使用场景、注意事项、原理等不明晰，欢迎阅读本文。使用场景 ...

ARGUS 2019-08-29 11:04 评论0 收藏0
document.write知多少

摘要：原生的里绝对是重量级的。第二个案例，如果是异步引入的加或者动态加入的，里面的因安全原因是无法工作的。页面在状态，即使没有调用操作也会自动调用方法从而将页面清空了。有的同学说将是不是可以避免，结论是。所以使用一定要知道执行的时机。原生JavaScript的API里document.write绝对是重量级的。如果大家对他的使用场景、注意事项、原理等不明晰，欢迎阅读本文。使用场景 ...

syoya 2019-08-20 10:11 评论0 收藏0
document.write知多少

摘要：原生的里绝对是重量级的。第二个案例，如果是异步引入的加或者动态加入的，里面的因安全原因是无法工作的。页面在状态，即使没有调用操作也会自动调用方法从而将页面清空了。有的同学说将是不是可以避免，结论是。所以使用一定要知道执行的时机。原生JavaScript的API里document.write绝对是重量级的。如果大家对他的使用场景、注意事项、原理等不明晰，欢迎阅读本文。使用场景 ...

TNFE 2019-08-01 15:33 评论0 收藏0