This is just out of curiosity, but do any of you have an idea why this code won't work?
[1, 2, 3, 4, 5].forEach(console.log); // Prints 'Uncaught TypeError: Illegal invocation' in Chrome
On the other hand, this seems to work fine:
[1, 2, 3, 4, 5].forEach(function(n) { console.log(n) });
So... ?
This is happening because your form is submitting to itself and the page loads in a fraction of seconds for you to notice the difference.
It's a function call. It goes to the call stack.
console. log will log to the console (as the name suggests) while return just ends the function and passes the value to whatever called that function. Since you're not using that return value, you won't see anything but it is produced.
The "forEach is not a function" error occurs when we call the forEach() method on a value that is not of type array, Map , or Set . To solve the error, make sure to only call the forEach method on arrays, Map or Set objects. Copied!
It's worth pointing out that there is a difference in behavior in the implementation of console.log
. Under node v0.10.19 you do not get an error; you simply see this:
> [1,2,3,4,5].forEach(console.log); 1 0 [ 1, 2, 3, 4, 5 ] 2 1 [ 1, 2, 3, 4, 5 ] 3 2 [ 1, 2, 3, 4, 5 ] 4 3 [ 1, 2, 3, 4, 5 ] 5 4 [ 1, 2, 3, 4, 5 ]
This is because the callback to forEach
is a three-parameter function taking the value, the index, and the array itself. The function console.log
sees those three parameters and dutifully logs them.
Under the Chrome browser console, however, you get
> [1,2,3,4,5].forEach(console.log); TypeError: Illegal invocation
and in this case, bind
will work:
> [1,2,3,4,5].forEach(console.log.bind(console)); 1 0 [ 1, 2, 3, 4, 5 ] 2 1 [ 1, 2, 3, 4, 5 ] 3 2 [ 1, 2, 3, 4, 5 ] 4 3 [ 1, 2, 3, 4, 5 ] 5 4 [ 1, 2, 3, 4, 5 ]
but there is an alternative way: note that the second parameter to forEach
takes the value of this
to use in the callback:
> [1,2,3,4,5].forEach(console.log, console) 1 0 [ 1, 2, 3, 4, 5 ] 2 1 [ 1, 2, 3, 4, 5 ] 3 2 [ 1, 2, 3, 4, 5 ] 4 3 [ 1, 2, 3, 4, 5 ] 5 4 [ 1, 2, 3, 4, 5 ]
which works in the Chrome console and node for me. Of course, I'm sure what you want is just the values, so I'm afraid the best solution is, indeed:
> [1,2,3,4,5].forEach(function (e) {console.log(e)}); 1 2 3 4 5
Whether node's behavior is a bug, or it simply takes advantage of the fact that console.log
is not specified by ECMA is interesting in its own right. But the varying behavior, and the fact that you have to be aware of whether your callback uses this
is important and means we have to fall back to direct coding, even if it is verbose thanks to the keyword function
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With