Escopo e elevação de variáveis ​​em JavaScript | Explicado com exemplos

Em um programa JavaScript, o escopo de uma variável define até que ponto uma variável pode ser acessada ao içar em JavaScript é um fenômeno pelo qual você pode acessar as variáveis ​​mesmo antes da inicialização deles.

Variáveis ​​Escopo em JavaScript

Antes de mergulhar no escopo da variável primeiro, temos que entender o que é uma variável no JavaScript e como criar uma variável.

Uma variável atua como um contêiner que mantém alguns dados. Essas variáveis ​​podem ser criadas usando três palavras -chave diferentes como "var", "let" e "const".

Em JavaScript, uma variável tem dois tipos de escopo e discutiremos cada um deles com alguns exemplos.

Bloquear o escopo do JavaScript

JavaScript anterior não suporta o escopo do bloco, mas após o lançamento do ES6, ele faz. O ES6 apresenta algumas novas palavras -chave, como Let e ​​Const, essas palavras -chave oferecem escopo de bloco em JavaScript.

O escopo do bloco em JavaScript é representado por aparelhos encaracolados "", que determina qualquer variável que seja declarada dentro do escopo do bloco não pode ser acessada fora dele. As variáveis ​​inicializadas dentro do bloco são conhecidas como variáveis ​​locais.

Agora vamos entender o funcionamento de variáveis, declarado dentro do escopo do bloco.

A variável declarada com a palavra -chave "var" não suporta o escopo do bloco, significa que podemos acessar a variável de fora do bloco também. Considere o exemplo abaixo em que a variável é declarada com a palavra -chave "var" e observe como ela funciona:

se for verdade)

var a = 100;
console.log ("variável dentro do escopo do bloco:", a);

Criamos uma variável dentro do bloco usando a palavra -chave "var" e atribuímos o valor '100'. Quando acessarmos essa variável dentro do bloco, ele mostrará a seguinte saída:

Aprimore o exemplo acima um pouco mais e acesse a variável 'A' fora do bloco:

se for verdade)

var a = 100;
console.log ("variável dentro do escopo do bloco:", a);

console.log ("variável fora do escopo do bloco:", a);

Agora observe a saída:

A saída verifica se a palavra -chave "var" não pode ter escopo de bloco.

Agora crie as variáveis ​​com a palavra -chave "Let" e "const" e tente acessá -las de fora do escopo do bloco:

se for verdade)

deixe um = 100;
const b = 150;
console.log ("deixe dentro do escopo do bloco:", a);
console.log ("const dentro do escopo do bloco:", b);

console.log ("Deixe fora do escopo do bloco:", a);
console.log ("const fora do escopo do bloco:", b);

Agora acesse as variáveis ​​de dentro e de fora do bloco:

A saída verificará se essas variáveis ​​são acessíveis dentro do escopo do bloco, mas quando tentamos acessá -las de fora do escopo do bloco, ocorre um erro “ReferenceError não capturado”:

Escopo global em javascript

Variáveis ​​que podem ser acessíveis de qualquer lugar de fora ou dentro da função/bloco são conhecidas como variáveis ​​globais de escopo. Não importa eles sejam criados fora da função/bloco ou dentro da função ou bloco i.e. A variável criada dentro do bloco com a palavra -chave 'var' pode ser acessível de qualquer lugar no código JavaScript.

Em JavaScript, se uma variável não for declarada corretamente, por padrão, será criada no escopo global.

Considere o exemplo a seguir e observe como uma variável global funciona:

var a = 100;
Seja b = 120;
const C = 250;
se for verdade)

console.log ("Global Variable:", A);
console.log ("Global Variable:", b);
console.log ("Global Variable:", C);

Neste exemplo, declaramos as variáveis ​​globalmente e as acessamos no bloco IF-Statement:

A saída verifica que podemos acessar as variáveis ​​em qualquer lugar do programa que são definidas globalmente:

Içando em JavaScript:

Hainting refere -se a um fenômeno que move as declarações variáveis ​​para o topo.

Aqui precisamos entender a diferença entre a declaração variável e a inicialização da variável, por exemplo, "var a", é uma declaração variável, enquanto "a = 10" é a inicialização variável. Agora vamos dar um exemplo para entender como escrevemos o código e como o JavaScript interpretará esse código:

var a = 10;
documento.escreva (a);
var b = 20;

JavaScript vai lê -lo como:

var a;
var b;
a = 10;
documento.escreva (a);
b = 20;

JavaScript move a parte da declaração no topo, enquanto a parte da inicialização permanece em sua posição.

Até agora em todos os exemplos, criamos uma variável e atribuímos algum valor a ele e depois acessamos a variável no final. E se tentarmos acessar qualquer variável antes de sua inicialização/declaração. Bem, nesse caso, o JavaScript mostra um valor indefinido, como no exemplo a seguir:

console.log ("Acesso antes da declaração:", a);
var a = 45;

Neste exemplo, tentamos imprimir o valor da variável "A", antes de sua declaração, então, na próxima declaração, criamos a variável e atribuímos um valor. Na execução bem -sucedida, obteremos a seguinte saída:

Isso acontece porque, mesmo antes da execução deste código, JavaScript atribuiu um valor indefinido ao “var a"Então ele diz"console.log (a)" e então "a = 45”, Portanto, mostra indefinido em vez de 45.

Enquanto pular a palavra -chave "var" significa que não estamos declarando uma variável, em vez disso, estamos apenas inicializando uma variável. Nesse caso, se tentarmos acessar uma variável antes de sua declaração, enfrentaremos um referenceerror, como fizemos no exemplo a seguir:

console.log ("Acesso antes da declaração:", a);
a = 45;

Tentamos imprimir o valor de "A" no console antes de sua declaração e, na próxima declaração, atribuímos um valor à variável 'a' sem usar a palavra -chave "var":

Temos a seguinte saída:

Conclusão

Em JavaScript, o escopo da variável determina onde você pode acessar uma variável no código durante a iação das variáveis ​​refere -se ao conceito de invocar as declarações de variáveis ​​no topo do programa. Este artigo fornece os exemplos até o ponto para entender o conceito de escopo e a elevação da variável no JavaScript.