Remove a Specific Object from an Array in JavaScript

In javascript, the array stores multiple data types of values into it and you may need to remove a specific object using its ID, index, or a unique key value. In this tutorial, we will show you how to remove a specific object from an array in JavaScript.

How to Remove a Specific Object from an Array in JavaScript by ID, Index, or Key

Here are some approaches to remove a specific object from an array in javascript using its ID, index, or a unique key value:

• Approach 1: Removing by ID using filter()
• Approach 2: Removing by Index using splice()
• Approach 3: Removing by Key using findIndex() and splice()

Approach 1: Removing by ID using filter()

The filter() method helps us to create a new array by removing the object matching the specified ID.

Here is an example function of removing objects from the array by id:

function removeObjectById(arr, objectId) {
    // Create a new array without the object with the specified ID
    return arr.filter(obj => obj.id !== objectId);
}

// Example usage:
let myArray = [
    { id: 1, name: 'John' },
    { id: 2, name: 'Alice' },
    { id: 3, name: 'Bob' }
];

let objectIdToRemove = 2;
let newArray = removeObjectById(myArray, objectIdToRemove);
console.log("Array after removing the object with ID 2:", newArray);

Approach 2: Removing by Index using splice()

The splice() method helps us to remove an object based on the given index in the array.

Here is an example function of removing objects from the array by index:

function removeObjectByIndex(arr, index) {
    // Check if the index is valid
    if (index >= 0 && index < arr.length) {
        // Remove the object using splice
        arr.splice(index, 1);
    }

    return arr;
}

// Example usage:
let myArray = [
    { id: 1, name: 'John' },
    { id: 2, name: 'Alice' },
    { id: 3, name: 'Bob' }
];

let indexToRemove = 1;
removeObjectByIndex(myArray, indexToRemove);
console.log("Array after removing the object at index 1:", myArray);

Approach 3: Removing by Key using findIndex() and splice()

If the object has a unique key, in that case, you can use array findIndex() to find the index of the object and then remove it with splice(). As it was removed in Approach 2.

Here is an example function of removing objects from the array by key value:

function removeObjectByKey(arr, key, value) {
    // Find the index of the object with the specified key and value
    let index = arr.findIndex(obj => obj[key] === value);

    // Check if the object exists in the array
    if (index !== -1) {
        // Remove the object using splice
        arr.splice(index, 1);
    }

    return arr;
}

// Example usage:
let myArray = [
    { id: 1, name: 'John' },
    { id: 2, name: 'Alice' },
    { id: 3, name: 'Bob' }
];

let keyToRemove = 'name';
let valueToRemove = 'Alice';
removeObjectByKey(myArray, keyToRemove, valueToRemove);
console.log("Array after removing the object with name 'Alice':", myArray);

Conclusion

That’s it; you have learned 3 ways to remove the object by its ID, index, and key-value pair from an array in javascript.

Recommended Tutorials