Penerapan Lingkungan Leksikal Fungsi dalam JavaScript

Misalkan kita memiliki fungsi yang mengembalikan fungsi lain sebagai hasilnya:

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

Jika fungsi induk memiliki variabel apa pun, maka variabel tersebut akan terkandung dalam lingkungan leksikal fungsi yang dikembalikan:

function test() {
	let num = 1; // variabel fungsi induk
	
	return function() {
		// lingkungan leksikal = {num: 1}
	}
}

Mari kita tulis dalam kode fungsi yang dikembalikan console.log, yang menampilkan nilai variabel num:

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

Sekarang mari panggil fungsi induk test dan tulis hasilnya ke dalam variabel func:

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

let func = test();

Fungsi yang dikembalikan akan ditulis ke dalam variabel func. Mari panggil fungsi kita - hasilnya akan menampilkan isi variabel num:

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

let func = test();
func(); // menampilkan 1

Jika kita mencoba menampilkan variabel num di luar fungsi - variabel tersebut tidak akan dapat diakses:

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

console.log(num); // variabel num tidak dapat diakses di sini

Seperti yang Anda lihat, variabel lokal num terikat pada lingkungan leksikal fungsi kita dan sekarang, dengan memanggil fungsi ini di mana pun dalam kode, kita bisa mendapatkan nilai variabel num, bahkan jika di tempat pemanggilan variabel ini sendiri tidak dapat diakses.

Sebenarnya, hasil yang serupa dapat dicapai dengan membuat variabel num menjadi global:

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

let num = 1; // variabel global
let func = test();
func(); // menampilkan 1

Namun, di sini akan ada perbedaan yang signifikan: dalam versi baru, variabel num dapat diubah di luar fungsi (karena bersifat global), sedangkan dalam versi lama - tidak.

Tentukan, tanpa menjalankan kode, apa yang akan ditampilkan di konsol:

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

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

Tentukan, tanpa menjalankan kode, apa yang akan ditampilkan di konsol:

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

console.log(test()());

Tentukan, tanpa menjalankan kode, apa yang akan ditampilkan di konsol:

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

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

Tentukan, tanpa menjalankan kode, apa yang akan ditampilkan di konsol:

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

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