JavaScript：为什么.forEach不起作用？

Question

Here is a little piece of code:

window.addEventListener('load', function() {
    ['echo'].forEach(function(entity) {
        console.log('loaded entity=' + entity)
    })
})

console.log(['echo'])
console.log(['echo'].forEach)
['echo'].forEach(function(entity) {
    console.log('entity=' + entity)
})

Output looks like this:

["echo"]
function forEach() { [native code] }
Uncaught TypeError: Cannot read property 'echo' of undefined
loaded entity=echo

Why does this error occur? I assume that undefined is this inside .forEach . Why doesn't it get passed when calling .forEach ?

Answer 1

SEMICOLONS!

window.addEventListener('load', function() {
    ['echo'].forEach(function(entity) {
        console.log('loaded entity=' + entity);
    })
});

console.log(['echo']);
console.log(['echo'].forEach);
['echo'].forEach(function(entity) {
    console.log('entity=' + entity);
});

---

The problem is here:

console.log(['echo'].forEach)
['echo'].forEach(function(entity) {

The line break is ignored, at it gets parsed as this:

console.log(['echo'].forEach)['echo'].forEach(function(entity) {

console.log() returns undefined , and undefined['echo'] raises an exception.

So use semicolons and be happy. Or don't and suffer.

Answer 2

You need to add semi-colons . Your script is being evaluated as:

console.log(['echo'].forEach)['echo'].forEach(function(entity) {
    console.log('entity=' + entity)
})

And since console.log returns undefined , you get an uncaught TypeError because you can't access an echo property on undefined .

Answer 3

Javascript can work without semicolons (treating newlines as end of statement), as long as concatenation of following lines is syntactically incorrect & parsing makes no sense.

For eg:

var a=1
var b=2

would work since the semicolon will be added as var a=1 var b=2 doesn't make sense.

Thus it will be treated as var a=1; var b=2 var a=1; var b=2 . Similarly,

console.log(['echo'].forEach)
['echo'].forEach(function(entity) {
    console.log('entity=' + entity)
})

is read as :

console.log(['echo'].forEach)['echo'].forEach(function(entity) {
    console.log('entity=' + entity)
})

Here console.log(...) is treated an object with the property 'echo' . Hence the error.