ข้อกำหนดฉบับร่างของ ECMAScript 6 สร้างความพึงพอใจให้กับนักพัฒนา JavaScript ยุคใหม่ได้เป็นอย่างมาก เราได้พูดถึงคลาสคอลเล็กชันใหม่และfor..ofลูปการทำซ้ำในโพสต์ก่อนหน้า ในโพสต์นี้ เราจะพูดถึงสิ่งที่ใช้ร่วมกับfor..of ลูปได้ ซึ่งก็คือฟังก์ชัน Generator
มีเนื้อหาที่ยอดเยี่ยมมากมายที่อธิบายเหตุผลและวิธีใช้เครื่องกำเนิดไฟฟ้า กล่าวโดยย่อคือ Generator คือฟังก์ชันพิเศษที่สร้าง Iterator และ Iterator คือออบเจ็กต์ที่มีเมธอด next() ซึ่งสามารถเรียกใช้เพื่อรับค่า ภายในฟังก์ชัน Generator คีย์เวิร์ด yield จะระบุค่าสำหรับ next() การใช้ yield จะหยุดการเรียกใช้ฟังก์ชัน Generator ไว้ชั่วคราว โดยเก็บสถานะไว้จนกว่าจะมีการเรียกใช้ next() อีกครั้ง เมื่อถึงจุดนั้น โค้ดจะเริ่มทำงานอีกครั้งและทำงานต่อไปจนกว่าจะมีการ yield ค่าอื่น (หรือจนกว่าฟังก์ชัน Generator จะสิ้นสุดการทำงาน) ฟังก์ชัน Generator มี Use Case มาตรฐานหลายรายการ เช่น การใช้เพื่อวนซ้ำตัวเลขในลําดับ Fibonacci
เมื่อเข้าใจพื้นฐานแล้ว เรามาเจาะลึกตัวอย่าง JavaScript ที่ครอบคลุมข้อควรระวังบางประการหรือ "ส่วนที่ยุ่งยาก" ของการทำงานกับ Generator มีการอธิบายอย่างละเอียดตลอดทั้งโค้ด และคุณสามารถลองใช้โค้ดเวอร์ชันที่ใช้จริงก่อนที่จะอ่านได้
อะไรคือสิ่งที่ได้เรียนรู้จากโค้ด
ขั้นแรก การสร้างตัวสร้างจะส่งผลให้เกิดตัวดำเนินการซ้ำที่ไม่ซ้ำกันซึ่งมีสถานะของตัวเอง และคุณสามารถส่งพารามิเตอร์ไปยังตัวสร้างตัวสร้างที่สามารถควบคุมลักษณะการทํางานได้
ประการที่ 2 คุณสามารถส่งพารามิเตอร์เมื่อเรียกใช้เมธอด next() ของตัวดำเนินการวนซ้ำ และระบบจะกำหนดค่านั้นให้กับสิ่งที่อยู่ทางด้านซ้ายของคำสั่ง yield จากการเรียกใช้ตัวดำเนินการวนซ้ำก่อนหน้านี้ วิธีนี้เป็นวิธีที่ยอดเยี่ยมในการทำให้เอาต์พุตของเงื่อนไขเริ่มต้นมีรูปแบบแตกต่างกันไป ในที่นี้เราใช้เงื่อนไขเริ่มต้นเพื่อควบคุมว่าคำที่แสดงผลจะเป็นตัวพิมพ์ใหญ่หรือไม่ หากต้องการกำหนดค่าแรกสุดที่แสดง ให้ดำเนินการผ่านพารามิเตอร์ไปยังคอนสตรัคเตอร์ของ Generator
สุดท้าย Generator สามารถสร้างตัวดำเนินการซ้ำแบบจำกัดหรือไม่จำกัดก็ได้ หากคุณทํางานกับตัวดำเนินการวนซ้ำแบบไม่สิ้นสุด โปรดตรวจสอบว่าคุณมีเงื่อนไขสิ้นสุดบางประเภทตามค่า yielded เนื่องจากคุณอาจเขียนลูปแบบไม่สิ้นสุดโดยไม่ตั้งใจได้โดยง่าย โดยเฉพาะเมื่อใช้ for..of สำหรับการวนซ้ำ หากคุณทํางานกับตัวดำเนินการวนซ้ำแบบจํากัดผ่านการเรียกใช้ next() พร็อพเพอร์ตี้ .done ของออบเจ็กต์ที่แสดงผลจะบ่งบอกว่าการวนซ้ำเสร็จสมบูรณ์หรือไม่
เราหวังว่าตัวอย่างนี้และแหล่งข้อมูลอื่นๆ ที่มีอยู่ในเว็บจะช่วยให้คุณตื่นเต้นและได้ลองคิดถึงวิธีใช้เครื่องมือสร้างในโค้ดของคุณเอง Firefox เวอร์ชันที่เริ่มต้นด้วย 31 และ Chrome เวอร์ชันที่เริ่มต้นด้วย 39 รองรับเครื่องมือสร้างโดยค่าเริ่มต้น โปรเจ็กต์ Regenerator รองรับเครื่องมือสร้างสำหรับเบราว์เซอร์อื่นๆ และการใช้ Traceur ก็เป็นตัวเลือกหนึ่งเช่นกัน
ขอขอบคุณ Erik Arvidsson ที่ช่วยตรวจสอบบทความนี้