DEV Community

hambalee
hambalee

Posted on

ทบทวน Arrow Function ใน JavaScript คืออะไร ใช้ยังไง

Arrow Function คืออะไร
Arrow Function คือการสร้างฟังก์ชันรูปแบบใหม่ที่สั้นกระชับกว่าเดิม
ตัวอย่าง ฟังค์ชันแบบเดิม

function printName(name){
 console.log(name)
}
printName('A')
Enter fullscreen mode Exit fullscreen mode

สามารถเปลี่ยนเป็น Arrow Function ได้ดังต่อไปนี้

const printName = (name) => {
 console.log(name)
}
printName('A')
Enter fullscreen mode Exit fullscreen mode

จะได้ผลลัพธ์เหมือนกัน

ถ้าเป็นฟังก์ชันที่รับค่ามา 2 ตัวแปรจะเขียนเป็นแบบนี้

const printName = (name,age) => {
 console.log(name,age)
}
printName('A',20)
Enter fullscreen mode Exit fullscreen mode

เปลี่ยนเป็นฟังก์ชันที่มีการ return หรือมีการส่งค่ากลับ

const mul = (number) => {
 return number * 2
}
console.log(mul(2))
Enter fullscreen mode Exit fullscreen mode

ผลลัพธ์ที่ได้จะเป็น 4

สามารถเขียนให้สั้นลงโดยการตัดปีกกาและคำว่า return ออกไปได้
เพราะมีแค่บรรทัดเดียวซึ่งเป็นการ return จะได้เป็น

const mul = (number) => number * 2
console.log(mul(2))
Enter fullscreen mode Exit fullscreen mode

ผลลัพธ์ที่ได้จะเป็นเหมือนเดิมคือ 4
ส่วนที่เป็น (number) สามารถเอาวงเล็บออกได้เหมือนกันถ้ามีแค่ตัวแปรเดียว
จะได้เป็น

const mul = number => number * 2
console.log(mul(2))
Enter fullscreen mode Exit fullscreen mode

แต่ถ้ามี 2 ตัวแปรจะต้องใส่ไว้เหมือนเดิม

const mul = (number1,number2) => number1 * number2
console.log(mul(2,2))
Enter fullscreen mode Exit fullscreen mode

Top comments (0)