How to Search Object by ID and Remove It from JSON Array In JavaScript

Websolutionstuff | May-26-2021 | Categories : PHP jQuery

In this example we will see how to search object by id and remove it from json array in javascript. we need to add JavaScript function that takes in one such array as the first argument and id string in second argument for search and remove object from json array.

After that this function search for the object by that id, and if the array contains that object, we should remove object from json array in javascript.So, let's learn how to remove object from json array in javascript.

Example : 

const arr = [
   {id: "1", name: "car", type: "vehicle"},
   {id: "2", name: "bike", type: "vehicle"},
   {id: "3", name: "cycle", type: "vehicle"},
   {id: "4", name: "pink", type: "color"},
   {id: "5", name: "blue", type: "color"},
   {id: "6", name: "red", type: "color"},

];

const removeById = (arr, id) => {
   const requiredIndex = arr.findIndex(el => {
      return el.id === String(id);
   });
   if(requiredIndex === -1){
      return false;
   };
   return !!arr.splice(requiredIndex, 1);
};
removeById(arr, 5);
console.log(arr);

 

Output :

[
   {id: "1", name: "car", type: "vehicle"},
   {id: "2", name: "bike", type: "vehicle"},
   {id: "3", name: "cycle", type: "vehicle"},
   {id: "4", name: "pink", type: "color"},
   {id: "6", name: "red", type: "color"},

]

 

Recommended Post
Featured Post
Multiple Row Grouping Datatables jQuery
Multiple Row Grouping Datatabl...

In this article, we will see how to row group in datatable in jquery. Datatables doesn't have row grouping buil...

Read More

Jun-04-2022

How to Use an Image as a Link in React
How to Use an Image as a Link...

In the ever-evolving realm of web development, I've come to realize the significance of interactivity in shaping rem...

Read More

Aug-16-2023

Laravel 10 AJAX CRUD Operations Example
Laravel 10 AJAX CRUD Operation...

In this article, we will see the laravel 10 ajax crud operations example. Here, we will learn about ajax crud operation...

Read More

Feb-27-2023

Laravel 9 Livewire Sweetalert Example
Laravel 9 Livewire Sweetalert...

In this article, we will see the laravel 9 livewire sweet alert example. Here we will learn how to use sweetalert i...

Read More

Nov-25-2022