使用JavaScript隐式类型转换输出"nb"

tomlingtm 发布于2019-08-23 11:52 / 3158人阅读

摘要：本文将介绍一段使用隐式类型转换输出的代码，并讲解具体的转换过程。代码转换过程我们分四部分讲解具体的转换过程，一个空数组，紧跟在数组后面的的语义应该是表示属性操作，类似于中的作用，而不是表示数组。

本文将介绍一段使用JavaScript隐式类型转换输出"nb"的代码，并讲解具体的转换过程。

预备知识

请先阅读文章ECMAScript7规范中的ToPrimitive抽象操作。

代码

([][[]]+[])[+!![]]+([]+{})[!+[]+!![]] // "nb"

转换过程

我们分四部分讲解具体的转换过程：

([][[]]+[])

[+!![]]

([]+{})

[!+[]+!![]]

([][[]]+[])

[]，一个空数组；

[[]]，紧跟在数组后面的[的语义应该是表示属性操作，类似于obj[key]中[]的作用，而不是表示数组。这个里面，既然外层的[]表示获取属性的运算符，里面的[]肯定就表示key了。因为key是原始数据类型，所以会调用ToPrimitive抽象操作把[]转化为原始数据类型，也就是空字符串""，所以上面两个结合起来就是：

var a = []
var b = []
a[b] // => a[""] => undefined

+，相加操作；

[]，空对象，和上面的步骤结合起来就是：

undefined + []

相加操作会把操作符两边的操作数通过ToPrimitive抽象操作转化为原始数据类型，也就是[]会变为""：

undefined + ""

相加操作的抽象步骤中，如果有一个操作数是字符串，会调用ToString抽象操作把两个操作数都转化为字符串类型，也就是：

undefined + "" // => "undefined" + "" => "undefined"

综上，([][[]]+[])的结果就是字符串"undefined"。

[+!![]]

!![]，表示把一个数据转化为布尔类型，因为[]是一个真值，所以!![]的结果是true；

+!![]，表示把前面的结果转化为数字类型，也就是+true，true转化为数字是1，所以+!![]的结果是1；

[+!![]]，也就是[1]，结合第一部分([][[]]+[])的结果：

([][[]]+[])[+!![]] // => "undefined"[1] => 也就是获取字符串"undefined"的第二个字符，也就是"n" => "n"

([]+{})

相加操作会调用ToPrimitive抽象操作把操作符两边的数据转化为原始数据类型，也就是：

([]+{}) // => "" + "[object Object]" // => "[object Object]"

[!+[]+!![]]

+[]，把数组转化为数字：

+[] // => +"" => 0

!+[]，也就是!0：true；

!![]，true；

!+[]+!![]，也就是true + true，又是相加操作，因为操作符两边都是布尔类型，所以会转化为数字类型，也就是1 + 1，也就是2；

第三部分和第四部分的结果结合起来就是：

([]+{})[!+[]+!![]] // => "[object Object]"[2] => 也就是取字符串"[object Object]"的第三个字符，也就是"b" => "b"

第一二部分和第三四部分结合起来的结果就是：

([][[]]+[])[+!![]]+([]+{})[!+[]+!![]] // => "n" + "b" => "nb"

总结

希望大家看的开心！如果本文有什么错误或者不严谨的地方，欢迎在评论区留言。

私有云服务器托管隐式类型转换 Quote quoted quot

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

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

解析JavaScript判断两个值相等的方法

　　本篇文章主要是讲述在JavaScript中判断两个值相等，不要认为很简单，要注意的是在JavaScript中存在4种不同的相等逻辑。　　ECMAScript 是 JavaScript 的语言规范，在ECMAScript 规范中存在四种相等算法，如下图所示：　　上图中每个依次写下来，很多前端应该熟悉严格相等和非严格相等，但对于同值零和同值却不熟悉，现在就依次下面四种方法。　　同值　　同值零　　非...

3403771864 2022-11-19 17:08 评论0 收藏0
JavaScript中让x==1&&x==2&&x==3等式成立演示

　　要是别人问您：如何让 x 等于 1 且让 x 等于 2 且让 x 等于 3 的等式成立？　　咋地，知道如何实现？想骂人有不　　现在我们一起来分解思路：　　我们先来讲讲宽松相等== 和严格相等 ===，这两个都能用来判断两个值是否相等，但们明确上文提到的等于指的是哪一种，二者的区别看下：　　(1) 这两个基础直接的区别：　　(1.1) 不同类型间比较，== 比较转化成同一类型后的值看值是否相等，...

3403771864 2022-10-16 17:23 评论0 收藏0
从0开始构建自己的前端知识体系-不要对&quot;==&quot;说不

摘要：为了避免某些场景下的意外，甚至推崇直接使用来代替。使用了运算符的一些规则，发生了类型转换。按照以下规则转换被传递参数直接返回直接返回直接返回直接返回直接返回返回一个对象的默认值。前言类型转换在各个语言中都存在，而在 JavaScript 中由于缺乏对其的了解而不慎在使用中经常造成bug被人诟病。为了避免某些场景下的意外，甚至推崇直接使用 Strict Equality( === )...

tianyu 2019-08-22 17:19 评论0 收藏0
资源编排工具-私有网络下批量部署多台云主机

摘要：私有网络下批量部署多台云主机本篇目录摘要摘要拓扑图拓扑图操作步骤操作步骤参考文献参考文献关键词摘要云主机是构建在云环境的弹性计算资源，是最为核心的服务。私有网络下批量部署多台云主机本篇目录摘要拓扑图操作步骤参考文献关键词：UHost,VPC,Subnet摘要云主机是构建在云环境的弹性计算资源，是 UCloud 最为核心的服务。有些服务，如弹性 IP、镜像、云硬盘等必须与云主机结合后使用，另一...

ernest.wang 2022-07-13 01:10 评论0 收藏0
kubernetes1.17安装glusterfs

本文介绍了如何使用在最新kubernetes版本上安装glusterfs。官方源仓库master分支相关脚本无法部署成功，主要是由于kubernetes的版本发生了变化，一些beta版本的资源升至稳定版本，所以一些模板yaml文件需要修改，这些修改很多在issus中能够发现，目前还未合并到主分支，仍然需要手动修改。所以我Fork了源仓库，合并了这些这些修改。代码仓库地址为：gluster-k...

社区管理员 2022-10-08 14:01 评论0 收藏0