如何将字符串数组映射生成指定结构的JavaScript对象

你最初的写法有两个核心问题：

1. 箭头函数直接返回对象字面量时，必须用圆括号把对象包裹，否则JS会将大括号识别为函数代码块的起始标记，触发语法错误。
2. Array.map 的返回值是数组，和你需要的单层对象结构不匹配，不需要先遍历生成数组再做合并，有更直接的实现方式。

方案1：现代JS最简洁写法（推荐） #

用 Object.fromEntries，该方法原生支持将键值对列表转换为普通对象，代码最简洁：

const monthesList = ['january', 'february', 'march', 'april', 'may']
const myState = Object.fromEntries(
  monthesList.map(month => [month, { selected: false, year: 2022 }])
)

方案2：沿用你已写的map逻辑做合并 #

如果你已经写好了生成单键对象数组的map逻辑，可以用Object.assign配合展开运算符合并所有对象，不需要额外遍历：

const monthesList = ['january', 'february', 'march', 'april', 'may']
const myState = Object.assign(
  {},
  ...monthesList.map(month => ({
    [month]: { selected: false, year: 2022 }
  }))
)

方案3：reduce遍历生成（兼容性最好） #

用Array.reduce直接遍历数组累加生成目标对象，不需要生成中间数组，兼容所有支持ES5的环境：

const monthesList = ['january', 'february', 'march', 'april', 'may']
const myState = monthesList.reduce((result, month) => {
  result[month] = { selected: false, year: 2022 }
  return result
}, {})

以上三种写法最终输出的对象结构完全匹配你的预期。

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