迹忆客 专注技术分享

JavaScript 中合并Map对象：

1. 使用扩展语法 ... 将两个或多个 Map 对象的值解包到一个数组中。
2. 将数组传递给 Map() 构造函数。
3. 新的 Map 将包含来自所有提供的 Map 对象的键值对。

const map1 = new Map([['name', 'fql jiyik']]);
const map2 = new Map([['age', 30]]);

const map3 = new Map([...map1, ...map2]);

// 👇️ Map(2) { 'name' => 'fql jiyik', 'age' => 30 }
console.log(map3);

我们使用扩展语法 ... 将 2 个 Map 对象的键值对解包到一个数组中。

const map1 = new Map([['name', 'fql jiyik']]);
const map2 = new Map([['age', 30]]);

// 👇️ [ [ 'name', 'fql jiyik' ], [ 'age', 30 ] ]
console.log([...map1, ...map2]);

该数组包含由键值对组成的嵌套数组。

最后一步是将数组传递给 Map() 构造函数。

有了这些值，示例如下所示。

const map3 = new Map([
  ['name', 'fql jiyik'],
  ['age', 30],
]);

// 👇️ Map(2) { 'name' => 'fql jiyik', 'age' => 30 }
console.log(map3);

可迭代的 Map() 构造函数必须由键值对组成，例如 二维数组或另一个 Map 对象。

可以根据需要对尽可能多的 Map 对象重复此过程。

const map1 = new Map([['name', 'fql jiyik']]);
const map2 = new Map([['age', 30]]);
const map3 = new Map([['country', 'Chile']]);

const map4 = new Map([...map1, ...map2, ...map3]);
// 👇️ Map(3) { 'name' => 'fql jiyik', 'age' => 30, 'country' => 'Chile' }
console.log(map4);

请注意 ，键的插入顺序被保留。 如果我们需要重新排序键值对，只需切换使用展开语法 ... 的顺序即可。

const map1 = new Map([['name', 'fql jiyik']]);
const map2 = new Map([['age', 30]]);

const map3 = new Map([...map2, ...map1]);

// 👇️ Map(2) { 'age' => 30, 'name' => 'fql jiyik' }
console.log(map3);

在示例中，我们在 map1 的元素之前解压了 map2 的元素。

使用 for...of 循环合并地图对象

我们还可以使用嵌套的 for...of 循环来合并 Map 对象。

function mergeMapObjects(...maps) {
  const map = new Map();

  for (const m of maps) {
    for (const item of m) {
      map.set(...item);
    }
  }

  return map;
}

const map1 = new Map([['name', 'fql jiyik']]);
const map2 = new Map([['age', 30]]);

const map3 = mergeMapObjects(map1, map2);

// 👇️ Map(2) { 'name' => 'fql jiyik', 'age' => 30 }
console.log(map3);

for...of 语句用于循环遍历可迭代对象，如数组、字符串、Map、Set 和 NodeList 对象和生成器。

该函数将一个或多个 Map 对象作为参数，并使用 for...of 循环遍历它们。

外部 for...of 循环遍历 Map 对象，内部 for...of 循环遍历每个 Map 的键值对。

在每次迭代中，我们使用 Map.set 方法将当前键值对添加到新的 Map 对象中。