如何使用JavaScript将普通对象转换为ES6 Map

有很多方法可以将普通对象转换为ES6 Map。最简单且最有效的方法是使用 Object.entries() 函数和 Map() 构造函数。相比之下，更加灵活的替代方法包括 Object.keys() 、 Array.prototype.forEach() 以及 for…in循环和Map() 函数方法。

ES6中的 Map 是一个键值对的集合。在这里，我们可以使用任何类型的对象作为键，包括字符串和数字这样的原始数据类型。映射中的值可以是任何类型的对象。

Map和对象的主要区别在于，在Map中，键可以具有任何数据类型，而在对象中，键总是被转换为字符串。

然而，与普通对象相比，Map具有一些优势，比如可迭代性和有保证的元素顺序。本文将介绍如何使用JavaScript将普通对象转换为ES6 Map。

方法1：使用Object.entries()和Map()

今天我们要学习的第一种方法是将普通对象转换为ES6 Map，由两步组成：

使用Object.entries()方法从对象获取键值对数组
然后将该数组传递给Map()构造函数。

示例

Object.entries()方法返回的数组中的每个数组表示对象中的一个键值对。下面是一个使用Object.entries()和Map()构造函数将普通对象转换为ES6 Map的示例：

let plainObject = { "one": 1, "two": 2, "three": 3 };
let map = new Map(Object.entries(plainObject));
console.log(map);

在这个示例中，使用Object.entries()函数将普通对象转换为键值对数组。然后将该数组传递给Map()函数，使用这些键值对生成一个新的Map对象。

Object.entries()方法只需要一行代码，并且在大多数现代浏览器中得到完全支持。然而，这种方法仅限于具有可枚举属性的对象，并且排除具有符号键的属性。

方法2：使用for…in循环和Map()构造函数

现在让我们来看另一种将普通对象转换为ES6 Map的方法。该方法包括以下步骤：

使用for…in循环遍历对象的属性
使用Map.set()方法将它们添加到一个新的Map对象中。

示例

下面是一个使用for…in循环和Map()构造函数将普通对象转换为ES6 Map的示例 –

let plainObject = { "one": 1, "two": 2, "three": 3 };
let map = new Map();
for (let key in plainObject) {
   map.set(key, plainObject[key]);
}
console.log(map);

在这种方法中，我们循环并将属性设置到地图中，这可能比第一种方法效率低。

然而，这种方法也适用于具有非可枚举属性和使用符号作为键的属性的对象。

方式3：使用Object.keys()和Array.prototype.forEach()

在这种方法中，我们按照以下步骤进行操作：

我们首先使用Object.keys(obj)来获取对象的键数组。
然后，我们使用Array.prototype.forEach()方法迭代这些键。
接下来，我们使用Map.set()方法将键值对添加到地图中。

示例

let plainObject = { "one": 1, "two": 2, "three": 3 };
let map = new Map();
Object.keys(plainObject).forEach(key => {
   map.set(key, plainObject[key]);
});
console.log(map);

请记住，for…in循环、Object.keys()和Array.prototype.forEach()方法将以不同的顺序返回属性，而不是按照原始对象中定义的顺序。属性将按照枚举顺序返回。

然而，Map()函数方法将按照它们被传递的顺序返回键值对。