Building Front-End Web Applications with Plain JavaScript/

...

/

Maps

Maps

Let's learn about maps in JS.

We'll cover the following...

What are maps?

A map’hash map’, ‘associative array’ or ‘dictionary’ provides a mapping from keys to their associated values. Traditionally, before the built-in Map object was added to JS (in ES6), maps were implemented in the form of plain JS objects. In these plain JS objects, the keys were string literals that could include blank spaces, as shown below:

Press + to interact
var myTranslation = { 
    "my house": "mein Haus", 
    "my boat": "mein Boot", 
    "my horse": "mein Pferd"
}
console.log(myTranslation)

Alternatively, a proper map can be constructed with the help of the Map constructor:

Press + to interact
var myTranslation = new Map([
    ["my house", "mein Haus"], 
    ["my boat", "mein Boot"], 
    ["my horse", "mein Pferd"]
])
console.log(myTranslation)

Operations on maps

...