ความแตกต่างระหว่าง == และ === ใน JavaScript (Loose vs Strict Equality)

== (Loose Equality / Abstract Equality) vs === (Strict Equality)

JavaScript มีตัวเปรียบเทียบความเท่ากัน 2 แบบ ที่ทำงานต่างกันอย่างสิ้นเชิง

== (Double Equals) - Loose Equality

• ทำ Type Coercion (การแปลงชนิดข้อมูลอัตโนมัติ) ก่อนเปรียบเทียบ
• แปลง Operand ให้เป็นชนิดเดียวกัน แล้วค่อยเปรียบเทียบค่า
• ซับซ้อนและสร้าง Bug ได้ง่าย ไม่แนะนำให้ใช้

ตัวอย่าง ==

4 == 4        // true
'4' == 4      // true  (String '4' → Number 4)
4 == '4'      // true
0 == false    // true  (false → 0)
'' == false   // true  ('' → 0, false → 0)
null == undefined  // true (Special Rule)
'0' == []     // true  ([] → '' → 0, '0' → 0)
[] == ![]     // true  (WTF JavaScript!)

=== (Triple Equals) - Strict Equality

• ไม่ทำ Type Coercion เปรียบเทียบ ทั้งชนิดข้อมูล (Type) และค่า (Value)
• คืนค่า true ก็ต่อเมื่อ Type และ Value เท่ากันทุกประการ
• พฤติกรรมที่คาดเดาได้ แนะนำให้ใช้เสมอ

ตัวอย่าง ===

4 === 4       // true
4 === '4'     // false (Number !== String)
'4' === '4'   // true
0 === false   // false (Number !== Boolean)
null === undefined // false
[] === []     // false (Object Reference ต่างกัน)
{} === {}     // false

ตารางเปรียบเทียบความแตกต่าง

Object Comparison (Reference Equality)

ทั้ง == และ === สำหรับ Object/Array/Function เปรียบเทียบ Reference (Memory Address) ไม่ใช่ Value

var a = {x: 1};
var b = {x: 1};
var c = a;

a == b   // false
a === b  // false
a == c   // true
a === c  // true

แนวทางปฏิบัติที่ดีที่สุด (Best Practice)

1. ใช้ === เสมอ (Strict Equality) - ป้องกัน Bug จาก Type Coercion ที่คาดเดาไม่ได้
2. หากต้องการเปรียบเทียบค่าโดยไม่สนใจ Type → แปลง Type เองก่อน: Number(val) === 4 หรือ String(val) === '4'
3. ESLint Rule: eqeqeq: ["error", "always"] บังคับใช้ ===
4. ตัวข้อยกเว้น: val == null ตรวจสอบ null และ undefined พร้อมกัน (เป็น Idiom ที่ยอมรับได้) เทียบเท่า val === null || val === undefined

Object.is() (ES2015) - Strict Equality ปรับปรุง版

Object.is(NaN, NaN)        // true (=== คืน false)
Object.is(0, -0)           // false (=== คืน true)
Object.is({}, {})          // false

ใช้เมื่อต้องการแยก 0 และ -0 หรือเปรียบเทียบ NaN

สรุป

=== (Strict Equality) เปรียบเทียบ Type และ Value โดยไม่แปลงชนิด แนะนำใช้เสมอ
== (Loose Equality) แปลงชนิดก่อนเปรียบเทียบ สร้างความสับสนและ Bug หลีกเลี่ยง
ตัวข้อยกเว้น: value == null สำหรับเช็ค null/undefined พร้อมกัน

Unsigned Right Shift Operator (>>>) ใน JavaScript คืออะไร? ตัวอย่างการใช้งาน

วิธีโหลดหน้าเว็บหลัง 5 วินาทีด้วย JavaScript (setTimeout + window.open)