ฟังก์ชันปกติเทียบกับฟังก์ชันลูกศร
ฟังก์ชันลูกศร ใช้ในการเขียนโค้ดอย่างกระชับ ทั้งสองฟังก์ชั่น ปกติ และ ลูกศร ทำงานในลักษณะที่คล้ายกัน แต่มีความแตกต่างบางอย่างระหว่างพวกเขา มาพูดถึงความแตกต่างเหล่านั้นโดยสังเขป
ไวยากรณ์ของฟังก์ชันลูกศร
let x = (params) => {
// code
}; ไวยากรณ์ของฟังก์ชันปกติ
let x = function functionname(params){
// code
}; การใช้คีย์เวิร์ด "นี้"
ไม่สามารถใช้คีย์เวิร์ด "นี้" ในฟังก์ชันลูกศรได้ แต่ในฟังก์ชันปกติจะสามารถใช้งานได้โดยไม่มีการรบกวน
ตัวอย่าง
ในตัวอย่างต่อไปนี้ ทั้ง ปกติ (สี่เหลี่ยมผืนผ้า) และ ลูกศร (สี่เหลี่ยม) ถูกใช้ภายในวัตถุ "จำนวน " ซึ่งประกอบด้วยคุณสมบัติ len(length) และ bre(breadth) เป้าหมายของเราคือการหาพื้นที่ของ สี่เหลี่ยมจัตุรัส (len*len) โดยใช้ ฟังก์ชันลูกศร และ พื้นที่สี่เหลี่ยมผืนผ้า (len*bre) โดยใช้ ปกติ การทำงาน. แต่เนื่องจาก "นี่ " คำหลักไม่ทำงานในฟังก์ชันลูกศร ค่าของพื้นที่ของ สี่เหลี่ยม ถูกส่งกลับเป็น "NaN " ในขณะที่ใช้ ปกติ ฟังก์ชัน เราได้พื้นที่ที่แน่นอนของ สี่เหลี่ยมผืนผ้า ดังแสดงในผลลัพธ์
<html>
<body>
<script>
var num = {
len: 12,
bre: 13,
square:() => {
document.write(this.len * this.len);
},
rectangle(){
document.write(this.len * this.bre);
}
};
num.square();
document.write("</br>");
num.rectangle();
</script>
</body>
</html> ผลลัพธ์
NaN 156
การใช้คำสำคัญ 'ใหม่'
ฟังก์ชัน ลูกศร ไม่ใช่ "สร้างได้ " แต่ "โทรได้ " ดังนั้นคำหลัก "ใหม่ " ใช้งานไม่ได้ในขณะที่ฟังก์ชันปกติ มีทั้ง "โทรได้ " และ "สร้างได้ " ดังนั้น "ใหม่ " คีย์เวิร์ดทำงานที่นี่
ตัวอย่าง
ในตัวอย่างต่อไปนี้ การใช้ "ใหม่ " อาร์กิวเมนต์บางคำส่งผ่านไปยังทั้ง ปกติ และ ลูกศร การทำงาน. แต่เนื่องจาก ฟังก์ชันลูกศร ไม่ใช่ "สร้างได้ " เราจะได้รับข้อผิดพลาดในขณะที่เราจะได้รับผลลัพธ์ที่ถูกต้องไปยัง ฟังก์ชันปกติ .
<html>
<body>
<script>
var word = function(){
document.write(JSON.stringify(arguments));
/// executes '{"0":"Tutorix","1":"Tutorialspoint"}' as output
};
new word("Tutorix","Tutorialspoint");
var newword = ()=> {
document.write(JSON.stringify(arguments));
//executes 'newword is not a constructor' as output
};
new newword("Tutorix","Tutorialspoint");
</script>
</body>
</html> . ใหม่ 