What is the precise definition of variable scope (in JavaScript)?

Question

I want to make sure to master the concept of variable scope. Ideally, I'd like a definition of the form:

• x is the scope of identifier i just in case x ...

or of the form:

• the scope of identifier i is identical to ...

Although I am new to programming, I have read through some general material on variable scope and some material on variable scope in JavaScript (including this). However, I cannot seem to find a precise, descriptive definition. I have tried to come up with my own, but I've noticed that it does not always fit how others speak.

It is probably best to illustrate my current understanding. Let's take 'context' nearly as a primitive to mean something like a region of code delimited by curly braces. Think about the main region of code, functions, and blocks (I bet I've left some things out). Let's think of variables in the broadest sense to include variables, parameters, and function names or identifiers, more generally. Then:

• the scope of a variable v is identical to the set of contexts within which v is accessible.

Here's an example:

let a = 'foo';
function bar(param) {
  param += 2;  
  function newFunc() {
   console.log(param);
  }  
  newFunc(); 
}

Here we have three contexts:

• The main context.
• The context that results from defining the bar function.
• The context that results from defining the newFunc function.

According to the above attempt at a definition, we have two scopes:

• There is the global scope of built-in names like console, null, etc, as well as defined names a and bar. This scope is the set of contexts 1, 2, and 3 above.
• There is the scope of param and newFunc. This scope is the set of contexts 2 and 3 above.

No scope comprises only context 3 because there is no new variable defined in context 3.

So, defining a function creates a context. The scope of a variable includes that new context just in case the variable is accessible from that context.

However, I know that people will say that the above code example includes 3 scopes and more or less identify those scopes with what I've called 'context'. However, I cannot make sense of this, and I do not know what precise definition of variable scope permits them to say there are 3 scopes in the above. It seems strange to me to talk about scope without talking about a variable/identifier's scope. More precisely, it seems context is undoubtedly independent of variables, but scope is not. Scope is a property of variables/identifiers; that's why we are talking about variable scope or the scope of some identifier or another when we talk about scope.

I have also seen people talk about variables going in and out of scope. To me, variables have a scope, period. The program moves from context to context and thereby moves in and out of the variables' scopes. Variables go in and out of context as the program runs. They might even always be in context (if they have a global scope) or always out of context (e.g., if they have function scope and that function is never invoked). But it seems inappropriate to say that variables go in and out of scope or that a variable's scope changes.

It has occurred to me that it is not correct to speak of the scope of an identifier unless there is a unique context within which an identifier is accessible. So, instead, we might have

• S is a scope of identifier v just in case S is a context within which v is accessible.

Given this definition, we have three scopes:

• Context 1 is a scope of a and bar.
• Context 2 is a scope of a, bar, param, and newFunc.
• Context 3 is a scope of a, bar, param, and newFunc.

In the above code, there are no contexts for which it is true that it is the scope of an identifier. For that to be the case, there would have to be a unique context for which the identifier is accessible. For example, if the code omitted newFun, then there wouldn't be a third context, and context 2 would be the scope of param and newFunc.

So, defining a function creates a context. The context is a scope of a variable just in case the variable is accessible within that new context.

There are problems here, though, too. Consider the following code:

for (let i = 0; i < 5; i += 1) {
  if (i % 2 === 0) {
    console.log(i);
  }
}

I have seen people say that there are three contexts here, but the inner, nested one of the if block is not a scope. But on the definition I just gave, that block would be a scope of i as well as built-ins like console.

That's where I am currently. Thanks, in advance, for your respectful help.

UPDATE

Given @A. Chiesa's response, I wrote a short thing to try to make sense of things. Perhaps that document says it best? Thanks again.

Answer 1

Disclaimer: what follows is an explanation in my own words. I'm pretty confident about the concepts, but take the specific terms with a grain of salt: it could be that the specification or some other developer uses different terms.

In JavaScript the "scope" that people tend to refer to is the so called "lexical scoping" of functions.

IMHO it's best to think about scoping not from the point of view of a defined variable (or constant), but from the PoV of each line of code.

E.g.:

let a = 'foo';

function bar(param) {
  param += 2;  
  function newFunc() {
   for(let i = 0; i < 10; i++) {
     let v = 5;

     // what variables are "in scope" in this line?
   }
  }  
  newFunc(); 
}

JavaScript uses lexical scoping, that is: it doesn't matter when or how you call some code, what is accessible to the code itself is defined by the structure of the code itself (i.e., by the nesting of the brackets).

It's very simple: for a certain statement, you just look at every code block that contains the statement. In the commented line above, the code can access to many variables:

• v
• i
• param
• a
• everything in the global scope

Albeit the structure of the code defines what is accessible by every statement, the lifetime of each variable is determined by the lifetime of the code using it. In other words, a variable whose lifetime (I'm using this term instead of scope, because I think it better describes the relevant part) would be terminated by, say, the end of a function block, can be "captured" by some other function, and end up in the execution scope of the latter. This is the concept of closure, and the source of many interesting techniques.

So, I would say that:

• the lexical scope of a block of code includes every surrounding "structure" (code block, function, class or module boundary).
• a variable is "in scope" to every line that can "see" it via lexical scoping.

A variable lifetime begins when it's corresponding var, let or const declaration is executed, and ends when there is no code that keeps it "alive", either directly or via a closure.

I'm pretty sure that many extra details could be added, specifying the old var statement, with it's functional scoping, and comparing it with let and const block scoping, but this answer seems already pretty long :D