How to delete an element from map - JavaScript
Mohamed Ibrahim

Mohamed Ibrahim @moibra

About: Full stack web developer and Technical writer. I teach JavaScript & React & Python & Java

Joined:
Jun 3, 2021

How to delete an element from map - JavaScript

Publish Date: Feb 1 '23
3 0

In this article we will learn how to delete an element from map.

It is very common to delete an element from map in JavaScript.


Problem

Now we have a problem, which is that we want to delete an element from the map.

Now let's define a map like this:

// Map
const map = new Map([
    ['name', 'John'],
    ['age', 30],
]);

console.log(map);
// Map(2) { 'name' => 'John', 'age' => 30 }
Enter fullscreen mode Exit fullscreen mode

And we only want to delete an element from our map, so the output becomes like this:

Map(1) { 'age' => 30 }
Enter fullscreen mode Exit fullscreen mode

If we deleted name element

How to solve this problem?

Fortunately, there is already a function in the map that deletes items call delete(), all you have to do is use the delete() function, and pass the item you want to delete.


Delete an element using delete method

As we said before you can use delete() method to remove an element from map.

Example

// Map
const map = new Map([
    ['name', 'John'],
    ['age', 30]
]);

// Print before deleting
console.log(map);

// Delete element
map.delete('name');

// Print after deleting
console.log(map);
Enter fullscreen mode Exit fullscreen mode

Output

Map(2) { 'name' => 'John', 'age' => 30 }
Map(1) { 'age' => 30 }
Enter fullscreen mode Exit fullscreen mode

Well, now what if I want to delete the first element and I don't know its key! What do I do?

Delete the first element of map

Now I will answer the previous question, if you want to delete the first element and you don't know its key.

You can use Array.from() to get all the element in an array and then you can get first element easily.

// Map
const map = new Map([
    ['name', 'John'],
    ['age', 30]
]);

// Array with elements
const array = Array.from(map);

// First element
const firstEle = array[0];

// Print
console.log(firstEle);
Enter fullscreen mode Exit fullscreen mode

Now that we get the first element, we can delete it using delete.

// Map
const map = new Map([
    ['name', 'John'],
    ['age', 30]
]);

// Array with elements
const array = Array.from(map);

// First element
const firstEle = array[0];

// Delete first element by his key `[0]`
map.delete(firstEle[0]);

// Print
console.log(map);
Enter fullscreen mode Exit fullscreen mode

Output

Map(1) { 'age' => 30 }
Enter fullscreen mode Exit fullscreen mode

🚀 Let’s Connect and Build Together!

Thanks for making it to the end! I’m passionate about web development, open source, and building tools that make life easier for developers.

  • 💻 Check out my projects on GitHub
  • 🐦 Follow me on Twitter/X for tips, threads, and dev insights
  • 🌐 Visit my Portfolio to learn more about what I do

Whether you're looking to collaborate, hire, or just chat about code, my DMs are always open. 🙌

Comments 0 total

    Add comment