Escopo é a área em que o valor de uma variável está disponível para ser utilizado.
Quando a variável é criada na raíz do documento (fora de um bloco de código) ela tem escopo global, ou seja, pode ser acessada em qualquer bloco de código.
let age = 31
if(true){
console.log(`dentro do 1o bloco de código: ${age}`)
}
console.log(`fora do bloco de código: ${age}`)
\\ dentro do 1o bloco de código: 31
\\ fora do bloco de código: 31
Também podemos alterar o valor da variável dentro de um bloco de código. Sendo assim, alteramos o valor da variável em seu escopo global.
let age = 31
if(true){
age = 41
console.log(`dentro do 1o bloco de código: ${age}`)
}
console.log(`fora do bloco de código: ${age}`)
\\ dentro do 1o bloco de código: 41
\\ fora do bloco de código: 41
Podemos criar variáveis com o mesmo nome, contanto que não seja no mesmo escopo. Desta forma é criado um escopo local para a variável dentro de um determinado bloco de código. Lembrando que a variável declarada em escopo local só pode ser acessada neste mesmo escopo e não funciona em outros contextos.
let age = 31
if(true){
let age = 41
console.log(`dentro do 1o bloco de código: ${age}`)
}
console.log(`fora do bloco de código: ${age}`)
\\ dentro do 1o bloco de código: 41
\\ fora do bloco de código: 31
No caso de blocos aninhados, o valor acessado é sempre o do contexto mais próximo.
let age = 31
if(true){
let age = 41
console.log(`dentro do 1o bloco de código: ${age}`)
if(true){
console.log(`dentro do 2o bloco de código: ${age}`)
}
}
console.log(`fora do bloco de código: ${age}`)
\\ dentro do 1o bloco de código: 41
\\ dentro do 2o bloco de código: 41
\\ fora do bloco de código: 31