Why does this work? [].concat[1,2,3]

In this blog post, we look at a syntactic puzzle. This is just for fun; there is nothing useful you can do with what we examine. It may, however, make you more aware of how JavaScript works, syntactically.

Question

What do you need to do to get the following result? And why does it work?

    > [].concat[1,2,3]
    [ 1, 2, 3 ]

Answer

This expression looks very similar to:

    [].concat([1,2,3])

But, actually, something completely different is going on:

• First, the result of [].concat is computed. The result is the function stored in Array.prototype.concat.

  
  



• Then the operand of the square bracket operator is evaluated. It consists of the comma operator (in this context, the comma is an operator, like +) applied to three numbers:

  
  

  
      > 1,2,3
      3
  

  
  



• Lastly, property '3' of the function returned by [].concat is accessed.

  
  

Normally, that produces undefined:

    > [].concat[1,2,3]
    undefined

If, however, you make the following assignment, you’ll get the result shown at the beginning:

    > Array.prototype.concat[3] = [1,2,3];
    > [].concat[1,2,3]
    [ 1, 2, 3 ]