The size accessor property returns the number of key-value pairs in a Map. It provides a simple and direct way to determine the current length of the Map.
Example 1: Checking the Number of Items in a Cart
// A shopping cart represented by a Map.
const shoppingCart = new Map([
['item1', 1],
['item2', 3]
]);
// Get the total number of unique items in the cart.
const itemCount = shoppingCart.size;
console.log(itemCount); // Outputs: 2
Explanation
The size property directly returns the number of entries in the shoppingCart Map, which in this case is 2.
Example 2: Using Size in a Conditional Statement
// A Map tracking errors.
const errorLog = new Map();
// The size property can be used to check if there are any errors.
if (errorLog.size === 0) {
console.log('No errors reported.');
} else {
console.log(`There are ${errorLog.size} errors.`);
}
Explanation
Here, size is used to check if the errorLog Map is empty. This is a clean and readable way to perform conditional logic based on whether a Map contains entries.
Example 3: size of an Empty Map
// An empty Map.
const emptyMap = new Map();
// The size of a newly created, empty map is 0.
console.log(emptyMap.size); // Outputs: 0
Explanation
A Map that has just been initialized and has no entries will have a size of 0.
Example 4: size After Adding and Deleting Entries
// A Map to manage a user's permissions.
const permissions = new Map();
permissions.set('read', true);
permissions.set('write', true);
console.log(permissions.size); // Outputs: 2
permissions.delete('write');
console.log(permissions.size); // Outputs: 1
Explanation
This example shows how the size property is dynamic. It updates automatically as entries are added to or removed from the Map.
Example 5: Displaying the Number of Online Users
// A Map of online users.
const onlineUsers = new Map([
['socket1', 'Alice'],
['socket2', 'Bob'],
['socket3', 'Charlie']
]);
// Display a message with the current number of online users.
console.log(`Currently ${onlineUsers.size} users online.`);
Explanation
The size property provides a convenient way to get a count of the elements, which is useful for displaying statistics or summary information to users.
Example 6: Controlling a Loop with size
// A queue of tasks to process.
const taskQueue = new Map([
[1, 'Process video'],
[2, 'Generate report']
]);
// It's generally better to iterate, but size can be a loop condition.
while (taskQueue.size > 0) {
// Logic to process and remove a task from the queue...
console.log(`Tasks remaining: ${taskQueue.size}`);
// In a real loop, you would remove an item here.
taskQueue.delete([...taskQueue.keys()][0]);
}
Explanation
While iterators are the preferred way to loop over a Map, size can be used to control a while loop that processes and removes items until the Map is empty.
Example 7: size After Using clear()
// A Map with several entries.
const dataPoints = new Map([
['x', 10],
['y', 20],
['z', 30]
]);
console.log(`Initial size: ${dataPoints.size}`); // Outputs: Initial size: 3
// Clear all entries from the map.
dataPoints.clear();
console.log(`Size after clear: ${dataPoints.size}`); // Outputs: Size after clear: 0
Explanation
This example explicitly shows the effect of the clear() method on the size property. After clear() is called, the size becomes 0.