3 + true === 4
,想知道为什么吗?那就跟我一起来探索这8个有趣的JavaScript等式吧。
math - 来自unsplash.me
嗨,我是Brandon,我创建了codeburst.io并且我还写了JavaScript教程和文章来帮助新手更好的理解Web开发内部工作原理。如果你有任何关于这些文章的问题,留下你的评论,我会给你回复的,或者可以在twitter上 @brandonmorelli找我。最后,当你真的准备深入到Web开发的时候,可以在最好的学习全栈Web开发的课程这里找到你需要的课程。
这开始变得奇怪了——你竟然想跟我学。你可以打开你的Chrome开发者控制台,windows用户按住 Ctrl + Shift + J,Mac用户按Cmd + Option + J打开控制台。这会允许你再你的浏览器里输入下面所有的代码,所以你可以实时的看到发生什么了。
3 + true == 4
我也没有开玩笑,在JavaScript中,当加号操作符放在number
和 boolean
这两个类型的值之间的时候,boolean
类型的值将会转化成number
类型的值。
如果你还记得我之前的JavaScript Showdown这篇文章,false == 0
和 true == 1
,记得这个的话,3 + true
就转化成 3 + 1
,然后我们就会得到4
这个答案了。
这个跟上面的例子是一个逻辑。当加号操作符放在两个booleans
值之间的时候,这两个booleans
值都会转化成numbers
类型的值,因此true + false
就转化成 1 + 0
,然后我们就得到1
这个答案了。
那当我们把一个string
类型的数字加上一个真的number
类型的数字会发生什么呢?当加号操作符被放在两个操作数之间的时候,一个数是string
类型的一个字符串,那么它会把其它 number
或者 boolean
转化成字符串然后用字符串连接它们。
从这个逻辑看:'4' + 8
变成 '4' + '8'
然后我们就得到 '48'
这个答案了
和上面的例子相似,JavaScript将会把boolean
类型的值转化成string
类型的值然后进行字符串连接。这会变成'true' + '4'
,结果就变成'true4'
。
操作符的顺序很重要,在这个例子中,JavaScript认为第一个+
优先级比其它的优先级高:1 + 1
就等于 2
了。然后我们继续,再加上一个string
类型的值'1'
。多个数相加级联的结果是'21'
这里有事件链:
1 + 1 + '1'
2 + '1'
'21'
当我们把字符串类型的值放在最前面会有什么改变呢?记住操作符的顺序并且从左到右相加。
'1' + 1 + 1
'11' + 1
'111'
string + number = string
,因此在这里例子中我们得到了一个长字符串'111'
。
如果我们尝试在string
前面加上一个负号然后再加上一个number
类型的值呢?你现在应该知道,如果没有这个负号,我们的答案将会是'6969'
,然而,这个负号改变了这个结果。
在'69'
之前的减号是一个一元操作符,事实上它会把string
转化成 number
类型并且把它变成负数。因此我们的等式就变成-69 + 69
,它等于0
。
那如果我们的一元操作符是在一个字符串前面,并且这个字符串不能转化成一个数会怎么样呢?当JavaScript在生成数字失败的时候,我们会得到NaN
(Not A Number不是一个数字)这个值。
往期精选文章 |
---|
ES6中一些超级好用的内置方法 |
浅谈web自适应 |
使用Three.js制作酷炫无比的无穷隧道特效 |
一个治愈JavaScript疲劳的学习计划 |
全栈工程师技能大全 |
WEB前端性能优化常见方法 |
一小时内搭建一个全栈Web应用框架 |
干货:CSS 专业技巧 |
四步实现React页面过渡动画效果 |
让你分分钟理解 JavaScript 闭包 |
小手一抖,资料全有。长按二维码关注京程一灯,阅读更多技术文章和业界动态。