Why can't a default parameter and function parameter have the same name?

Question

The simple version of this question is: Why is there an undefined error in the 3rd example from the snippet below?

Intuition why it should work

The default value should, it seems, be taken from the "outer" a variable, ie, the one whose value is 1. The first test shows that "shadowing" works with lexical scope: a inside the function refers only to a inside the function, and is unaware of the outer a.

Given that, I see no reason why the 2nd and 3rd tests are different. It is simply an arbitrary coincidence that in the 3rd test, I happen to be setting the default value to a variable in the enclosing scope that has the same name as the function's parameter.

var a = 1;
var b = 100;



function defaultParamTest1(a) {
  console.log(a + 1);
}

function defaultParamTest2(a = b) {
  console.log(a + 1);
}

function defaultParamTest3(a = a) {
  console.log(a + 1);
}


defaultParamTest1(); // WORKS! => NaN, since function a "shadows" outer a.
defaultParamTest2(); // WORKS! => 101, as expected
defaultParamTest3(); // ERROR! => "Uncaught ReferenceError: a is not defined"

Answer 1

OK, I haven't read the spec itself because the last Krell brain boost I had is wearing off, but I think the issue is that the right-hand side expressions for default parameters include the set of parameters in their scope. Thus, the a you reference on the right-hand side of the = is the a on the left-hand side, not the a in the enclosing context. (The context is available of course, as you note, but parameter names shadow that context.)

The evaluation of the right-hand side default expressions is an invocation time thing in ES2015.