What I did:
function learnScopeBasics(num) {
const sentence = 'Hey, shhh, I'm learning scope.'
return 3 * num
}
console.log(learnScopeBasics(5))
// 15
console.log(sentence)
// Uncaught ReferenceError: sentence is not defined
Instead of the sentence being logged to the console, we get an error in the console: "Uncaught ReferenceError: sentence is not defined". This is because
sentence
inconsole.log(sentence)
cannot "see" inside thelearnScopeBasics
function. In other words, the variable definitionconst sentence = 'Hey, shhh, I'm learning scope.'
cannot be accessed from outside of the function in which that variable definition resides. If we were, however, to putconsole.log(sentence)
inside of the function, then the sentence would get logged to the console.And if we create an
if
statement inside of this function and putconsole.log(sentence)
inside thisif
statement's code block, like this...
function learnScopeBasics(num) {
const sentence = 'Hey, shhh, I'm learning scope.'
if (true) {
console.log(sentence)
// Hey, shhh, I'm learning scope.
}
return 3 * num
}
console.log(learnScopeBasics(5))
// 15
...then the sentence does get logged to the console. This is because, as a general rule, a variable definition in the outer scope can be accessed from an inner scope, but not vice versa.
A different example to illustrate this aspect of scope:
let peopleAtTheParty = 0
for (let i = 0; i <= 10; i++) {
peopleAtTheParty++
}
console.log(i)
// Uncaught ReferenceError: i is not defined
"Uncaught ReferenceError: i is not defined" is logged because
console.log(i)
is in the outer scope and is trying to access what's in the inner scope.
What I learned:
- I learned that the below code logs what it logs. The first
console.log()
line I understood. Same with the second. But the third I did not.
let globalVar
function addFive(number) {
globalVar = 'changed'
return number + 5
}
console.log(globalVar)
// undefined
console.log(addFive(10))
// 15
console.log(globalVar)
// changed
What I still might not understand:
- What I described just above, under "What I learned:".
- An explanation from a mentor:
The first
console.log
statement: A global variable,globalVar
, is declared, but not initialized. So it exists for reference anywhere in the script, and it doesn't have a value yet, thus it is 'undefined'.The second
console.log
statement: This runs the function:Inside the function, the existing global variable,
globalVar
, is mutated such that its value is now 'changed'.There is no
let
,var
, orconst
keyword in front ofglobalVar
inside the function. Therefore, it is referencing the one declared in the global scope.The third
console.log
statement: By the time this is run,globalVar
's value has been changed to 'changed' due to the calling ofaddFive
.
Top comments (0)