(บทความนี้ใช้มาตรฐานภาษาจาวาสคริปต์เวอร์ชั่น ES6) ในภาษาจาวาสคริปต์ (JavaScript) เราสามารถแยกส่วนของโปรแกรม (code) ที่ใช้บ่อยๆออกมาสร้างเป็นฟังก์ชั่น (function) เพื่อให้สามารถเรียกใช้งานได้ง่ายๆ โดยมีรูปแบบดังนี้

fucntion functionName() {
// body code;
}

เราสามารถส่งตัวแปร (variable) หรือข้อมูลผ่านตัวแปรของฟังก์ชั่นซึ่งเรียกว่าพารามิเตอร์ (parameter) ของฟังก์ชั่นเพื่อนำไปใช้งานในฟังก์ชั่นได้ตามตัวอย่าง ข้อมูลที่ส่งผ่านพารามิเตอร์ของฟังก์ชั่นเราเรียกว่าอากิวเมนท์ (argument)

fucntion functionName(parameter1, parameter2 … parameterX) {
// body code;
}

เราสามารถกำหนดค่าตั้งต้น (default value) ให้กับพารามิเตอร์ได้ตามตัวอย่าง

function functionName(patrameter1 = value1, parameter2 = value2 … parameterX = valueX){
// body code;
}

เราสามารถระบุให้ฟังก์ชั่นส่งค่ากลับออกมาได้โดยใช้คีย์เวอร์ด return ตามตัวอย่าง

function functionName(parameter){
// body code;
return result;
}


เราสามารถเรียกใช้ฟังก์ชั่นอื่นๆในอีกฟังก์ชั่นนึงได้และเรียกฟังก์ชั่นนั้นว่าฟังก์ชั่นผู้ช่วย (helper function) จากตัวอย่างด้านล่าง functionName1 เป็นฟังก์ชั่นผู้ช่วย

function functionName1(parameter){
// body code;
return result;
}
function functionName2(parameter){
// body code;
const const1 = functionName1(value);
}

เราสามารถกำหนดฟังก์ชั่นให้กับตัวแปรได้โดยตรงเรียกว่านิพจน์แบบฟังก์ชั่น (function expression) โดยการกำหนดฟังก์ชั่นแบบนี้มักจะไม่มีการระบุชื่อฟังก์ชั่นเรียกว่าฟังก์ชั่นนิรนาม (anonymous function) ตามตัวอย่าง

const const1 = function (parameter){
// body code;
return result;
}
console.log(const1(parameter)); // เวลาใช้งานจะเป็นการเรียกตัวแปรตามด้วยวงเล็บที่มีพารามิเตอร์คล้ายกับการเรียกใช้ฟังก์ชั่น

ในภาษาจาวาสคริปต์เวอร์ชั่น ES6 เราสามารถเขียนนิพจน์แบบฟังก์ชั่นโดยใช้เครื่องหมาย => (arrow function) แทนการใช้คีย์เวิร์ด function ดังนี้

const const1 = (parameter) => {
// body code;
return result;
}

รูปแบบอื่นๆของการใช้ => ประกอบด้วย

const const1 = () => { }; // กรณีที่ไม่มีพารามิเตอร์
const const1 = parameter => { }; // กรณีที่มีพรารามิเตอร์ตัวเดียว
const const1 = (parameter1, parameter2) => { }; // กรณีที่มีพรารามิเตอร์มากกว่าหนึ่ง
const const1 = parameter => parameter + parameter; // กรณีที่มีคำสั่งเพียงบรรทัดเดียว สามารถละเว้น { } และคีย์เวิร์ด return

เราสามารถมองว่าฟังก์ชั่นเป็นชนิดข้อมูลแบบนึง ดังนั้นเมื่อเรากำหนดฟังก์ชั่นให้กับตัวแปรแล้ว เราสามารถกำหนดตัวแปรดังกล่าวต่อให้กับตัวแปรอื่นได้อีก เช่น

const thisFunctionHasVeryLongName = () => console.log(‘value’); // กำหนดฟังก์ชั่นให้กับตัวแปร
const shortName = thisFunctionHasVeryLongName; // กำหนดค่าต่อให้กับตัวแปรอื่น สังเกตว่าการกำหนดค่าให้กับตัวแปรอื่นไม่ต้องมี ()
shortName(); // การเรียกใช้งานผ่านตัวแปรใหม่ต้องมี () ตามปรกติ

อันที่จริงฟังก์ชั่นก็เป็นออบเจกต์ดังนั้นจะมีคุณสมบัติ (property) และเมธอด (method) เช่นเดียวกับออบเจกต์อื่นๆ เช่น หากเราต้องการรู้ว่าตัวแปรใหม่ที่กำหนดมาจากตัวแปรเดิมชื่ออะไร เราใช้คุณสมบัติ name (shortName.name)

เมื่อเรามองว่าฟังก์ชั่นเป็นชนิดข้อมูลแบบนึง เราสามารถส่งฟังก์ชั่นผ่านพารามิเตอร์ของฟังก์ชั่นอื่นได้เช่นเดียวกับข้อมูล ฟังก์ชั่นที่รับฟังก์ชั่นเป็นพารามิเตอร์ และสามารถคืนค่าเป็นฟังก์ชั่น เรียกว่า higher order function และฟังก์ชั่นที่ถูกส่งผ่านพารามิเตอร์เรียกว่า callback function เช่น

const higherOrderFunc = param => {
  param();
  return `I just invoked ${param.name} as a callback function!`
}
const anotherFunc = () => {
  return ‘I\’m being invoked by the higher-order function!’;
}
higherOrderFunc(anotherFunc);

anonymous function ก็สามารถกำหนดเป็นพารามิเตอร์ได้ เช่น

higherOrderFunc(() => {
  for (let i = 0; i <= 10; i++){
    console.log(i);
  }
});

ตัวอย่างการใช้ higher order function เช่น การใช้เมธอด forEach() ซึ่งเป็นเมธอดที่เป็น iterator (ตัววนรอบ) เพื่ออ่านค่าจากอาเรย์และส่งฟังก์ชั่น (callback function) ที่ใช้แสดงผลเป็นพารามิเตอร์ให้เมธอด forEach() ตัวอย่างด้านล่างเป็นการใช้งานทั้งแบบฟังก์ชั่นปรกติ แบบ anonymous function และแบบ arrow function

// แบบที่ 1
const myArray = [1,2,3];
function printMyValue(myValue){
console.log(myValue);
}
myArray.forEach(printMyValue);
พิมพ์ 1 2 3

//แบบที่ 2
const myArray = [1,2,3];
myArray.forEach(function(myValue){
console.log(myValue);
});
พิมพ์ 1 2 3

// แบบที่ 3
const myArray = [1,2,3];
myArray.forEach(myValue => console.log(myValue));
พิมพ์ 1 2 3