为何这样也能运行? [ ].concat[1,2,3]

This is just for fun.javascript

本文的宗旨是：This is just for fun。这段代码没有任何实用的价值，可是经过这段代码，你能够了解 javascript 被忽略的知识点和语法。java

1. 问题

下面的代码的执行结果是什么？shell

[].concat[1,2,3]复制代码

2. 答案

先给出答案：undefined。数组

大部分人可能会认为这段程序应该抛出语法异常：微信

Uncaught SyntaxError: ....复制代码

3. 分析

这段程序和下面的代码很像：函数

[].concat([1,2,3])复制代码

concat() 方法将传入的数组或非数组值与原数组合并，组成一个新的数组并返回。可是上面的代码没有使用小括号，因此他们两个并非相同的。那么咱们来拆开分析一下 [].concat[1,2,3] 是怎么执行的：ui

首先计算 [].concat，这个的结果是 Array.prototype.concat。spa

第二步执行一个逗号操做符。逗号操做符对它的每一个操做对象求值（从左至右），而后返回最后一个操做对象的值。prototype

> 1,2,3
3复制代码

第三步执行一个数组访问运算或属性访问运算。由于 [].concat 是一个函数，函数也是对象，因此这是一个属性访问运算。同理，知道了 [] 是数组访问运算或属性访问运算，你能够很快说出下面代码的结果：code

[[]][0]
[[[1]]][0][0][0]
[[[1]]][[0][0]][0][0]复制代码

看似很复杂，你只须要按操做符的优先级和结合性一步一步分解，就能够求出最后的结果。

那么咱们回到以前的问题，[].concat[1,2,3] 其实等价于：

Array.prototype.concat[3]复制代码

那么结果天然就是 undefined。

4. 番外篇

由于 javascript 的原型是能够修改的，所以咱们能够定义：

Array.prototype.concat[3] = [1,2,3];复制代码

这时咱们再调用 [].concat[1,2,3] 就会获得结果 [1,2,3]。

每周推送原创高质量文章，欢迎关注个人公众号