Different data structures have their own design which is helpful in solving particular problems. Arrays are good when we need a sequence (or collection) of data values, and sets are useful when we need a collection of unique data values.
As with arrays, there are ways to update them, and within this article, we will discuss how to remove (or delete) the data values from the unique collection called set.
What is set in JavaScript?
As stated earlier, sets in JavaScript are collections of unique data values of any data type from the primitive type to the object type. Sets, like arrays, can be iterated over based on their insertion order. The insertion can occur from initialization (via an array) or through the add
method which will pass an argument - a data value. In Sets, the value equality is based SameValueZero algorithm which sees NaN
equal to NaN
and 0
equal to -0
.
Let’s create a set using the SetConstructor
and show you how to add data values to it via the add()
method.
const unique = new Set();
unique.add("one");
unique.add("one");
unique.add("two");
console.log(unique);
Output
Set(2) { 'one', 'two' }
Notice that even though we added the string "one"
twice, it wasn’t, and that’s because Set
maintains the uniqueness of every data value.
We can create a set by passing arrays as below
const faang = new Set(["facebook", "amazon", "apple", "netflix", "google"]);
console.log(faang);
Output
Set(5) { 'facebook', 'amazon', 'apple', 'netflix', 'google' }
Use delete() method to delete element from set
To remove from Set in JavaScript, we need to have the specific value and pass it as the argument of the delete
method. It removes the specified value from the Set
object if it is there and returns a Boolean value if the value was there (true
) or not (false
).
Let’s try with a simple set with primitive values ranging from strings, and numbers to Booleans. First, we assigned a symbol (sym
), and created the unique
Set, and logged it. Afterward, we used the delete
method to remove the string "twelve"
, and log the unique
Set to see the change.
let sym = Symbol();
const unique = new Set(["twelve", 23, true, sym]);
console.log(unique);
console.log(unique.delete("twelve"));
console.log(unique);
Output
Set(4) { 'twelve', 23, true, Symbol() }
true
Set(3) { 23, true, Symbol() }
The second line is true
because "twelve"
was present in the unique
Set, and the third line shows that the string has been removed.
However, how do we remove from Set in JavaScript when its content is an object? By checking through each iteration for the specific identifier.
Here, the specific identifier
is the index
key, and so by looping through the set (as it is an iterable) using forEach
, we can use an if statement
to specify which value to delete using the delete
method.
const unique = new Set([
{ index: 0, value: "twelve" },
{ index: 1, value: "eleven" },
{ index: 2, value: "twelve" },
]);
console.log(unique);
unique.forEach((object) => {
if (object.index == 1) {
unique.delete(object);
}
});
console.log(unique);
Output
Set(3) {
{ index: 0, value: 'twelve' },
{ index: 1, value: 'eleven' },
{ index: 2, value: 'twelve' }
}
Set(2) { { index: 0, value: 'twelve' }, { index: 2, value: 'twelve' } }
So, using the if statement
, we were able to specify that where the object’s index was equal to 1, we delete such an object. The second set in the output shows that’s what happened.
Summary
Sets are great for maintaining collections of unique values, and to learn to remove from set in JavaScript is another knowledge that’s important in understanding JavaScript better. Here, we have learned how to remove from set in JavaScript using the delete
method.
References
Set - JavaScript | MDN (mozilla.org)
Set.prototype.delete() - JavaScript | MDN (mozilla.org)