ใน JavaScript สามารถ กำหนดฟังก์ชันให้ตัวแปร ได้ โดยใช้ Anonymous Function (Function Expression) ฟังก์ชันไม่มีชื่อ เรียกใช้ผ่านชื่อตัวแปร
ตัวอย่างพื้นฐาน
var func = function() {
alert('This is anonymous');
};
func(); // เรียกใช้ผ่านตัวแปร
Anonymous Function Expression
// ไม่มีชื่อ
var a = function() {
return 5;
};
// Named Function Expression (มีชื่อภายใน)
var b = function bar() {
return 5;
};
// เรียกใช้
a(); // 5
b(); // 5
// bar(); // ReferenceError: bar is not defined (ชื่อ bar ใช้ได้แค่ในฟังก์ชันเอง)
Arrow Function Assignment (ES6)
const add = (a, b) => a + b;
const greet = name => `Hello, ${name}!`;
const noop = () => {};
คุณสมบัติของ Function Expression
- ไม่มี Hoisting: ต้องประกาศก่อนใช้ (ReferenceError ถ้าเรียกก่อน)
- First-class: ส่งเป็นอาร์กิวเมนต์, คืนค่า, เก็บใน Array/Object ได้
- Closure: จับตัวแปรจาก Scope รอบนอกได้
Callback Pattern (ใช้งานจริง)
// ส่งฟังก์ชันเป็น Callback
function fetchData(callback) {
setTimeout(() => callback("Data loaded"), 1000);
}
fetchData(function(data) {
console.log(data); // "Data loaded"
});
// หรือ Arrow Function
fetchData(data => console.log(data));
IIFE (Immediately Invoked Function Expression)
(function() {
var privateVar = "secret";
window.myModule = {
getSecret: () => privateVar
};
})();
แนะนำ: ใช้ const สำหรับ Function Expressions/Arrow Functions เพื่อป้องกันการ Reassign โดยไม่ได้ตั้งใจ