Object.fromEntries
是 ECMAScript 2019 标准中新增的一个静态方法,用于将一个包含键值对的数组转化为一个对象。它的作用类似于 Object.entries(obj)
方法,只不过是 Object.entries(obj)
的反向操作。
具体来说,对于一个由键值对数组构成的数组,可以使用 Object.fromEntries
方法将其转化为一个对象。例如:
const arr = [['foo', 1], ['bar', 2]];
const obj = Object.fromEntries(arr);
console.log(obj); // { foo: 1, bar: 2 }
需要注意的是,如果提供的数组中有重复的键名,则后面的键值对会覆盖前面的键值对:
const arr = [['foo', 1], ['bar', 2], ['foo', 3]];
const obj = Object.fromEntries(arr);
console.log(obj); // { foo: 3, bar: 2 }
在实际中,Object.fromEntries
主要用于将 Map 类型(其中包含键值对的数据结构)转化为对象,例如:
const map = new Map([['foo', 1], ['bar', 2]]);
const obj = Object.fromEntries(map);
console.log(obj); // { foo: 1, bar: 2 }
总体来说,Object.fromEntries
是一个简洁、方便的方法,能够帮助我们快速转化数据结构。但它是在 ECMAScript 2019 版本才被引入的,并不是所有的浏览器都支持,如果需要在更老的浏览器中使用,需要进行兼容处理。
异常情况 以及 实现原理
const arr = [['foo', 1, 3], ['bar', 2]];
const obj = Object.fromEntries(arr); // 数组中的每个元素中的项数不一致,将会报错
如果数组中的每个元素中的项数不一致,使用Object.fromEntries
将报错。因为 Object.fromEntries
要求输入的数组中每个元素必须是一个只有两个元素的子数组,第一个元素表示键名,第二个元素表示键值。如果某个子数组内的元素个数不为 2,那么将无法从其中构造出一个有效的键值对,从而无法转成对象。
如果要将这个数组转换成对象,可以写一个遍历数组的函数,然后使用 reduce
方法逐个添加键值对到对象中,例如:
const arr = [['foo', 1, 3], ['bar', 2]];
const obj = arr.reduce((acc, [key, ...values]) => {
acc[key] = values.length > 1 ? values : values[0];
return acc;
}, {});
console.log(obj); // { foo: [1, 3], bar: 2 }
在该方法中,遍历数组中的每个元素,使用数组解构语法获取子数组的第一个元素作为键名 key
,剩下的元素作为值数组 values
。根据 values
数组的长度,决定将值数组作为一个整体,或者只取第一个元素作为值,最后使用 reduce
方法将每个键值对逐个添加到对象中,最终得到一个转换后的对象。这里将键值对 { 'foo': [1, 3], 'bar': 2 }
保存在变量 obj
中。