📌 พื้นฐานของ JavaScript : ฟังก์ชัน (Functions)

---

1️⃣ ฟังก์ชันคืออะไร?

• ฟังก์ชัน (Function) คือชุดของคำสั่งที่สามารถเรียกใช้ซ้ำได้

• ช่วยทำให้โค้ดอ่านง่าย เป็นระเบียบ และลดความซ้ำซ้อน

---

2️⃣ การประกาศฟังก์ชัน

2.1 แบบมาตรฐาน (Function Declaration)

javascript

function sayHello() {
  console.log("สวัสดีครับ");
}

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

2.2 แบบนิพจน์ (Function Expression)

javascript

const sayHello = function() {
  console.log("สวัสดีครับ");
};

sayHello();

2.3 แบบลูกศร (Arrow Function)

นิยมใช้ใน ES6 ขึ้นไป

javascript

const sayHello = () => {
  console.log("สวัสดีครับ");
};

sayHello();

---

3️⃣ ฟังก์ชันแบบรับพารามิเตอร์

ส่งค่าพารามิเตอร์เข้าไป

javascript

function greet(name) {
  console.log("สวัสดี " + name);
}

greet("มิว");

ส่งหลายพารามิเตอร์

javascript

function add(a, b) {
  return a + b;
}

let result = add(5, 3);  // 8
console.log(result);

---

4️⃣ ค่าเริ่มต้นของพารามิเตอร์ (Default Parameters)

javascript

function greet(name = "เพื่อน") {
  console.log("สวัสดี " + name);
}

greet();       // สวัสดี เพื่อน
greet("มิว");  // สวัสดี มิว

---

5️⃣ การคืนค่า (Return Value)

• ใช้ return คืนค่ากลับออกมาจากฟังก์ชัน

javascript

function multiply(a, b) {
  return a * b;
}

let result = multiply(3, 4);
console.log(result); // 12

• ถ้าไม่มี return ฟังก์ชันจะคืนค่า undefined อัตโนมัติ

---

6️⃣ ฟังก์ชันซ้อนฟังก์ชัน (Nested Function)

javascript

function outer() {
  function inner() {
    console.log("ฟังก์ชันซ้อน");
  }
  inner();
}

outer();

---

7️⃣ การส่งฟังก์ชันเป็นพารามิเตอร์ (Callback Function)

javascript

function processUserInput(callback) {
  const name = "มิว";
  callback(name);
}

processUserInput(function(name) {
  console.log("สวัสดี " + name);
});

📌 Callback ใช้บ่อยมากในการเขียนเว็บ (เช่น event, async, promise)

---

8️⃣ ฟังก์ชันลูกศร (Arrow Function) แบบย่อ

รูปแบบย่อสุด

javascript

const add = (a, b) => a + b;
console.log(add(5, 2));  // 7

ไม่มีพารามิเตอร์

javascript

const sayHi = () => console.log("สวัสดี");
sayHi();

---

9️⃣ ฟังก์ชันแบบ IIFE (Immediately Invoked Function Expression)

เรียกใช้ตัวเองทันที

javascript

(function() {
  console.log("ฟังก์ชันนี้ถูกเรียกใช้ทันที");
})();

---

🎯 สรุป

• ฟังก์ชันช่วยให้โค้ดเป็นระเบียบ นำกลับมาใช้ซ้ำได้

• มีหลายรูปแบบ: Declaration, Expression, Arrow Function

• ใช้ return คืนค่า

• ฟังก์ชันสามารถรับพารามิเตอร์ และส่งฟังก์ชันอื่นเป็นพารามิเตอร์ได้ (Callback)

• Arrow function ย่อโค้ดได้สั้นและทันสมัย