Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Object.is() so sánh bằng trong JavaScript

Object.is() - So sánh chính xác hơn === (ES6)

Object.is() so sánh 2 giá trị với thuật toán **SameValue** - chính xác hơn cả == (loose equality) và === (strict equality).

Bảng so sánh 3 loại equality

Case == === Object.is()
NaN === NaNtruefalsetrue ✓
+0 === -0truetruefalse ✓
Object.is(NaN, NaN)--true
Object.is(+0, -0)--false
Object khác nhau, cùng giá trịtruefalsefalse
Cùng tham chiếu objecttruetruetrue

Ví dụ minh họa

<!DOCTYPE html>
<html lang="vi">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Object.is()</title>
    <style>
        body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; }
        .result { font-size: 18px; font-weight: 500; color: blueviolet; font-family: monospace; }
        button { padding: 8px 16px; cursor: pointer; }
    </style>
</head>
<body>
    <h1>Object.is() - So sánh bằng chính xác</h1>
    <div class="result"></div>
    <button class="btn-demo">SO SÁNH</button>
    <h3>Nhấn nút để so sánh object với Object.is()</h3>

    <script>
        const resEle = document.querySelector(".result");
        const btn = document.querySelector(".btn-demo");

        const obj = { a: 11, b: 22 };
        const obj1 = { a: 11, b: 22 }; // Object khác, cùng giá trị
        const obj2 = obj;               // Cùng tham chiếu

        btn.addEventListener("click", () => {
            resEle.innerHTML = "";
            
            // So sánh obj vs obj1 (khác ref, cùng giá trị)
            resEle.innerHTML += "Object.is(obj, obj1): " + Object.is(obj, obj1) + "<br>";
            resEle.innerHTML += "obj === obj1: " + (obj === obj1) + "<br>";
            resEle.innerHTML += "JSON.stringify(obj) === JSON.stringify(obj1): " + (JSON.stringify(obj) === JSON.stringify(obj1)) + "<br><br>";
            
            // So sánh obj vs obj2 (cùng ref)
            resEle.innerHTML += "Object.is(obj, obj2): " + Object.is(obj, obj2) + "<br>";
            resEle.innerHTML += "obj === obj2: " + (obj === obj2) + "<br><br>";
            
            // Các case đặc biệt
            resEle.innerHTML += "=== Đặc biệt ===" + "<br>";
            resEle.innerHTML += "Object.is(NaN, NaN): " + Object.is(NaN, NaN) + "<br>";
            resEle.innerHTML += "NaN === NaN: " + (NaN === NaN) + "<br>";
            resEle.innerHTML += "Object.is(+0, -0): " + Object.is(+0, -0) + "<br>";
            resEle.innerHTML += "+0 === -0: " + (+0 === -0) + "<br>";
        });
    </script>
</body>
</html>

Khi nào dùng Object.is()?

  • Cần phân biệt +0 và -0 (hiếm, nhưng quan trọng trong một số thuật toán toán học).
  • Cần kiểm tra NaN (thay cho Number.isNaN() hoặc x !== x).
  • Viết thư viện/framework cần so sánh chính xác tuyệt đối.

Polyfill đơn giản

if (!Object.is) {
    Object.is = function(x, y) {
        // SameValue algorithm
        if (x === y) {
            return x !== 0 || 1/x === 1/y; // +0 !== -0
        }
        return x !== x && y !== y; // NaN check
    };
}

Lưu ý về Object

Object.is() so sánh **tham chiếu** cho object, không so sánh sâu (deep equality). Để so sánh nội dung object, dùng JSON.stringify() (đơn giản) hoặc thư viện như Lodash _.isEqual().