How to add to a Map in JavaScript
Łukasz Holeczek
Follow Łukasz Holeczek on GitHub
Connect with Łukasz Holeczek on LinkedIn
Follow Łukasz Holeczek on X (Twitter)
Adding entries to a Map in JavaScript allows you to store key-value pairs dynamically, providing efficient data organization and retrieval capabilities for modern applications.
As the creator of CoreUI with 25 years of JavaScript experience since 2000, I’ve used Map operations extensively in data management systems and caching mechanisms for optimal performance.
The most efficient approach uses the set() method which adds or updates key-value pairs while maintaining insertion order and supporting any data type as keys.
This method provides chainable operations and automatic size management for flexible, high-performance data storage solutions.
Use the set() method to add key-value pairs to a Map with support for method chaining and any data type as keys.
const userMap = new Map()
// Adding single entries
userMap.set('john', { name: 'John Doe', age: 30 })
userMap.set(123, 'User ID 123')
userMap.set(true, 'Boolean key example')
// Method chaining for multiple additions
userMap
.set('admin', { role: 'administrator', permissions: ['read', 'write'] })
.set('guest', { role: 'guest', permissions: ['read'] })
.set(new Date(), 'Date as key')
// Adding with object keys
const userKey = { id: 'user-key' }
userMap.set(userKey, 'Object as key')
// Overwriting existing entries
userMap.set('john', { name: 'John Smith', age: 31 })
console.log(userMap.size) // Current number of entries
console.log(userMap.get('john')) // { name: 'John Smith', age: 31 }
The set() method adds key-value pairs to the Map and returns the Map instance, enabling method chaining for multiple additions. Maps preserve insertion order and allow any data type as keys, including objects, primitives, and functions. When adding an entry with an existing key, the set() method updates the value while maintaining the key’s position in the iteration order. The Map automatically manages its size and provides O(1) average performance for additions.
Best Practice Note:
This is the Map addition pattern we use in CoreUI caching systems for efficient data management and state storage. Leverage method chaining when adding multiple entries and use object keys when you need reference-based lookups for complex data structures.
