Hash Tables/Associative Arrays in JavaScript – How and Why?

JavaScript Hash Tables

JavaScript does not have a native object class called a “hash table” – but that doesn’t mean that the functionality of hash tables doesn’t exist in the language. Here’s how to use hash tables in JavaScript, with working example code.

What is a Hash Table?

Also known as hash maps, hash tables are a data structure which maps a list of keys to a list of corresponding values for each key. Any value in the table can be retrieved by accessing it through the associated key.

In the background, the hash table will use a hashing function to convert the key into an index which can be used to quickly looking up the associated value. This makes them a performant way of storing ephemeral data of any length.

Associative Arrays

One form of hash tables is associative arrays in PHP. If you are looking for the same functionality as offered by associative arrays, the below example should have you covered.

Can JavaScript Objects be Be Used as Hash Tables?

JavaScript Objects can be used as hash tables, but they lack some functionality. Take the following object for example:

var myObject = {
    "ACME Plumbing": "123 Fake Street",
    "FOOBAR Pool Services": "198 Pretend Place"
};

It is a simple object storing values from an address book as key/value pairs – the name of the business is the key, and the address for the business is the value.

This seems to fit the definition of a hash table (and technically, the Object class does store things in the same way) – key value pairs are stored and can be retrieved as object properties, but there are some drawbacks.

The JavaScript Object Class includes a bunch of other stuff for object manipulation. These properties and methods may conflict with data you plan to store in the table.

The Object class is also unaware of it’s own length, so it must be iterated over to find out how many entries there are.

Most importantly, you will encounter problems enumerating the values you have stored in the order they were stored – JavaScript objects do not always follow the insertion order of the items within them when being iterated.

Hash Table Best Practices – Using the Map Class

The Map object in JavaScript provides the full functionality of a hash table or hash map. It holds key value pairs, and remembers the specific order they were inserted into the table. Additionally, it will not let you insert values that conflict with it’s own methods or properties.

If you are looking to use hash table functionality in your code, the Map object is the easiest way to do it.

Example – Using Map to Create a Hash Table

The below example demonstrates how the Map object is used to achieve hash map functionality in JavaScript:

// Create a Map object
var myMap = new Map();

// Set some key/value pairs
myMap.set("ACME Plumbing", "123 Fake Street");
myMap.set("FOOBAR Pool Services", "198 Pretend Place");

// Retrieve a value by it's key
myMap.get("ACME Plumbing"); // "123 Fake Street"

// Map objects can be easily iterated over to get all values
for (let [key, value] of myMap) {
    console.log(key + ' :  ' + value);
}

 

SHARE:
nv-author-image

Brad Morton

I'm Brad, and I'm nearing 20 years of experience with Linux. I've worked in just about every IT role there is before taking the leap into software development. Currently, I'm building desktop and web-based solutions with NodeJS and PHP hosted on Linux infrastructure. Visit my blog or find me on Twitter to see what I'm up to.

Leave a Reply

Your email address will not be published.