ชื่อตัวแปรเดียวกันในฟังก์ชันใน JavaScript

สมมติว่าทั้งภายนอกฟังก์ชันและภายในฟังก์ชันมีตัวแปร num ในกรณีนี้ การเปลี่ยนแปลงใดๆ กับตัวแปรท้องถิ่น num จะไม่มีผล ต่อตัวแปรระดับโลก num อย่างแน่นอน:

javascriptlet num = 1; // ตัวแปรระดับโลก

function func() {
  let num = 2; // ตัวแปรท้องถิ่น
  console.log(num);
}
func(); // เรียกใช้ฟังก์ชัน, จะแสดง 2

console.log(num); // จะแสดง 1 - ตัวแปรระดับโลกไม่เปลี่ยนแปลง

แต่ถ้าเราลืมประกาศตัวแปรท้องถิ่น num ผ่าน let, ภายในฟังก์ชัน จะไม่สร้างตัวแปรท้องถิ่น num ขึ้นมา, แต่จะเป็นการเปลี่ยนแปลงตัวแปรระดับโลกแทน:

javascriptlet num = 1;

function func() {
  num = 2; // ลืมเขียน let - เปลี่ยนตัวแปรภายนอก
  console.log(num);
}
func(); // เรียกใช้ฟังก์ชัน, จะแสดง 2

console.log(num); // จะแสดง 2 - ตัวแปรถูกเปลี่ยนแล้ว

ในที่นี้อาจมีสถานการณ์สองแบบ: แบบแรกคือเราตั้งใจ จะเปลี่ยนตัวแปรระดับโลกจริงๆ (ในกรณีนั้น ก็ไม่有问题) หรือไม่เราก็ลืม let และโดยไม่ตั้งใจ เปลี่ยนตัวแปรระดับโลกไป

กรณีที่สองเป็นข้อผิดพลาดที่ตรวจจับได้ยาก, นำไปสู่พฤติกรรมของสคริปต์ที่คาดเดาไม่ได้ ดังนั้น ทุกครั้งที่นำตัวแปรใหม่เข้ามาใช้ ควรประกาศ มันผ่าน let เสมอ

javascriptlet num = 1;

function func() {
  num = 2;
}
func();

console.log(num);

javascriptlet num = 1;

function func() {
  let num = 2;
}
func();

console.log(num);