O que içar é um JavaScript?

Hoisting refere-se ao processo em JavaScript onde as declarações são feitas antes da execução. As declarações de variáveis ​​e funções são processadas primeiro. Como resultado, mesmo que uma variável seja referenciada antes de sua declaração, ela não causará um erro, mas retornará indefinido. Para declarações de função, toda a função é içada, o que significa que pode ser usada antes de ser definida no código. Este processo coloca as declarações na pilha antes do início da execução.

Em termos mais simples:

• Variáveis ​​declaradas com var são inicializadas como indefinidas durante o içamento.

• As declarações de função são totalmente içadas e podem ser chamadas antes de serem escritas no código.

• O processo de elevação garante que essas declarações sejam reconhecidas na pilha de execução, independentemente de sua posição no código.

É importante observar que apenas as declarações são içadas, não as atribuições. As tarefas permanecem no mesmo local onde você as escreveu.

Nota: Aqueles que dizem que durante o içamento o código se move para o topo estão realmente errados. O código nunca sobe.

Exemplo:

console.log(myVariable); // undefined      
var myVariable = 10;

Este código executa duas ações simultaneamente. Primeiro, ele declara a variável myVariable e a eleva ao escopo, mas seu valor ainda é indefinido. Portanto, o comando console.log exibe o valor não inicializado como indefinido. Depois disso, o valor 10 é atribuído a myVariable.

No entanto, se você tentar alterá-lo, isso não terá nenhum efeito na declaração anterior. Por exemplo:

console.log(myVariable); // ReferenceError: myVariable is not defined      
myVariable = 10;

Aqui, não declaramos a variável myVariable, então ela gera um ReferenceError antes de tentar alterá-la.

Em resumo, o JavaScript lê todo o código primeiro e depois eleva todas as declarações para fora, mantendo as atribuições em suas posições originais. Este processo é conhecido como içamento.

var e let também são içados:

Tanto var quanto let são içados em JavaScript, mas seu comportamento é um pouco diferente.

var:

Quando você declara uma variável usando var, sua declaração é içada para fora do escopo, e você pode acessar a variável antes de sua declaração, mas ela terá o valor indefinido até que um valor seja atribuído a ela.

Exemplo:

console.log(myVariable); // undefined
var myVariable = 10;

No código acima, a declaração var myVariable é elevada para fora do escopo, mas a atribuição myVariable = 10 é deixada no lugar. Portanto, a instrução console.log gera indefinido porque a variável existe, mas ainda não recebeu um valor.

deixar:

Por outro lado, quando você declara uma variável usando let, o comportamento de elevação é um pouco diferente. A declaração da variável é elevada, mas você não pode acessar a variável antes de sua declaração. Isso é conhecido como “zona morta temporal”. Se você tentar acessar uma variável let antes de sua declaração, você receberá um ReferenceError.

Exemplo:

console.log(myVariable); // ReferenceError: myVariable is not defined
let myVariable = 10;

Neste caso, a declaração let é içada, mas a variável não pode ser acessada antes de sua declaração. Portanto, o console.logstatement lança um ReferenceError porque a variável ainda não foi definida.

Aqui basicamente no caso de let, mesmo que içado, o valor da variável permanece indefinido. Porque não há espaço na memória para essa variável. Por causa disso, não é possível se referir a esse endereço. Como não há endereço de myVariable = 10 na memória, ocorre um erro de referência.

const:

A palavra-chave const permite criar constantes, que são variáveis ​​que não podem ser reatribuídas depois que um valor é atribuído a elas.

Exemplo:1

const PI = 3.142;
PI = 22/7; // Attempt to reassign the value of PI
console.log(PI); // Output: TypeError: Assignment to constant variable

Neste exemplo, definimos PI como uma constante com valor inicial de 3,142. Quando tentamos reatribuir um novo valor ao PI, um TypeError é lançado porque as constantes não podem ser reatribuídas.

Exemplo:2

const PI;
console.log(PI); // Output: SyntaxError: Missing initializer in const declaration
PI = 3.142;

Neste caso, declaramos um PI constante sem inicializá-lo. Este código lança um SyntaxError porque as constantes devem ser declaradas e inicializadas ao mesmo tempo.

Exemplo:3

function getCircumference(radius) {
  console.log(circumference);
  circumference = PI * radius * 2;
  const PI = 22/7;
}
getCircumference(2); // ReferenceError: circumference is not defined

Aqui, dentro da função getCircumference, tentamos acessar a circunferência antes de sua declaração. Ele lança um ReferenceError porque a variável ainda não está definida.

Ao usar const, é necessário declarar e inicializar a variável antes de usá-la.

No geral, var e let são ambos içados em JavaScript, mas seu comportamento e o conceito de zona morta temporal se aplicam apenas a variáveis ​​let. const cria constantes que não podem ser reatribuídas depois de inicializadas.

Todas as variáveis ​​não declaradas são variáveis ​​globais:

function hoisted() {
a = 20;
var b = 100;
}
hoisted();
console.log(a); // 20
// can be accessed as a global variable outside the hoisted() function.

console.log(b);
// As it is declared, it is bound within the bounds of the hoisted() function. We cannot print it outside the hoisted() function.
output: ReferenceError: b is not defined

Variáveis ​​com escopo de função

Podemos ver que a declaração da variável var message no escopo da função hoist() vai para o topo da função.
Para evitar esse problema, garantiremos a declaração da variável antes de usá-la.

Em ambos os exemplos fornecidos, a saída será indefinida.

Exemplo:1

function hoist() {
  console.log(message);
  var message = 'Hoisting is all the rage!';
}
hoist(); // Output: undefined

Exemplo:2

function hoist() {
  var message;
  console.log(message);
  message = 'Hoisting is all the rage!';
}

hoist(); // Output: undefined

Em ambos os casos, a saída é indefinida porque as variáveis ​​são içadas para o topo de seus respectivos escopos, mas sua atribuição ocorre posteriormente na ordem original do código.

Expressões de função

As expressões de função não são içadas e geram um TypeError porque a expressão é tratada como uma variável e não como uma função.

expression(); // Output: "TypeError: expression is not a function
var expression = function() {
  console.log('Will this work?');
};

Modo Estrito

Pelo nome, é uma variante restrita do JavaScript que não tolera o uso de variáveis ​​antes de serem declaradas. Executando nosso código em modo estrito:

• Elimina alguns erros silenciosos de JavaScript, alterando-os para erros de lançamento explícitos.

• Corrige erros que dificultam a otimização dos mecanismos JavaScript.

• Você pode perder a declaração da variável, use strict que o impediu de gerar um erro de referência.
  

'use strict';

console.log(hoist); // Output: ReferenceError: hoist is not defined
hoist = 'Hoisted';

Conclusão

É importante entender o hoisting em JavaScript ao declarar variáveis ​​e funções, à medida que o hoisting é explicado, você entenderá como o código JavaScript está realmente sendo tratado.