Understanding TypeScript Equality

In TypeScript, equality is a fundamental concept that plays a crucial role in various programming scenarios. Whether you are comparing variables, checking for object or array equality, or validating types, understanding how equality works is essential for writing robust and bug-free code. This blog post will delve into the different aspects of TypeScript equality, including its fundamental concepts, usage methods, common practices, and best practices.

Table of Contents#

  1. Fundamental Concepts of TypeScript Equality
  2. Usage Methods
  3. Common Practices
  4. Best Practices
  5. Conclusion
  6. References

1. Fundamental Concepts of TypeScript Equality#

1.1 Strict Equality (===)#

The strict equality operator (===) in TypeScript checks both the value and the type of the operands. It returns true if both the value and the type of the two operands are the same, and false otherwise.

let num1: number = 5;
let num2: number = 5;
let num3: string = '5';
 
console.log(num1 === num2); // true
console.log(num1 === num3); // false

1.2 Loose Equality (==)#

The loose equality operator (==) performs type coercion before comparing the values. It tries to convert the operands to a common type and then checks for equality.

let num4: number = 5;
let str4: string = '5';
 
console.log(num4 == str4); // true

1.3 Structural Equality#

In TypeScript, when dealing with objects and arrays, structural equality comes into play. Two objects or arrays are considered structurally equal if they have the same structure and the same values for their corresponding properties or elements. However, by default, JavaScript (and thus TypeScript) uses reference equality for objects and arrays.

let obj1 = { name: 'John' };
let obj2 = { name: 'John' };
let obj3 = obj1;
 
console.log(obj1 === obj2); // false
console.log(obj1 === obj3); // true

2. Usage Methods#

2.1 Comparing Primitive Types#

For primitive types like numbers, strings, booleans, etc., the strict equality operator (===) is usually the best choice as it provides a more reliable comparison.

let bool1: boolean = true;
let bool2: boolean = true;
 
console.log(bool1 === bool2); // true

2.2 Comparing Objects and Arrays#

To compare objects and arrays for structural equality, you need to write custom functions. One way is to recursively compare the properties or elements.

function isObject(value: any): boolean {
    return typeof value === 'object' && value!== null;
}
 
function deepEqual(obj1: any, obj2: any): boolean {
    if (obj1 === obj2) {
        return true;
    }
 
    if (!isObject(obj1) ||!isObject(obj2)) {
        return false;
    }
 
    const keys1 = Object.keys(obj1);
    const keys2 = Object.keys(obj2);
 
    if (keys1.length!== keys2.length) {
        return false;
    }
 
    for (let key of keys1) {
        if (!deepEqual(obj1[key], obj2[key])) {
            return false;
        }
    }
 
    return true;
}
 
let arr1 = [1, 2, 3];
let arr2 = [1, 2, 3];
 
console.log(deepEqual(arr1, arr2)); // true

3. Common Practices#

3.1 Using Strict Equality by Default#

It is a good practice to use the strict equality operator (===) by default, especially when comparing primitive types. This helps to avoid unexpected behavior due to type coercion.

let input: string | number = '10';
let num: number = 10;
 
if (input === num) {
    // This block will not execute
    console.log('Equal');
} else {
    console.log('Not equal');
}

3.2 Avoiding Loose Equality#

The loose equality operator (==) can lead to hard-to-debug issues because of type coercion. It is generally recommended to avoid using it unless you have a specific reason.

// Bad practice
if (input == num) {
    // This block may execute unexpectedly due to type coercion
    console.log('Equal');
}

3.3 Handling Null and Undefined#

When checking for null or undefined, it is common to use strict equality.

let value: string | null = null;
 
if (value === null) {
    console.log('Value is null');
}

4. Best Practices#

4.1 Use Libraries for Complex Equality Checks#

For more complex scenarios, especially when dealing with deeply nested objects and arrays, it is advisable to use existing libraries like lodash which provides a isEqual function for deep equality checks.

import _ from 'lodash';
 
let complexObj1 = { a: { b: [1, 2, 3] } };
let complexObj2 = { a: { b: [1, 2, 3] } };
 
console.log(_.isEqual(complexObj1, complexObj2)); // true

4.2 Write Unit Tests for Equality Checks#

When implementing custom equality functions, it is important to write unit tests to ensure that they work as expected. This helps to catch any potential bugs early in the development process.

function testDeepEqual() {
    let testObj1 = { x: 1 };
    let testObj2 = { x: 1 };
    let testObj3 = { x: 2 };
 
    console.assert(deepEqual(testObj1, testObj2), 'Test case 1 failed');
    console.assert(!deepEqual(testObj1, testObj3), 'Test case 2 failed');
    console.log('All tests passed');
}
 
testDeepEqual();

5. Conclusion#

In TypeScript, understanding equality is crucial for writing reliable and maintainable code. By using the strict equality operator (===) by default, avoiding loose equality, and handling null and undefined properly, you can prevent many common bugs. For complex equality checks, consider using existing libraries or writing custom functions with proper unit tests.

6. References#

2025-10