user944513
user944513

Reputation: 12729

What is an alternative way to update an array of objects?

I have a array of objects. I want to update an object using id.

I am able to do using the map function. Is there an alternative way or more efficient way to update the array?

Here is my code: https://stackblitz.com/edit/js-xgfwdw?file=index.js

var id = 3
var obj = {
  name: "test"
}
let arr = [{
  name: "dd",
  id: 1
}, {
  name: "dzxcd",
  id: 3
}, {
  name: "nav",
  id: 5
}, {
  name: "hhh",
  id: 4
}]

function getUpdated(obj, id) {
  var item = [...arr];
  const t = item.map((i) => {
    if(i.id==id){
      return {
        ...obj,
        id
      }
    }else {
      return i;
    }
  })
  return t
}

console.log(getUpdated(obj,id))

The expected output is correct but I want to achieve the same functionality using an alternative way.

[{
      name: "dd",
      id: 1
    }, {
      name: "test",
      id: 3
    }, {
      name: "nav",
      id: 5
    }, {
      name: "hhh",
      id: 4
    }]

Upvotes: 0

Views: 178

Answers (4)

J. Nicastro
J. Nicastro

Reputation: 254

var id = 3
var obj = {
  name: "test"
}
let arr = [{
  name: "dd",
  id: 1
}, {
  name: "dzxcd",
  id: 3
}, {
  name: "nav",
  id: 5
}, {
  name: "hhh",
  id: 4
}]

const result = arr.map((el) => el.id === id ? {...obj, id} : el)

console.log(result);

Upvotes: 2

eustatos
eustatos

Reputation: 704

@quirimmo suggested short code. I suggest fast code.

var id = 3;
var obj = {
  id:   3,
  name: "test"
}
let arr = [{
  name: "dd",
  id: 1
}, {
  name: "dzxcd",
  id: 3
}, {
  name: "nav",
  id: 5
}, {
  name: "hhh",
  id: 4
}]
var arr2 = [...arr];
console.time('⏱');
arr.splice(arr.findIndex(({id}) => id === obj.id), 0, obj);
console.timeEnd('⏱');
console.time('⏱');
for (let item of arr2) {
  if (item.id === id) {
    item.name = obj.name;
    break;
  }
}
console.timeEnd('⏱');
console.log(arr2);

Upvotes: 0

Prince Hernandez
Prince Hernandez

Reputation: 3721

you are in the correct way, basically the bad thing that you are doing is creating new arrays [...arr], when map already gives you a new array.

other things to use, may be the ternary operator and return directly the result of the map function

check here the improvedGetUpdate:

var id = 3;

var obj = {
  name: "test"
};

let arr = [{
  name: "dd",
  id: 1
}, {
  name: "dzxcd",
  id: 3
}, {
  name: "nav",
  id: 5
}, {
  name: "hhh",
  id: 4
}]

function getUpdated(obj, id) {
  var item = [...arr];
  const t = item.map((i) => {
    if (i.id == id) {
      return {
        ...obj,
        id
      }
    } else {
      return i;
    }
  })
  return t
}

improvedGetUpdate = (obj, id) => arr.map(i => {
  return i.id !== id ? i : {
    ...obj,
    id
  }
})

console.log(getUpdated(obj, id))
console.log(improvedGetUpdate(obj, id))

Upvotes: 4

quirimmo
quirimmo

Reputation: 9988

Use splice method which can be used to update the array too:

var obj = {
  id: 3,
  name: "test"
}
let arr = [{
  name: "dd",
  id: 1
}, {
  name: "dzxcd",
  id: 3
}, {
  name: "nav",
  id: 5
}, {
  name: "hhh",
  id: 4
}]

arr.splice(arr.findIndex(({id}) => id === obj.id), 0, obj);
console.log(arr);

Upvotes: 1

Related Questions