การเข้าถึงตัวแปรภายนอกของฟังก์ชันใน JavaScript

ลองพิจารณารหัสต่อไปนี้:

javascriptlet num = 1; // กำหนดค่าตัวแปร

function func() {
  console.log(num); // แสดงผลในคอนโซล
}

func(); // เรียกใช้ฟังก์ชัน

อย่างที่ฉันเคยกล่าวไปก่อนหน้านี้ ค่าของตัวแปร ไม่จำเป็นต้องอยู่ก่อนนิยามฟังก์ชัน สิ่งสำคัญคือมันต้องอยู่ก่อน การเรียกใช้ฟังก์ชัน:

javascriptfunction func() {
  console.log(num);
}

let num = 1;
func();

ในความเป็นจริงมันไม่เป็นเช่นนั้นทั้งหมด ฟังก์ชันของเรา รู้ค่าของตัวแปรแม้กระทั่งก่อนที่จะถูกเรียกใช้ num:

javascriptlet num = 1;

function func() {
  console.log(num); // ฟังก์ชันรู้แล้วว่า num = 1
}

นี่คือตัวอย่างที่ซับซ้อนกว่า:

javascriptlet num = 1; // ในช่วงเวลานี้ฟังก์ชันรู้ว่า num = 1

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

num = 2; // ในช่วงเวลานี้ฟังก์ชันรู้ว่า num = 2

เพิ่มการเรียกใช้ฟังก์ชัน:

javascriptlet num = 1; // ในช่วงเวลานี้ฟังก์ชันรู้ว่า num = 1
func(); // จะแสดงผล 1

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

func(); // จะแสดงผล 1
num = 2; // ในช่วงเวลานี้ฟังก์ชันรู้ว่า num = 2
func(); // จะแสดงผล 2

อีกครั้ง: ในความเป็นจริงฟังก์ชันรู้ค่าของ ตัวแปรภายนอก แม้จะยังไม่ถูกเรียกใช้