JavaScript如何向对象内已有的空数组分别推入对应预处理数据

现有主对象dataToMovie，其links属性下定义了mov、ser、rev、ext四个空数组。已完成arr、arr2两个待插入数据的格式转换，需要实现正确的数组赋值逻辑，同时支持后续给其余数组独立插入多组数据。

附初始代码：

const dataToMovie = {
  createMovie,
  links: {
    mov: [],
    ser: [],
    rev: [],
    ext: [],
  },
};

const dataToInsert1 = {
  'model-10389': 164703,
  'model-10388': 164704,
  'model-10387': 164705,
};

const dataToInsert2 = {
  'model-10389': [1656, 1234, 1245],
  'model-10384': [1656, 1234, 1245],
  'model-10383': [1656, 1234, 1245],
};

const arr = Object.entries(dataToInsert1).map((entry) => ({
  id: entry[0].substring(6, entry[0].length),
  value: entry[1],
}));

const arr2 = Object.entries(dataToInsert2).map(([key, value]) => ({
  modelId: key.substring(6),
  ids: value,
}));

注释中写的dataToMovie.links.mov[arr]、dataToMovie.links.ser[arr2]是无效写法：方括号在这里是数组/对象的键访问语法，会把arr、arr2转成字符串作为键名，不会把数组内容存入目标数组。

根据使用场景选择对应写法即可：

• 首次初始化赋值（目标数组为空时使用）
  直接将转换完成的数组赋值给对应属性即可，会把转换好的所有元素存入目标数组：

  // 存入mov数组
  dataToMovie.links.mov = arr;
  // 存入ser数组
  dataToMovie.links.ser = arr2;
  

• 多批次追加数据（不覆盖原有内容，适合后续多次插入场景）
  如果后续需要往对应数组追加新的数据集，用push配合展开运算符实现，不会覆盖之前已经存入的数据，四个数组的插入逻辑完全独立：

  // 追加新批次数据到mov数组，newMovData是后续新转换好的待插入数组
  dataToMovie.links.mov.push(...newMovData);
  
  // 追加新批次数据到ser数组
  dataToMovie.links.ser.push(...newSerData);
  
  // 后续给rev、ext数组插数据逻辑一致
  dataToMovie.links.rev.push(...newRevData);
  dataToMovie.links.ext.push(...newExtData);
  

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