Map Keys

One of the defining features of a JavaScript Map (compared to a standard Object) is that a Map allows any data type to be used as a key. You are not restricted to just strings and numbers.

However, using complex objects (like Arrays or Objects) as keys introduces an important caveat regarding memory references.

The Reference Trap

If you try to set a Map value using a newly declared array, and then try to retrieve it using another newly declared array with the exact same contents, it will fail.

const map = new Map();

// We set the key using a new array instance
map.set(["hello", "there"], "general kenobi");

// We try to get the value using ANOTHER new array instance
console.log(map.get(["hello", "there"]));
// Output: undefined

Why does this happen? When comparing keys, the Map checks if the memory reference is exactly the same. Even though the two arrays contain identical strings, they are two completely separate objects in memory.

The Solution

To successfully use a complex type as a key, you must store it in a variable so that you pass the exact same memory reference when both setting and getting the value.

const map = new Map();
const greetingKey = ["hello", "there"];

// Set using the variable
map.set(greetingKey, "general kenobi");

// Get using the exact same variable reference
console.log(map.get(greetingKey));
// Output: "general kenobi"

Best Practice: While using objects as keys is a powerful feature, it is highly prone to bugs. In 99% of standard applications, it is much safer and clearer to stick to using simple strings or numbers as your Map keys.