ทำความเข้าใจกับพารามิเตอร์เริ่มต้นใน Javascript

Javascript มาพร้อมกับการสนับสนุน พารามิเตอร์เริ่มต้น ดั้งเดิมด้วย ES2015 ตรงกันข้ามกับสิ่งที่เราคิด ไม่ใช่เพียงการแทนที่วากยสัมพันธ์สำหรับ||(ตัวดำเนินการเชิงตรรกะ OR)

Javascript ก่อนพารามิเตอร์เริ่มต้น

ก่อนที่จะมีการสนับสนุนพารามิเตอร์เริ่มต้น เราอาจเขียนดังนี้:

เพื่อให้เข้าใจโค้ดที่ตัดมาข้างต้น เราต้องคำนึงถึงสิ่งต่อไปนี้:

• ความจริง/เท็จ: ค่าในจาวาสคริปต์สามารถจัดหมวดหมู่ได้เป็น "ความจริง" หรือ "เท็จ" พูดง่ายๆ ก็คือ Javascript พยายามแปลงตัวแปรให้เป็นค่าบูลีน เพื่อหาเงื่อนไข (เช่น ถ้า สำหรับลูป)
• การประเมินการลัดวงจร:นิพจน์ที่เกี่ยวข้องกับ || จะถูกประมวลผลจากซ้ายไปขวา ขณะประมวลผลจากซ้ายไปขวา คอมไพเลอร์ฉลาดพอที่จะไม่ประมวลผลรายการที่เหลือหากพบค่า ความจริง (อ้างอิง: Short Circuiting)

กล่าวโดยสรุป นี่เป็นเพียงน้ำตาลวากยสัมพันธ์สำหรับ:

เหตุผลที่วิธีนี้แพร่หลายมากก็คือ คุณสามารถโยง || หลายอันเข้าด้วยกันได้ และปล่อยให้การลัดวงจรจัดการไป ลองนึกภาพการเขียนสิ่งเดียวกันด้วย คำสั่ง if

ตอนนี้หากตัวแปร evil ของคุณเป็นสตริงว่าง '' หรือค่า falsy ใดๆ ฟังก์ชันด้านบนจะถือว่าเป็น darth vader นี่อาจเป็นเรื่องปกติในกรณีส่วนใหญ่ แต่อาจทำให้เกิดข้อบกพร่องที่ไม่โต้ตอบอันน่าสะพรึงกลัวในแอปพลิเคชันที่เกี่ยวข้องมากขึ้น การค้นหาสแต็กโอเวอร์โฟลว์อย่างง่ายเพื่อแก้ไขปัญหานี้ส่งผลให้เกิดวิธีแก้ปัญหาที่ยอดเยี่ยมจำนวนมาก และ พารามิเตอร์เริ่มต้น ที่หรูหราที่สุด

Javascript หลังจากพารามิเตอร์เริ่มต้น

ให้เราใช้ตัวอย่าง filterEvil เดียวกันและดูว่ามันจะดูเป็นอย่างไรเมื่อใช้พารามิเตอร์เริ่มต้น

เมื่อมองแวบแรกจะดูเรียบร้อยและรัดกุม แต่อย่าปล่อยให้รูปลักษณ์หลอกลวงคุณ! มีอะไรมากมายเกิดขึ้นภายใต้ประทุน คงจะเป็นเรื่องไร้สาระที่จะถือว่าค่าเริ่มต้นจะเข้ามาเมื่อใดก็ตามที่ evil ว่างเปล่า

ให้เราดูรายละเอียดที่สำคัญบางประการ

1. Dความแตกต่างระหว่าง null และ unknown

Javascript มีสองคำตอบสำหรับปัญหา ไม่ ปัจจุบัน คือ null และ undefined ( null เป็นหัวข้อ "ข้อโต้แย้ง") ฉันทามติทั่วไปคือ null เป็นค่าที่ชัดเจนเพื่อบอกว่าไม่มีค่า ในตัวอย่างด้านล่าง เราพยายามส่ง null เป็นอาร์กิวเมนต์

ฟังก์ชัน filterEvil จะไม่แทนที่evil ด้วยค่าเริ่มต้นเมื่อระบุด้วย nullหรือค่าเท็จใดๆ

