Introduction
After learning how to create Maps, use their methods, and iterate through them, the next step is to understand how Maps are used in real-world applications.
A Map is ideal for storing and managing dynamic key-value data. Unlike plain objects, Maps allow keys of any data type, preserve insertion order, and provide efficient methods for adding, retrieving, updating, and deleting data.
Maps are widely used in web development, Node.js applications, API testing, and automation frameworks such as Selenium, Playwright, and Cypress.
For automation engineers, Maps are commonly used for storing browser configurations, environment variables, API request headers, test data, execution settings, and lookup tables.
Why Use Maps in Real Projects?
Maps are useful because they:
Store key-value pairs efficiently.
Accept keys of any data type.
Preserve insertion order.
Provide fast key lookups.
Support easy iteration.
Offer built-in methods for data management.
Example 1: Student Information
Store student details using a Map.
let student = new Map();
student.set("name", "John");
student.set("age", 22);
student.set("course", "JavaScript");
console.log(student);
Output
Map(3) {
'name' => 'John',
'age' => 22,
'course' => 'JavaScript'
}
Example 2: Product Details
Retrieve product information.
let product = new Map([
["name", "Laptop"],
["price", 65000],
["brand", "Dell"]
]);
console.log(product.get("price"));
Output
65000
Example 3: Checking User Access
Verify whether a user role exists.
let users = new Map();
users.set("admin", true);
users.set("tester", true);
console.log(users.has("admin"));
console.log(users.has("guest"));
Output
true
false
Example 4: Updating Existing Data
Update the value of an existing key.
let employee = new Map();
employee.set("salary", 50000);
employee.set("salary", 65000);
console.log(employee.get("salary"));
Output
65000
Example 5: Counting Entries
Determine how many entries exist in a Map.
let languages = new Map([
["JS", "JavaScript"],
["PY", "Python"],
["JAVA", "Java"]
]);
console.log(languages.size);
Output
3
Example 6: Displaying All Entries
Iterate through every key-value pair.
let countries = new Map([
["IN", "India"],
["US", "United States"],
["UK", "United Kingdom"]
]);
for (let [code, country] of countries) {
console.log(code + " : " + country);
}
Output
IN : India
US : United States
UK : United Kingdom
Example 7: Removing an Entry
Delete a specific key-value pair.
let cities = new Map([
["IN", "Delhi"],
["US", "New York"]
]);
cities.delete("US");
console.log(cities);
Output
Map(1) {
'IN' => 'Delhi'
}
Example 8: Clearing the Map
Remove every entry.
let skills = new Map([
["frontend", "JavaScript"],
["backend", "Node.js"]
]);
skills.clear();
console.log(skills);
Output
Map(0) {}
Real-World Example
Suppose an online store maintains product prices.
let prices = new Map();
prices.set("Laptop", 65000);
prices.set("Mouse", 1200);
prices.set("Keyboard", 2500);
console.log(prices.get("Mouse"));
Output
1200
Another example:
Store employee IDs.
let employees = new Map();
employees.set(101, "Rahul");
employees.set(102, "Priya");
employees.set(103, "Amit");
console.log(employees);
Output
Map(3) {
101 => 'Rahul',
102 => 'Priya',
103 => 'Amit'
}
Automation Testing Examples
Automation engineers frequently use Maps while working with browser configurations, API requests, and test environments.
Playwright Example
Store browser configuration.
const browserConfig = new Map();
browserConfig.set("browser", "chromium");
browserConfig.set("headless", true);
console.log(browserConfig.get("browser"));
Output
chromium
Selenium Example
Store browser capabilities.
const capabilities = new Map();
capabilities.set("browserName", "chrome");
capabilities.set("platform", "Windows");
capabilities.forEach(function(value, key) {
console.log(key + " : " + value);
});
Output
browserName : chrome
platform : Windows
Cypress Example
Store environment configuration.
const environment = new Map();
environment.set("env", "QA");
environment.set("baseUrl", "https://example.com");
console.log(environment.size);
Output
2
API Testing Example
Store request headers.
const headers = new Map();
headers.set("Content-Type", "application/json");
headers.set("Authorization", "Bearer token");
for (let [key, value] of headers) {
console.log(key + " : " + value);
}
Output
Content-Type : application/json
Authorization : Bearer token
Data-Driven Testing Example
Store login credentials.
const credentials = new Map();
credentials.set("username", "admin");
credentials.set("password", "admin123");
console.log(credentials.get("username"));
Output
admin
Common Mistakes
Using Dot Notation
Incorrect:
console.log(student.name);
Output:
undefined
Correct:
console.log(student.get("name"));
Forgetting That Keys Must Match Exactly
let map = new Map();
map.set("Age", 25);
console.log(map.get("age"));
Output
undefined
Map keys are case-sensitive.
Using length Instead of size
Incorrect:
console.log(map.length);
Output:
undefined
Correct:
console.log(map.size);
Best Practices
Use Maps for Dynamic Data
Maps are ideal when keys may change or are not limited to strings.
Use Descriptive Keys
Choose meaningful keys such as "browser", "baseUrl", or "Authorization".
Iterate with for...of
The for...of loop provides a clean and readable way to process Map entries.
Organize Related Information
Group related configuration values in the same Map to improve code readability and maintenance.
Conclusion
JavaScript Maps are powerful tools for managing dynamic key-value data. Their support for any key type, built-in methods, insertion-order preservation, and easy iteration make them a valuable alternative to plain objects in many situations.
For automation engineers, Maps simplify handling browser configurations, API headers, environment settings, execution data, and test information. Mastering practical Map examples helps you build cleaner, more scalable, and maintainable JavaScript applications and automation scripts.
Frequently Asked Questions (FAQs)
What is the most common use of a Map?
Storing and managing dynamic key-value pairs.
How do you add a key-value pair?
map.set(key, value);
How do you retrieve a value?
map.get(key);
How do you check whether a key exists?
map.has(key);
Can Maps use numbers and objects as keys?
Yes. Maps support keys of any data type.
Why are Maps important in automation testing?
Automation engineers use Maps to store browser configurations, environment variables, API request headers, execution settings, lookup tables, and test data in a structured and efficient way.
Key Takeaways
Maps store data as key-value pairs.
Keys can be of any data type.
set()adds or updates entries.get()retrieves values.has()checks for the existence of keys.delete()removes entries.clear()removes all entries.sizereturns the total number of entries.Maps are ideal for dynamic data and automation testing.
Mastering practical Map examples helps you write cleaner, more efficient JavaScript code.