นิพจน์ฟังก์ชันที่มีชื่อใน JavaScript

สมมติว่าเรามีนิพจน์ฟังก์ชันแบบนี้:

let test = function() {
	console.log('!');
};

test(); // จะแสดง '!'

ลองตั้งชื่อให้ฟังก์ชันของเราว่า func:

let test = function func() {
	console.log('!');
};

test();

อย่างที่คุณรู้แล้ว เราไม่สามารถอ้างอิงถึงฟังก์ชันด้วยชื่อนี้ได้:

let test = function func() {
	console.log('!');
};

test(); // จะแสดง '!'
func(); // จะเกิดข้อผิดพลาด

แล้วตั้งชื่อฟังก์ชันไปทำไมถ้ามันจะไม่สามารถเข้าถึงได้? ประเด็นคือชื่อนี้จะ ไม่สามารถเข้าถึงได้จากภายนอกฟังก์ชัน แต่สามารถเข้าถึงได้ภายใน ฟังก์ชันนั้น

ลองทดสอบดู:

let test = function func() {
	console.log(func); // ฟังก์ชันจะแสดง source code ของตัวมันเอง
};

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

ลองเรียกใช้ฟังก์ชันของเรา inside ตัวมันเอง:

let test = function func() {
	console.log('!'); // แสดง '!'
	func(); // เรียกใช้ตัวมันเอง
};

test();

หากรันโค้ดนี้ จะมีการแสดงผลลงคอนโซล จำนวนไม่สิ้นสุด

ที่จริงแล้วฟังก์ชันของเราสามารถถูกเรียกใช้ ภายในตัวมันเองได้ไม่เฉพาะในชื่อ func เท่านั้น แต่ในชื่อ test ก็ได้:

let test = function func() {
	console.log('!');
	test(); // เรียกใช้ตัวมันเอง
};

test();

แล้วความแตกต่างคืออะไร? ความแตกต่างคือชื่อ test - นี่เป็นแค่ตัวแปร ในกระบวนการ ทำงานของสคริปต์ ฟังก์ชันของเราอาจถูกเขียน ลงในตัวแปรอื่นหรือส่งผ่านเป็นพารามิเตอร์ - ในกรณีนี้การเชื่อมโยงระหว่างตัวแปร test และฟังก์ชันอาจหายไป

ส่วนชื่อ func นั้นถูกผูกไว้กับฟังก์ชันอย่างแน่นหนา โดยเฉพาะเพื่อให้สามารถอ้างอิงถึง ฟังก์ชันของเรา within ตัวมันเองได้

Function Expression ประเภทนี้ที่มีชื่อฟังก์ชัน เรียกว่า นิพจน์ฟังก์ชันที่มีชื่อ