Dominando os fundamentos do JavaScript
Tags: javascript, beginners, programming, webdev
Published: 2023-07-24 20:00:00

Entender os conceitos principais que governam o comportamento da linguagem é crucial para se tornar um programador proficiente. Vamos aprofundar nos exemplos para solidificar nosso entendimento.

## Contexto de Execução:
Sempre que uma função é invocada ou um script é executado, um Contexto de Execução é criado. O Contexto de Execução consiste em: _Variable Environment_, _Scope Chain_ e uma referência para a palavra chave 'this'. O _Variable Environment_ contém todas as variáveis e funções declaradas dentro do escopo atual, e a _Scope Chain_ fornece acesso às variáveis nos ambientes lexicais externos.

```
var greeting = "Hello";

function greet(name) {
  var message = greeting + ", " + name + "!";
  return message;
}

greet("Alice"); // Output: "Hello, Alice!"
```
Quando a função de 'greet' é executada, um novo Contexto de Execução é criado e seu Ambiente de Variável(_Variable Environment_) conterá nome, mensagem e uma referência à variável de saudação do ambiente externo.

## Global Environment e Global Object:
O _Global Environment_ é o ambiente lexical mais externo em um programa JavaScript, representando o escopo global. Inclui todas as variáveis e funções globais.
No navegador, o Objeto Global(_Global Object_) é o objeto _window_, enquanto no Node.js é o objeto _global_.

## Creation Phase and Hoisting:
Durante a fase de criação(_creation phase_), a memória é alocada para variáveis e funções, e as declarações de funções e variáveis são colocadas no topo de seu escopo.

```
console.log(hoistedVar); // Output: undefined
var hoistedVar = 42;
```
Neste exemplo, embora tentemos acessar hoistedVar antes de sua declaração, o JavaScript eleva a declaração e define seu valor inicial como _undefined_.

Em JavaScript, _undefined_ é um valor primitivo que representa uma variável não inicializada.

## Execution Context:
Após a Fase de Criação(_creation phase_), o código entra na Fase de Contexto de Execução, onde é executado linha por linha.

## Execution Stack:
Execution Stack (ou Pilha de Execuções) é um mecanismo que acompanha a execução de funções. Quando uma função é invocada, ela é adicionada à pilha e, quando retorna, é removida da pilha.

```
function first() {
  console.log("First function");
  second();
}

function second() {
  console.log("Second function");
}

first();

```
A execução de _first()_ adicionará _first()_ à pilha, que por sua vez chama _second()_ e o adiciona à pilha. Quando _second()_ termina a execução, ele é removido da pilha, seguido por _first()_.

## Scope Chain
Todo contexto de execução tem uma referência ao seu ambiente externo.
O que é ambiente externo?
No caso da função 'b', seu ambiente externo é
Execução do Contexto Global(_Global Context Execution_).
Ambiente Lexical(_Lexical Environment_)?
Significa onde algo está escrito, fisicamente, no código.
Determina certas coisas, como o motor JavaScript decidirá e interpretará onde as coisas vivem, e onde as coisas vão ficar na memória, e como eles vão se conectar uns aos outros. As referências ao ambiente externo são o _Scope Chain_.

## Scope
O escopo(_scope_) define a acessibilidade das variáveis em seu código. Ele determina onde as variáveis podem ser acessadas ou referenciadas.

```
function exampleScope() {
  var x = 10; // Local scope variable
  if (true) {
    var y = 20; // Function scope variable
    console.log(x + y);
  }
  console.log(x + y); // y is accessible here too
}

exampleScope();

```
Neste exemplo, _x_ tem um escopo local dentro da função exampleScope e _y_ tem um escopo de função dentro do bloco if.

## Conclusão
Compreender o funcionamento interno do JavaScript, é vital para se tornar um desenvolvedor competente em JavaScript. De posse desse conhecimento, você saberá escrever um código limpo, eficiente e livre de bugs, tornando-o um desenvolvedor JavaScript mais confiante e capaz.