ฟังก์ชัน filterEvil จะทดแทนก็ต่อเมื่อ evil เป็น undefined เท่านั้น ตอนนี้คุณโชคดีแล้ว เนื่องจาก Javascript จะใช้ undefined โดยอัตโนมัติ หากคุณไม่ผ่านการโต้แย้งอย่างชัดเจน:

นี่คือสิ่งที่ควรคำนึงถึงเมื่อทำงานในโครงการที่ต้องอาศัย null เป็นอย่างมาก​​(แม้ว่าฉันจะกังวลมากเกี่ยวกับนักพัฒนาซอฟต์แวร์ที่ใช้null/undefinedสลับกันได้ )

2. ประเมินจากซ้ายไปขวา

พารามิเตอร์เริ่มต้นจะได้รับการประเมินจากซ้ายไปขวา นี่เป็นคุณสมบัติที่น่าสับสน แต่เป็นคุณสมบัติที่ทรงพลังมาก เรามาดูตัวอย่างกันดีกว่า

อย่างที่คุณเห็น เราสามารถใช้พารามิเตอร์ทางด้านซ้ายซ้ำเป็นพารามิเตอร์เริ่มต้นสำหรับบางอย่างทางด้านขวาได้ โปรดทราบว่า respect จะได้รับพารามิเตอร์ evil โดยใช้การตรวจสอบเริ่มต้น

3. การเรียกใช้ฟังก์ชัน

คุณยังสามารถเรียกใช้ฟังก์ชันและใช้ค่าที่ส่งคืนเป็นพารามิเตอร์เริ่มต้นได้ กล่าวโดยสรุป สิ่งนี้ช่วยให้คุณสามารถเรียกใช้ฟังก์ชันปกติและคำนวณพารามิเตอร์เริ่มต้นได้ทันที

4. ประเมิน ณ เวลาโทร

ตอนนี้ฟีเจอร์นี้เป็นสิ่งที่ทำให้ฉันสับสนมากที่สุด เรามาดูตัวอย่างกันดีกว่า

แต่ละครั้งที่คุณเรียกอาร์เรย์โดยไม่มีอาร์กิวเมนต์ อินสแตนซ์ใหม่ของอาร์เรย์ว่างจะถูกสร้างขึ้น

แต่ละครั้งที่คุณเรียก filterEvil โดยไม่มีอาร์กิวเมนต์ จะมีการสร้างอินสแตนซ์ใหม่ของอาร์เรย์ว่าง ตอนนี้นี่อาจกลายเป็นปัญหาได้หากคุณสนใจ "ตัวเลือก" และการบันทึกช่วยจำ พฤติกรรมนี้สามารถหลอกตรรกะที่ต้องพึ่งพาของคุณได้อย่างง่ายดายโดยคิดว่ามีบางอย่างเปลี่ยนไป (ฉันกำลังคุยกับคุณ React) ตัวอย่างเช่น หากคุณใช้การเลือกซ้ำในโปรเจ็กต์การโต้ตอบ ส่วนประกอบของคุณสามารถอัปเดตโดยไม่จำเป็นได้ เนื่องจากการตอบสนองจะแสดงผลอีกครั้งพร้อมกับอินสแตนซ์ใหม่ของอาร์เรย์ว่าง

เคล็ดลับเด็ดมีดังนี้:

• การตรวจสอบพารามิเตอร์ที่จำเป็น:คุณสามารถใช้พารามิเตอร์เริ่มต้นเพื่อ บังคับใช้พารามิเตอร์ที่จำเป็น ในตัวอย่างด้านล่าง เรากำลังบังคับใช้ ความชั่วร้าย เป็นอุปกรณ์ประกอบฉากที่จำเป็น

• พารามิเตอร์เริ่มต้นที่ทำลายโครงสร้าง:คุณยังสามารถใช้พารามิเตอร์เริ่มต้นในนิพจน์ที่ถูกทำลายได้

ฉันหวังว่าโพสต์นี้จะช่วยคุณในการทำความเข้าใจพารามิเตอร์เริ่มต้น

หากคุณพบว่าบทความนี้มีประโยชน์ ขอปรบมือให้ฉันบ้าง 👏

ติดต่อฉันทาง Twitter @kushan2020