เรียนรู้ความแตกต่างระหว่าง strict equality vs loose equality operators ใน JavaScript และทำไมมันถึงสำคัญ
ใน JavaScript คุณสามารถใช้ equality operators สองตัวเพื่อเปรียบเทียบค่า คือ loose equality operator == (double equals) และ strict equality operator === (triple equals) พวกมันดูเหมือนกันบนผิว แต่จริงๆ แล้วไม่ใช่ และการเข้าใจความแตกต่างสำคัญ เพราะถ้าไม่เข้าใจ อาจเจอ bugs
ลองรันโค้ดต่อไปนี้ในคอนโซล:
let a = 4 // number let b = "4" // string console.log(a == b) // output: true
ทำไม JavaScript บอกว่าข้างบนเป็น true เมื่อมันไม่จริง? เรามีค่าประเภท number เปรียบเทียบกับค่าประเภท string — พวกมันจะเท่ากันได้อย่างไร?
เพราะเมื่อคุณใช้ loose equality operator == มันจะแปลง operands ให้เป็น ประเภทเดียวกัน (ถ้ายังไม่ใช่) แล้วจึงเปรียบเทียบค่า
กระบวนการนี้เรียกว่า type coercion (เมื่อเปรียบเทียบสองค่า หลังจาก พยายามแปลงให้เป็นประเภทร่วมกัน)
ดังนั้นในตัวอย่างข้างบน ผลลัพธ์ true ถูกต้อง เพราะก่อนเปรียบเทียบ ประเภทค่าถูกแปลงให้เหมือนกัน
วอว นี่โง่แหละ!
ผมเห็นด้วย แต่มันเป็นเช่นนั้น สิ่งสำคัญคือคุณต้องทราบ "quirk" (ลักษณะพิเศษ) ที่ไม่สะดวกนี้ของ JavaScript
และนี่คือที่ที่ strict equality operator === เข้ามาช่วยชีวิต เพราะมัน ไม่ แปลงประเภทค่า มันเปรียบเทียบประเภทค่า อย่างเคร่งครัด แล้วจึงตรวจสอบความเท่ากัน:
let a = 4 let b = "4" console.log(a === b) // output: false
ตอนนี้เราได้ false เพราะแม้ตัวแปรทั้งสอง (a & b) จะมีค่า "4" แต่อ็อปแอนด์เป็นประเภทค่าต่างกัน (a เป็น number, b เป็น string)
ไม่เหมือน non-strict == operator strict === operator ให้ผลลัพธ์ที่คาดเดาได้ ซึ่งเป็นเหตุผลที่นักพัฒนาส่วนใหญ่แนะนำให้หลีกเลี่ยง ==
มีเหตุผลดีที่จะใช้ non-strict comparison operator ใน JavaScript ไหม?
น้อยมาก แต่ผมเชื่อว่าคุณหาตัวอย่างได้ กฎทั่วไป: ให้ใช้ strict === equality operator เป็นค่าเริ่มต้น เว้นแต่จะมี เหตุผลชัดเจน ที่จะใช้ non-strict == equality operator วิธีนี้คุณสามารถปฏิเสธ bugs ที่เกิดจากการใช้ equality operator ผิดได้ และนั่นเป็นประโยชน์เสมอ