TypeScript中如何清空数组指定元素的值？

你这种嵌套结构的数组处理其实不用太头疼，完全可以用JavaScript数组的内置方法来实现，不用写复杂的手动循环（本质还是遍历，但写法更简洁易读）。

实现思路 #

我们可以通过多层数组遍历方法，精准定位到需要清空的字段：

1. 先遍历外层dataList的每个对象，找到它的cocVariantElementValues数组
2. 遍历cocVariantElementValues里的每一项，先清空当前项的VariantValue
3. 再遍历当前项的cocElementLanguageDataCollection数组，逐个清空里面的TranslationValue

具体代码实现（修改原数组） #

如果允许直接修改原数组，用forEach就很方便：

// 遍历外层数组的每个元素
dataList.forEach(item => {
  // 处理每个元素的cocVariantElementValues数组
  item.cocVariantElementValues.forEach(variantItem => {
    // 清空当前变体的VariantValue
    variantItem.VariantValue = "";
    // 遍历语言数据集合，清空每个翻译值
    variantItem.cocElementLanguageDataCollection.forEach(langItem => {
      langItem.TranslationValue = "";
    });
  });
});

函数式写法（返回新数组，不修改原数据） #

要是你需要保留原数组，不想直接改动它，可以用map方法生成新数组：

const processedData = dataList.map(item => ({
  ...item,
  cocVariantElementValues: item.cocVariantElementValues.map(variantItem => ({
    ...variantItem,
    VariantValue: "",
    cocElementLanguageDataCollection: variantItem.cocElementLanguageDataCollection.map(langItem => ({
      ...langItem,
      TranslationValue: ""
    }))
  }))
}));

这种方式会返回一个处理后的新数组，原数据完全不受影响，适合需要保留原始数据的场景。

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