代码之家 › 专栏 › 技术社区 › user944513

更新对象数组的另一种方法是什么?

javascript

user944513 · 技术社区 · 7 年前

我有一组对象。我想更新一个 object 使用 id .

我可以用 map 功能。是否有其他方法或更有效的方法更新阵列?

这是我的代码: 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))

预期的输出是正确的,但我希望使用另一种方法实现相同的功能。

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

4 回复 | 直到 7 年前

Prince Hernandez 7 年前

你的方法是正确的,基本上你所做的坏事就是创建新的数组 [...arr] ,当map已经给您一个新数组时。

其他要使用的东西,可以是三元运算符,直接返回结果的 map 功能

在这里检查 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))

Eugenio Valeiras 7 年前

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);

quirimmo 7 年前

使用 splice 也可用于更新数组的方法:

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);

eustatos 7 年前

@Quirimmo建议使用短代码。我建议快速编码。

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);

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前