ฟังก์ชั่นการแกงใน JavaScript
นำภาชนะ, เติมน้ำ, เพิ่มบรรทัดรหัส, ใส่ใบแกงและมาซาล่า (ตามรสนิยมของคุณ), ปรุงอาหารด้วยไฟอ่อน ๆ เป็นเวลา 25 นาที และนี่คือฟังก์ชั่นการปั่นพร้อมเสิร์ฟในการผลิต . ล้อเล่น บอยส์กับโกล
Helloooo ผู้พัฒนา JS กลับมาแล้วกับประเด็นร้อนแรง “Function Currying”
เรื่องนี้ครอบคลุม:
- การแกงคืออะไร ทำงานอย่างไร และทำไมจึงใช้
เรื่องราวเริ่มต้นที่นี่
ฟังก์ชั่นแกงคืออะไร?
การแกงคือการแปลงฟังก์ชันที่รับอาร์กิวเมนต์หลายตัว [ตัวอย่าง: functionName(a, b,c)] เป็นหลายฟังก์ชันที่รับอาร์กิวเมนต์เดียวในลำดับ
โอเค โอเค.. ฉันรู้ว่ามันฟังดูสับสน (สับสน) และปฏิกิริยาของฉันก็เหมือนเดิมเมื่อฉันอ่านสิ่งนี้เป็นครั้งแรก
โอเค ให้เราเข้าใจง่ายๆ ฟังก์ชัน (doSum) ที่ใช้ args ทั้งหมดในช็อตเดียว เช่น doSum(a, b, c) [ตัวอย่างด้านล่าง: ฟังก์ชันการบวกปกติ
ถูกแปลงเป็นหลายฟังก์ชัน (addNumbers(a), (b), (c)) ที่รับอาร์กิวเมนต์เดียวในแต่ละครั้งในลำดับ
หมายเหตุ: ฟังก์ชัน (จุดประสงค์) ของทั้ง 2 ฟังก์ชันเหมือนกัน เพียงแต่เปลี่ยนชื่อเพื่อความเข้าใจที่ดีขึ้น
นี่คือฟังก์ชั่นการแกงตามgeeks for geeks :
เป็นเทคนิคหนึ่งในการเขียนโปรแกรมเชิงฟังก์ชัน การแปลงฟังก์ชันของอาร์กิวเมนต์หลายตัวเป็นฟังก์ชันหลายฟังก์ชันของอาร์กิวเมนต์เดียวตามลำดับ
พูดง่ายๆ ก็คือ ฟังก์ชันแทนที่จะรับอาร์กิวเมนต์ทั้งหมดพร้อมกัน ฟังก์ชันรับอาร์กิวเมนต์แรกแล้วส่งกลับฟังก์ชันที่รับอาร์กิวเมนต์อื่น จากนั้นจึงส่งกลับฟังก์ชันอื่นที่รับอาร์กิวเมนต์ที่สาม ไปเรื่อยๆ จนกว่าอาร์กิวเมนต์ทั้งหมดจะครบ ถ่าย (ตัวอย่างในภาพชื่อ: function currying)
แกงกะหรี่ทำงานอย่างไร?
การ curing ในจาวาสคริปต์อาจเข้าใจยากสักหน่อยเนื่องจากเป็นจาวาสคริปต์
แต่ลองมาดูกันดีกว่า ด้านล่างนี้เป็นตัวอย่างของฟังก์ชันง่ายๆ
ที่นี่ ฟังก์ชัน "doSum" เพิ่มอาร์กิวเมนต์ที่กำหนดและส่งคืนผลรวมของอาร์กิวเมนต์ทั้งหมดที่ส่งผ่าน
ด้านล่างเป็นฟังก์ชันเดียวกันในเวอร์ชันแกงกะหรี่ (เพิ่งเปลี่ยนชื่อเพื่อความเข้าใจที่ดีขึ้น)
ผลลัพธ์ของฟังก์ชันด้านบนและด้านล่างจะเหมือนกัน 18
addNumbers เป็นเวอร์ชันเคอร์รี่ของฟังก์ชัน doSum ข้างต้น addNumber ฟังก์ชันพาเรนต์รับอาร์กิวเมนต์ เช่น 5 ในกรณีของเรา และส่งคืนฟังก์ชันนิรนามอีกฟังก์ชันหนึ่งซึ่งรับอาร์กิวเมนต์อื่น เช่น 6 ในกรณีของเรา และกระบวนการจะดำเนินต่อไปจนกว่าพารามิเตอร์ทั้งหมดจะถูกส่งผ่าน ฟังก์ชันนิรนามสุดท้ายจะคืนค่าหลังจากประมวลผลอินพุตทั้งหมด
เราใช้ฟังก์ชันที่ซ้อนกันในตัวอย่างข้างต้น ดังนั้นแต่ละฟังก์ชันจึงรับหนึ่งอาร์กิวเมนต์และส่งคืนอีกฟังก์ชันหนึ่งจนกว่าอาร์กิวเมนต์ทั้งหมดจะยังไม่เสร็จสมบูรณ์
คุณสามารถแกงฟังก์ชันของคุณได้ 2 วิธี ใช้ฟังก์ชันผูก และปิด มาดูกันว่าหน้าตาเป็นอย่างไร
ฟังก์ชั่นการแกงโดยใช้ฟังก์ชั่นการผูก
หากคุณไม่ทราบว่าฟังก์ชันการผูกคืออะไรตรวจสอบเรื่องราวของฉัน
ในตัวอย่างด้านบนนี้ เรากำลังใช้ฟังก์ชันการผูกของจาวาสคริปต์ และการใช้ฟังก์ชันการผูก เราจะใช้ฟังก์ชัน “onBoardUser”
basicCompanyDetails นั้นคล้ายคลึงกันสำหรับผู้ใช้ที่เข้าร่วมทั้งหมด ดังนั้นเราต้องการทำให้รายละเอียดตามค่าเริ่มต้นพร้อมใช้งานสำหรับผู้ใช้ทุกคนที่เข้าร่วม ที่นี่เรากำลังส่งอาร์กิวเมนต์ “basicCompanyDetails” ไปยังฟังก์ชันการผูกและสร้างอินสแตนซ์ของ “onBoardUser” ที่นี่ ฟังก์ชันการผูกจะส่งคืนฟังก์ชันที่คุณสามารถจัดเก็บไว้ ณ ที่ใดที่หนึ่งในหน่วยความจำและดำเนินการในภายหลัง ที่นี่เรากำลังจัดเก็บฟังก์ชันนี้ใน addUser และเรากำลังเรียกใช้สำหรับผู้ใช้ทั้งหมด
นี่คือวิธีที่คุณสามารถแกงฟังก์ชันของคุณโดยใช้ฟังก์ชันผูกในจาวาสคริปต์ ตัวอย่างเพิ่มเติมในภาพด้านล่าง
คุณยังสามารถส่งทั้งสอง params ในขณะที่เรียกใช้เมธอด addUserToSales ซึ่งจะให้ผลลัพธ์ที่เหมือนกัน
ฟังก์ชั่นแกงโดยใช้การปิด
การปิดเป็นแนวคิดทั่วไปแต่ยุ่งยากในจาวาสคริปต์ แต่ไม่ได้กล่าวถึงมากนัก คุณสามารถอ่านเกี่ยวกับการปิดได้ ที่นี่
ลองใช้ฟังก์ชั่นการแกงโดยใช้การปิด
ในตัวอย่างข้างต้น เราได้สร้างฟังก์ชัน “onBoardUser” ที่รับหนึ่งอาร์กิวเมนต์และส่งคืนฟังก์ชันที่ไม่ระบุตัวตนอีกอันที่รับอาร์กิวเมนต์อื่น สรุปรายละเอียด และส่งกลับ
เรากำลังเรียกใช้ฟังก์ชัน “onBoardUser” ด้วยอาร์กิวเมนต์เดียว เช่นaccountDepartmentDetailsและจัดเก็บไว้ในตัวแปร (โปรดจำไว้ว่า onBoardUser ส่งคืนฟังก์ชัน) ดังนั้นเราจึงจัดเก็บฟังก์ชันไว้ในตัวแปรaddUsertoAccountsและตอนนี้ตัวแปรก็มีฟังก์ชันที่สามารถเรียกใช้ได้ทุกเมื่อด้วย อาร์กิวเมนต์ที่ร้องขอ เราจึงเรียกใช้ฟังก์ชันนิรนาม (ส่งคืนโดย onBoardUser) ที่จัดเก็บไว้ในaddUsertoAccountsพร้อมอาร์กิวเมนต์ (รายละเอียดผู้ใช้ เช่น detailsOfJohn)
เมื่อเรียกใช้ฟังก์ชันแล้ว ฟังก์ชันจะเสร็จสิ้นการดำเนินการของคำสั่งที่อยู่ภายในและพิมพ์ผลลัพธ์ออกมา
หากมีการเรียกใช้ฟังก์ชันหลังจากโค้ด 10k บรรทัดด้วย ฟังก์ชันจะพิมพ์เอาต์พุตเดียวกัน เนื่องจากเป็นการปิด และจดจำขอบเขตคำศัพท์ของมัน
การดัดผมด้วย ES6:
นี่คือวิธีที่คุณสามารถใช้ฟังก์ชั่นการแกงด้วยการปิดใน JS
ถึงกระนั้นคุณอาจมีคำถามหนึ่งข้อในหัวของคุณ ถ้าเราสามารถส่งอาร์กิวเมนต์หลายตัวไปยังฟังก์ชันได้ แล้วทำไมเราถึงต้องแกงด้วยล่ะ
สิ่งนี้น่าจะตอบข้อสงสัยเหล่านั้นได้
ทำไมถึงใช้
ทำไม ทำไม ทำไม
- การแกงเป็นเทคนิคที่แบ่งฟังก์ชันออกเป็นฟังก์ชันย่อยๆ แต่ละฟังก์ชันมีหน้าที่ของตัวเอง และทำให้ฟังก์ชันของคุณบริสุทธิ์และมีแนวโน้มที่จะเกิดข้อผิดพลาดและผลข้างเคียงน้อยลง
- ตัวอย่าง: ฟังก์ชันแรกตรวจสอบรายละเอียดผู้ใช้ ฟังก์ชันที่สองตรวจสอบรายละเอียดบริษัท ฯลฯ
- ใช้ในการเขียนโปรแกรมเชิงฟังก์ชันเพื่อใช้ฟังก์ชันลำดับที่สูงกว่า
- มันช่วยให้คุณรักษารหัสของคุณให้สะอาดและเป็นระเบียบ
- นอกจากนี้ คุณสามารถใช้การแกงเป็นกลไกที่ช่วยให้คุณตรวจสอบว่าคุณมีทุกอย่างครบก่อนดำเนินการต่อ
- ตัวอย่าง: แต่ละฟังก์ชันที่ซ้อนกันจะไม่ได้รับการดำเนินการหากไม่ได้รับอาร์กิวเมนต์ที่จำเป็น