JavaScript中如何像解构普通对象一样解构Map？

Great question! Unfortunately, JavaScript doesn't have native syntax for destructuring Maps directly like it does for plain objects. But don't worry—there are several workarounds to get that same convenient "extract multiple values at once" behavior. Let's break them down:

1. Convert the Map to a plain object first #

The easiest way is to turn your Map into a regular object using Object.fromEntries(), then use standard object destructuring on the result. This works perfectly when your Map keys are strings or Symbols (since object keys are limited to those types anyway).

Example:

let m = new Map().set('b', 3).set('c', 4).set('d', 6);

// Convert Map to object, then destructure
const { c, d } = Object.fromEntries(m);

console.log(c, d); // Output: 4 6

Caveat for non-string keys #

If your Map uses non-string keys (like numbers or objects), Object.fromEntries() will convert them to strings. You'll need to use aliases in your destructuring to handle this:

let m = new Map().set(1, 'one').set(2, 'two');

// Use string literals for the keys, then alias to variable names
const { '1': one, '2': two } = Object.fromEntries(m);

console.log(one, two); // Output: 'one' 'two'

2. Write a custom utility function #

If converting to an object doesn't fit your use case (e.g., you need to keep non-string keys intact), you can create a simple function to extract multiple values from the Map and return them in a format you can destructure.

Return an array (for array destructuring) #

function getFromMap(map, ...keys) {
  return keys.map(key => map.get(key));
}

let m = new Map().set('b', 3).set('c', 4).set('d', 6);

// Extract values in the order of the keys you pass
const [c, d] = getFromMap(m, 'c', 'd');

console.log(c, d); // Output: 4 6

Return an object (for object destructuring) #

If you prefer to use named variables without worrying about order, have the function return an object:

function getFromMapAsObj(map, ...keys) {
  return keys.reduce((result, key) => {
    result[key] = map.get(key);
    return result;
  }, {});
}

let m = new Map().set('b', 3).set('c', 4).set('d', 6);

const { c, d } = getFromMapAsObj(m, 'c', 'd');

console.log(c, d); // Output: 4 6

3. Use the Map's iterator (less flexible) #

Maps are iterable, so you can spread them into an array of [key, value] pairs and destructure that array. However, this relies on knowing the order of entries in your Map, which makes it less flexible for extracting arbitrary keys:

let m = new Map().set('b', 3).set('c', 4).set('d', 6);

// Spread the Map into an array, then destructure the relevant pairs
const [, [, c], [, d]] = [...m];

console.log(c, d); // Output: 4 6

Wrap-up #

While there's no native Map destructuring syntax yet, these workarounds let you replicate the convenience of object destructuring for Maps. Pick the method that best fits your key types and use case!

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