如何更新数组中的 JSON 对象？

Question

我有一个对象数组，想要更新其中的一些内容。我认为只需要通过遍历对象，找到所需的匹配项并进行更新即可。

data = data.map(obj => {
   return this.state.objToFind === obj.title;   
   }).map(obj, idx) => {
      console.log("found " + obj.title);     // reads found + undefined?
      obj.menu = this.state.menu;
      obj.title = this.state.title;
      obj.content = this.state.content;
 });

然而，这并没有起作用。我找到了对象，但是obj.anything是未定义的。我的console.log读取“找到了未定义”。

- user3622460

---

那里没有JSON对象：了解JSON的真正含义 - user2864740

我不知道你在说什么。数据是JSON对象的数组。 - user3622460

如果您不理解，请考虑阅读提供的资源。 - user2864740

你从函数中返回了一个布尔值，所以第二个 map() 将处理一个布尔值的数组，而不是对象。 - Barmar

@user3622460，你写return this.state.objToFind === obj.title;的目的是什么？因为这个条件会返回一个布尔数组？ - Prakash Sharma

我正在尝试找到正确的对象进行编辑。我想我可以使用data.filter - 找到对象，删除对象并将新对象推送到数组中。我只是认为我可以直接编辑对象。 - user3622460

Answer 1

data.map(obj => {
  return this.state.objToFind === obj.title;   
})

第一个map函数将返回一个由true和false组成的数组， 第二个map函数将遍历这些值，console.log("found " + obj.title) 将会连续输出"found + undefined"。

或许你想要像这样的效果。

data = data.filter(obj => {
   return this.state.objToFind === obj.title;   
   }).map(obj, idx) => {
      console.log("found " + obj.title);
      obj.menu = this.state.menu;
      obj.title = this.state.title;
      obj.content = this.state.content;
      return obj;
 });

- Karim

Answer 2

更为简单的方法

您可以使用 "some" 运算符。(它通过对数组进行迭代来工作，当您返回 true 时它会跳出循环)

data.some(function(obj){
   if (obj.title ==== 'some value'){
        //change the value here
        obj.menu = 'new menu';
        obj.title = 'new title';
        return true;    //breaks out of he loop
   }
});

- Manish Poduval

---

我会检查一下 - 这看起来就是我想做的。我宁愿不从数据数组中推入和弹出。 - user3622460

Answer 3

将它改为其他变量而不是 obj，因为它指的是父 obj，它是一个数组。在第一个函数中也使用 array.filter，它将返回一个数组。请保留 HTML 标签。

data = data.filter(obj => {
   return this.state.objToFind === obj.title;   
   }).map(newval, idx) => {
      console.log("found " + newval.title);     
      newval.menu = this.state.menu;
      newval.title = this.state.title;
      newval.content = this.state.content;
 });

- Sajeetharan

---

这是一个想法，但是你的 data 变量将只是未定义的数组，因为你的第二个 map 函数没有返回任何内容。 - James

如果我使用newVal，这会实际更新JSON对象到这些新值吗？我认为obj.menu将是我想要编辑的实际对象。 - user3622460

过滤器是我最初使用的，但它并没有给我带来任何好处。这将返回一个对象，然后我必须删除旧对象并将新对象推入数组中。 - user3622460

Answer 4

Map用于返回一个已变异的对象。在使用map时，您需要返回一些内容，例如修改后的对象。

但是，您有一些错误。 1）您正在使用.map搜索某些内容（这不是map的正确用法）；尝试使用.filter或.find 2）在使用map更新对象之后（在第二个函数中），您需要将其返回。 情况1：

data = data.filter(obj => {
       return this.state.objToFind === obj.title;   
   }).map(foundObj, idx) => {
          console.log("found " + foundObj.title);
          foundObj.menu = this.state.menu;
          foundObj.title = this.state.title;
          foundObj.content = this.state.content;
      return foundObj; //updated obj
 });

案例2：

    var foundObj = data.find(obj => {
     return this.state.objToFind === obj.title;   
   });
    console.log("found " + foundObjs.title);
    foundObjs.menu = this.state.menu;
    foundObjs.title = this.state.title;
    foundObjs.content = this.state.content;

- Axar

---

第二个 map() 应该改用 forEach()。 - Barmar

Answer 5

如果您只想处理使this.state.objToFind === obj.title为真的元素，则需要使用Array.filter，例如：

data = data.filter(obj => {
   return this.state.objToFind === obj.title;   
   }).map(obj, idx) => {
      console.log("found " + obj.title);     // reads found + undefined?
     ...
 });

- Prakash Sharma