JavaScript使用map()添加嵌套对象时丢失原有键值对如何解决？

问题原因 #

你代码的问题在于map回调的匹配分支中，命中目标accountNo后直接返回了扩展后的vpainfo数组，将整个todo项对象覆盖为数组，因此丢失了accountNo、name等原有属性。

修正代码 #

只需要在命中目标项时，先保留todo的所有原有属性，再单独更新vpainfo字段即可：

var newdata = {"vpa":"first@bda","mccCode":"1111"};

var newObj = Object.assign({}, original, {
  todos: original.todos.map(todoInfo => 
    todoInfo.accountNo === "50190000" 
      ? {...todoInfo, vpainfo: [...todoInfo.vpainfo, newdata]} 
      : todoInfo
  )
});

最终效果 #

执行后得到的newObj会完整保留所有原有属性，同时目标todo项的vpainfo数组会新增你定义的newdata数据。

内容的提问来源于stack exchange，提问作者vishnu