为什么JS中在map操作内按示例给字典赋值会异常？正确写法是什么

你这段代码的问题出在对Array.prototype.map方法的用法和JS赋值执行顺序的理解偏差：

• map方法的设计目的是遍历原数组，返回一个和原数组长度相同、元素为每一次回调函数返回值的新数组，它不会返回你在回调中操作的目标对象。
• JS赋值语句会先执行右侧的表达式、拿到结果后再赋值给左侧变量。你这段代码里，map执行过程中确实给最初定义的空对象{}添加了i/c/l/e四个值为0的键，但map最终返回的是[0,0,0,0]这个新数组，你把这个数组重新赋值给了dict，原本存了正确键值对的对象因为没有引用被回收。此时dict是数组类型，访问i/c/l/e这类自定义属性自然全部返回undefined。
• 额外提一句：如果不需要生成新数组，单纯用map做遍历操作属于语义误用，会产生无意义的中间数组开销，不推荐这么写。

根据使用场景可以选以下两种主流写法，都没有逻辑问题：

写法1：for...of 遍历（性能最优、语义最直白） #

没有额外的中间数组生成，逻辑一目了然，适合所有场景：

const letters = ['i','c','l','e'];
const dict = {};
for (const char of letters) {
  dict[char] = 0;
}

写法2：Object.fromEntries 函数式写法（最简洁） #

专门用于将键值对列表转换为对象，语义贴合需求，代码简洁，现代浏览器、Node.js 12+ 全支持：

const letters = ['i','c','l','e'];
const dict = Object.fromEntries(letters.map(char => [char, 0]));

如果需要兼容极老旧的不支持Object.fromEntries的运行环境，可以用reduce实现同等效果：

const letters = ['i','c','l','e'];
const dict = letters.reduce((acc, char) => {
  acc[char] = 0;
  return acc;
}, {});

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