为何JavaScript数组输出出现undefined而非正确数值？

原始对象代码 #

const users = { user1: 18273, user2: 92833, user3: 90315 }

处理代码 #

const usersArray = Object.entries(users).map((keys, value)=> {return keys[0] + ' ' + value[1]});
console.log(usersArray);

实际输出 #

['user1 undefined', 'user2 undefined', 'user3 undefined']

期望输出 #

[ [ 'user1', 18273 ], [ 'user2', 92833 ], [ 'user3', 90315 ] ]

原因分析 #

1. Object.entries的返回结构：Object.entries(users)本身就会直接返回你期望的键值对数组：[['user1',18273], ['user2',92833], ['user3',90315]]，额外调用map属于多余操作。
2. map回调的参数顺序错误：map方法的回调函数参数顺序是「当前元素、索引、原数组」，你写的(keys, value)里：
   • keys实际是当前遍历到的键值对数组（比如第一个元素是['user1',18273]）
   • value实际是当前元素的索引（0、1、2），数字类型没有[1]属性，所以value[1]结果为undefined。

正确实现 #

情况1：直接获取键值对数组 #

不需要map，直接赋值即可：

const usersArray = Object.entries(users);
console.log(usersArray);
// 输出：[ [ 'user1', 18273 ], [ 'user2', 92833 ], [ 'user3', 90315 ] ]

情况2：如果想拼接键值为字符串 #

用解构赋值明确获取键和值：

const usersArray = Object.entries(users).map(([key, val]) => `${key} ${val}`);
console.log(usersArray);
// 输出：['user1 18273', 'user2 92833', 'user3 90315']

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