- Describe the differences between
var, let, and const
- Predicyt how varaibles will behave when multiple scopes are involved
- Understand how the scope chain is initialized and utilized to resolve variables
Scope - the level in which a variable can be accessed.
- where & when variables are usable/accessible
Reads and executes code in two phases
- Creation phase
- Hoisting of global variables and function declarations
- Execution phase
- code does the thing
Scopes:
- Global
- Basically, recognized everywhere in the file
- Default scope
- Functions and vars in the global scope are 'vulnerable' because they can be accessed by everything and potentially mutated (changed)
var, let, and const can be globally scoped
var one = "one";
let two = "two";
const three = "three";
showNumbers();
function showNumbers () {
console.log("In function: ", one, two, three);
if (one && two && three) {
console.log("In if block: ", one, two, three);
}
}
// The three global variables are accessible everywhere
- Function
- Vars declared in the function (using
var, let, or const) can only be accessed by the other code inside the function
- You control what's in the function scope, can't be meddled with by anyone or anything else
- The global scope cannot access this funtion
function readWords() {
var greeting = "Hello, friend, ";
let question = "how are you? ";
const response = "I am fine."
if (true) {
console.log('Sentence in the if block: ', greeting, question, response);
}
console.log(greeting + question + response);
}
readWords();
console.log(greeting + question + response);
- Block
- Scope is relegated to a code block, such as an
if statement
- Vars declared in the block statement (
if blocks, for loops, etc) using let or const can only be accessed by other code inside the block
- Vars declared in the block statements using
var will not be scoped within the block (as this is a special feature of let and const). Vars will be declared with var will 'leak out'.
function readWords() {
var greeting = "Hello, friend, ";
let question = "how are you? ";
const response = "I am fine."
if (true) {
var greeting = "Sup dawg, ";
let question = "what's good?";
const response = "Nm."
console.log('Sentence in if block: ', greeting, question, response);
}
console.log(greeting + question + response);
}
readWords();Complete the following prompts in your journal:
Describe “scope” in your own words. What are the similarities and differences between var, let, and const?
Scope is the level at which variables are recognized. All are variables, const cannot be changed but let and var can. Var will leak out in a block scope.
Whenever a variable is used, the JavaScript interpreter traverses the scope chain until it finds an entry for that variable.
Remember that the scope chain is initialized during the “creation phase” of the interpreter running through the code. This is important to note, as the scope chain (e.g. “What is the parent scope for this variable? The grandparent scope?”) is determined by where functions are defined in the code base…. not where functions are invoked.
Every time a variable is initialized, the interpreter will first look in its own scope to see if the label can be found. If it is not found, it will look “up” the scope chain to the parent scope to try to resolve the variable in the parent context.
1 let number = 10;
2
3 function foo () {
4 number = 20;
5 console.log('A', number); // prints 'A', 20
6 }
7
8 console.log('B', number); // prints 'B', 10
9
10 foo();
11
12 console.log('C', number); // prints 'C', 20