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?

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?

• javascript
• foreach
• undefined

• 1 Same error in all browsers?? – Sethen Commented May 31, 2013 at 18:03

3 Answers 3

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.

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.

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. 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.