有没有一种聪明的方法可以使用 JavaScript 的解构方法来修改对象内的数组？

取决于你想做什么。

如果你只是想用额外的元素克隆数组：

data.push({
    ...data_template,key: 1,data_array: [
        ...data_template.data_array,{ key: 4,data1: 4},],});

如果你想例如向 data_array 内的所有对象添加一个新字段：

const data_template = {
    key: 1,data_object: { data1: 1,data2: 2,data3: 3 },data_array: [ { key: 1,data1: 1 },{ key: 2,data1: 2 },{ key: 3,data1: 3 }]
}

console.log({
    ...data_template,data_array: data_template.data_array.map(d => ({ ...d,newField: 123 })),});

否则我无法立即想到您可以使用的任何其他解构“技巧”。

简短的回答

不，你不能。

JavaScript 解构只允许您覆盖对象的根级键，从而替换它们的值。

（您通常也不会这样做，以保持较低的认知复杂性。）

长答案

实际上有更好的方法可以做到这一点。

通常，当通过传播创建新对象变得更加复杂时，您只需为每个嵌套级别创建一个函数，并为它取一个比我做的更好的名称，与您的域相关联。

这正是函数的用途；拆分代码片段以降低复杂性。

简单示例

function createDataEntry(key,data) {
  return { key,data }
}

function createRecord(key,data) {
  return {
    key,dataObject: {
      data,},dataArray: [
      createDataEntry(key,data),// or simply:
      // { key,data },]
  }
}

let data = [];

data.push(createRecord(1,'foo'));
data.push(createRecord(2,'bar'));

console.log(JSON.Stringify(data,null,2));

生产

[
  {
    "key": 1,"dataObject": {
      "data": "foo"
    },"dataArray": [
      {
        "key": 1,"data": "foo"
      }
    ]
  },{
    "key": 2,"dataObject": {
      "data": "bar"
    },"dataArray": [
      {
        "key": 2,"data": "bar"
      }
    ]
  }
]

添加 + 编辑示例

如果您想添加或编辑该数据数组中的条目，您必须检查该条目是否已存在。

如果它已经存在，使用地图更新它。

如果不存在，使用array.push()。

function addOrupdateEntry(myObject,key,data) {
  let updated = false;

  const updatedObject = {
    ...myObject,items: myObject.items.map(member => {
      if (member.key === key) {
        updated = true;
        return { ...member,data };
      }

      return member;
    })
  };

  if (!updated) {
    updatedObject.items.push({ key,data });
  }

  return updatedObject;
}

let data = {
  items: []
};

data = addOrupdateEntry(data,1,"foo");
data = addOrupdateEntry(data,2,"bar");
data = addOrupdateEntry(data,"baz");

console.log(JSON.Stringify(data,2));

输出什么

{
  "items": [
    {
      "key": 1,"data": "foo"
    },{
      "key": 2,"data": "baz"
    }
  ]
}

请注意，改变现有对象很容易在 JavaScript 中产生不受欢迎的行为，因此会创建一个新对象并从函数中返回该对象。

这个概念叫做immutability。