Aplicação do Ambiente Léxico de Funções em JavaScript

Suponha que temos uma função que retorna outra função como resultado:

function test() {
	return function() {
		
	}
}

Se a função pai tem alguma variável, essas variáveis estarão contidas no ambiente léxico da função retornada:

function test() {
	let num = 1; // variável da função pai
	
	return function() {
		// ambiente léxico = {num: 1}
	}
}

Vamos escrever em nosso código da função retornada um console.log, que exibe o valor da variável num:

function test() {
	let num = 1;
	
	return function() {
		console.log(num);
	}
}

Agora vamos chamar a função pai test e registrar o resultado dela na variável func:

function test() {
	let num = 1;
	
	return function() {
		console.log(num);
	}
}

let func = test();

A função retornada será registrada na variável func. Vamos chamar nossa função - seu resultado será exibir o conteúdo da variável num:

function test() {
	let num = 1;
	
	return function() {
		console.log(num);
	}
}

let func = test();
func(); // exibirá 1

Se tentarmos simplesmente exibir a variável num fora da função - ela estará inacessível:

function test() {
	let num = 1;
	
	return function() {
		console.log(num);
	}
}

console.log(num); // variável num aqui está inacessível

Como você pode ver, a variável local num vinculou-se ao ambiente léxico da nossa função e agora, chamando essa função em qualquer lugar do código, poderemos obter o valor da variável num, mesmo que no local da chamada essa variável por si só seja inacessível.

Na verdade, um resultado semelhante pode ser alcançado tornando a variável num global:

function test() {
	return function() {
		console.log(num);
	}
}

let num = 1; // variável global
let func = test();
func(); // exibirá 1

No entanto, haverá uma diferença substancial aqui: na nova versão, a variável num pode ser alterada fora das funções (por ser global), enquanto na versão antiga - não.

Determine, sem executar o código, o que será exibido no console:

function test() {
	let num1 = 1;
	let num2 = 2;
	
	return function() {
		return num1 + num2;
	}
}

let func = test();
console.log(func());

Determine, sem executar o código, o que será exibido no console:

function test() {
	let num1 = 1;
	let num2 = 2;
	
	return function() {
		return num1 + num2;
	}
}

console.log(test()());

Determine, sem executar o código, o que será exibido no console:

function test() {
	let num1 = 1;
	
	return function() {
		return num1 + num2;
	}
}

let num2 = 2;
let func = test();
console.log(func());

Determine, sem executar o código, o que será exibido no console:

function test() {
	let num = 1;
	
	return function() {
		return num;
	}
}

let num = 2;
let func = test();
console.log(func());