ตัวแปรระดับโลกและพารามิเตอร์ของฟังก์ชันใน JavaScript

สมมติว่าเรามีฟังก์ชันที่รับพารามิเตอร์เป็น ตัวเลข:

function func(localNum) {
	console.log(localNum);
}

สมมติว่าภายนอกฟังก์ชันมีตัวแปร num:

function func(localNum) {
	console.log(localNum);
}

let num = 1; // ตัวแปรระดับภายนอก (global)

ลองเรียกใช้ฟังก์ชันของเรา โดยส่ง ตัวแปร num เป็นพารามิเตอร์:

function func(localNum) {
	console.log(localNum);
}

let num = 1;
func(num); // เรียกใช้ฟังก์ชันพร้อมพารามิเตอร์ จะแสดงผล 1

ผลลัพธ์ที่ได้คือภายในฟังก์ชันจะสามารถเข้าถึงได้ทั้ง ตัวแปร localNum (พารามิเตอร์ ของฟังก์ชัน) และตัวแปร num (เป็น ตัวแปรภายนอก):

function func(localNum) {
	console.log(num); // จะแสดงผล 1
	console.log(localNum); // จะแสดงผล 1
}

let num = 1;
func(num);

ตัวแปร localNum เองจะเป็นตัวแปรท้องถิ่น (local) ของฟังก์ชันและจะไม่สามารถเข้าถึงได้จากภายนอก:

function func(localNum) {
	
}

let num = 1;
func(num); // เรียกใช้ฟังก์ชันพร้อมพารามิเตอร์
console.log(localNum); // จะเกิดข้อผิดพลาด

เนื่องจากตัวแปร localNum เป็นตัวแปรท้องถิ่น การเปลี่ยนแปลงใดๆ กับมันจะไม่ส่งผลกระทบต่อภายนอก:

function func(localNum) {
	localNum = 2; // ไม่มีการเปลี่ยนแปลงใดๆ ภายนอก
}

let num = 1;
func(num);

แต่ถ้าเราเปลี่ยนตัวแปร num (ตัวแปรระดับโลก) ภายใน การเปลี่ยนแปลงจะปรากฏภายนอกด้วย:

function func(localNum) {
	num = 2;
}

let num = 1;
func(num);
console.log(num); // จะแสดงผล 2

อย่างไรก็ตาม หากประกาศตัวแปร num ภายในฟังก์ชันผ่านคำสั่ง let เราจะสร้างตัวแปรท้องถิ่น num ที่ไม่ส่งผลต่อตัวแปรภายนอก:

function func(localNum) {
	let num = 2; // ประกาศผ่าน let
}

let num = 1;
func(num);
console.log(num); // จะแสดงผล 1 - ไม่มีอะไรเปลี่ยนแปลง