React.js中如何将数组数据批量插入JSON对象

你原代码的问题出在这几个地方：

• map是数组专属方法，你调用的displayNameLocalization是个空对象，根本不存在map方法，运行会直接报错
• 你每次循环都给data.displayName赋值，新值会覆盖旧值，自然只能拿到最后一条数据
• 你要生成的是displayNameLocalization下的多语言键值对，不是往data下加displayName属性

首先你需要确定每个语言对应的翻译值，假设你已经有对应的翻译映射，直接遍历languages数组往目标对象里加属性就行：

const data = {
  displayNameLocalization : {},
};

// 多语言翻译映射，实际场景你可以根据自己的需求替换成接口返回或者其他数据源
const translationMap = {
  en: 'Fruits',
  ta: 'பழங்கள்', // 泰米尔语“水果”的翻译示例
  fr: 'des fruits'
}

const languages = ['En', 'Ta', 'Fr'];

function testFinalValue() {
  // 遍历languages数组
  languages.forEach(lang => {
    // 把语言名转成小写作为键，取对应的翻译作为值
    const lowerLang = lang.toLowerCase()
    data.displayNameLocalization[lowerLang] = translationMap[lowerLang]
  })
}

// 调用函数
testFinalValue()
console.log(data)

运行后得到的data结构就完全符合你要的格式：

{
  displayNameLocalization: {
    en: 'Fruits',
    ta: 'பழங்கள்',
    fr: 'des fruits'
  }
}

• 如果不需要做额外的返回值处理，遍历数组做赋值操作优先用forEach，map一般是需要返回一个新数组的时候才用
• 给对象动态加属性要用对象[键名]的写法，不能用.写法，不然会把变量名当成固定的属性名

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