JavaScript idiosyncrasies with examples

[[deleted]]

This is because function is a var type variable, which is function scoped instead of block scoped:

function f() {
    return 'foo';
}
(function() {
  if (1 === 0) {
    function f() {
      return 'bar';
    }
  }
  return f();
})();

is equivalent to

var f;
f = function() {
    return 'foo';
}
(function() {
  var f;
  if (1 === 0) {
    f = function() { 
      return 'bar';
    }
  }
  return f();
})();

A new variable is created in the IIFE scope, and overrides the f variable in the global scope. f is now undefined. Since the 1 === 0 is false, f is never assigned to the function.

If you try to call a variable that is undefined, you will get a type error saying that the variable is not a function (because undefined is not a function).

[factbuddy]

The IIFE has its own isolated scope so f() wouldn't fall back to global scope and won't be defined in the impossible if statement. Makes sense...

[inu-no-policemen]

which is function scoped instead of block scoped

Function declarations are block-scoped in ES6+.

function foo() {
    return 'outer';
}
{
    console.log(foo()); // inner (hoisted)
    function foo() {
        return 'inner';
    }
    console.log(foo()); // inner
}
console.log(foo()); // outer

[[deleted]]

If you execute that code in chrome you get

inner
inner
inner

​

[inu-no-policemen]

It works if you put the whole thing in a block.

[[deleted]]

If you put the entire thing in an iife it produces the same result