Programming Language Peculiarities, Part 2: JavaScript

Last week I wrote about some of the strange statements that are considered syntactically correct in Ruby. This week I am going to write about function scoping peculiarities with JavaScript.

Functions

Firstly there are a number of ways you can define functions in JavaScript for example:

// A named function
function example1() {};

// An anonymous function variable assignment.
var example2 = function() {};

// A named function variable assignment
example3 = function example3() {};

For a function to be able to recurse however third example of a named function variable assignment must be used as in the below example.

var i = function i(val) {
counter = val + 1
console.log(val);
if (counter < 100)
i(counter)
}(1)

In this example you can also see that is it a self invoking function because the definition is followed by brackets containing a parameter value.

Below you can see an example where the function world is called prior to being declared, this is perfectly acceptable in JavaScript.

function hello() {
  console.log('hello');
  world();
  function world() {
    console.log('World');
  }
};

hello();

Head or Global Object

In a browser this would be referred to as Window whereas in Node.JS it is referred to as the global object.

The head object behaves slightly differently from one implementation to another. Depending how you declare a variable in Node.js influences its visibility.

var example1 = function() {};
example2 = function() {};
function example3() {};
example4 = function example4() {};
var example5 = function example5() {};
console.log('example1' in global); // returns false
console.log('example2' in global); // return true
console.log('example3' in global); // returns false
console.log('example4' in global); // return true
console.log('example5' in global); // return false
console.log(global);

In the above example you can see that:

• Example1 is not part of the head object because the variable was declared the function is not included in the head object regardless of the fact it was declared at the head level.

• Example2 however is part of the head object because it has not been declared it becomes a part of the head object.

• Example3 is a named function that although accessible from anywhere because it has global scope it is not part of the head object.

• Example4 is part of the head object for the same reason as Example2.

• Example5 is again not part of the global object because it has already been declared.

Now for an example that is even stranger that the above examples.

Example6 = function example6() {};
console.log('Example6' in global);
var Example6;

I will leave it to you to guess what happens here...I will just say though it leaves me perplexed.

You may also have fun trying to work out what the following code would output:

function a() {
function b() {}
var c = "var c";
}

d = function() {
e = "var e";
f = function() {
console.log("function f");
}
}

var i = function() {
console.log("Global function i is in head:" + (i in global));
}

function g() {
h = function() {
console.log("function h");
i = function() {
console.log("function i");
}
}
var i;
h();
console.log(i);
i();
}

try {
f();
} catch (ex) {
console.log(ex);
}

try {
d();
} catch (ex) {
console.log(ex);
}

try {
f();
} catch (ex) {
console.log(ex);
}

try {
g();
} catch (ex) {
console.log(ex);
}

try {
h();
} catch (ex) {
console.log(ex);
}

try {
i();
} catch (ex) {
console.log(ex);
}

try {
console.log(e);
} catch (ex) {
console.log(ex);
}