Sets in JavaScript
Software Engineer | Full Stack Web developer | Javascript | React.js | Python | PHP | AWS | Docker
As the name suggests, a set is a collection of unique items. It does not store repeated values. Sets in JavaScript will store elements in insertion order. So they are ordered in JavaScript. And it will store data types or primitive objects.
Let's see the syntax of sets in JavaScript.
Hope you have IDE to practice the following. ``` const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]); console.log(names);
const randomWord = new Set("Hiiiiiii"); console.log(randomWord);
const numbers = new Set([5, 5, 5, 2, 1, 1, 2, 3]); console. log(numbers); Properties and methods
Sets have different properties and methods that help us work with them to solve different problems. Properties and methods are as simple as creating them. You can easily get the functionality of the methods with their names themselves. Let's see them one by one.
## size
The size property returns the number of elements present in the set.
const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]);
console.log(Size: ${names.size});
## add
The add method is used to add a new item to the set. If the new element is already present in the set, it will not add it.
// empty set const names = new Set();
names.add("James"); names.add("Henry"); names.add("Wick"); names.add("Clinton"); names.add("Harry");
console.log(names);
## has
Method has takes an argument and returns true if the element is present in the set otherwise it returns false.
const names = new Set(["James", "Henry", "Wick", "Clinton, "Harry"]);
console.log(names.has("Harry")); console.log(names.has("Alley"));
## delete
As you would expect the delete method takes an argument and removes it from the set. It returns no error even if the given argument is not present in the set.
const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]);
names.delete("James");
console.log(names);
## entries
The entries method returns an iterator containing arrays of key-value pairs in insertion order. Here the key and value are the same.
const names = new Set(["James", "Henrry", "Wick", "Clinton", "Harry"]);
const entries = names.entries();
console.log(entries.next().value); console.log(entries.next().value); console.log(entries.next().value); console.log(entries.next().value); console.log(entries.next().value);
## keys
method keys returns an iterator of set elements in insertion order.
const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]);
const keys = names.keys();
console.log(keys.next().value); console.log(keys.next().value); console.log(keys.next().value); console.log(keys.next().value); console.log(keys.next().value);
## values
The values method returns an iterator of set elements in insertion order similar to the keys method.
const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]);
const values = names.values();
console.log(values.next().value); console.log(values.next().value); console.log(values.next().value); console.log(values.next().value); console.log(values.next().value);
## clear
The clear method removes all elements from the set.
const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]);
names. clear();
console.log(names);
## forEach
The forEach method is used to iterate through the set and extract all elements one by one.
const names = new Set(["James", "Henry", "Wick", "Clinton", "Harry"]);
names.forEach((element) => { console.log(element); });
## In addition,
Let's see a simple application of sets with a program. Given an array, remove all duplicate values from it. To solve the problem, we can use the set property.
Let's see how to solve it.
> Initialize an array with dummy data.
> Initialize an empty set.
> Iterate over the array of elements.
> Add each element to the set.
> It will automatically remove duplicate items
> Initialize an empty array.
> Iterate through it and add each element to the new array.
> Print the new table.
Hope you can solve it yourself. If you are struggling with coding, take a look at the solution below.
const arr = ["James", "Henry", "Wick", "Clinton", "Harry"];
const temp = new Set();
arr.forEach((element) => { temp.add(element); });
const newArr = [];
temp. forEach((element) => { newArr.push(element); });
console.log(newArr); ```
Conclusion
Now you have all the knowledge you need to work with sets in JavaScript. You can use them in your next project. Go ahead and enjoy.
Happy Coding 👨💻
