Table Of Content

ECMAScript Set Collection Tutorial

View more Tutorials:

1- Collections - Set

ECMAScript 6 introduces the 2 new data structures such as  Map & Set. They are part of ECMAScript Collections Framework).
  • Maps - This data structure allows you to store the "Key/Value". And you can access the value through the key or update a new value corresponding to a key.
  • Sets - This data structure stores a list of elements not allowing duplicate, and not indexing elements.
In this post, I will introduce the Set to you.
See also:
  • TODO Link!

Set

The Set is a data structure introduced in the  ECMAScript6. The following is Set characteristics.
  • Set is a list of elements not allowing iteration.
  • Set doesn't index elements.
  • Set is an ordered list, which means that an element which is added first will come first and an element that is added second  will come second.
Constructors:
Create  Set object through the con structor of the  Set: class
new Set( [iterable] )
Parameters:
  • iterable - If this object is passed to the constructor of the Set, all its elements will be added to the Set. On the contrary, if you don't  specify this parameter, or its value is null, the Set object created will be empty.
Properties:
set-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya' }
Property Description
size This Property returns element number of Set object
set-size-example.js
// Create a Set from an Array
var fruits = new Set( ['Apple','Banana','Papaya'] );

var size = fruits.size;

console.log(size); // 3

2- The methods of Set

add(value)

Add an element to the end of Set if this element doesn't exists in Set and return this Set object.
set-add-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

// Append an Element to the Set and returns this Set.
var thisFruits = fruits.add("Cherry");

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya', 'Cherry' }

// 'Set' does not allow duplicates
fruits.add("Banana");

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya', 'Cherry' }

delete(value)

This method is used to remove an element out of the S et. The method returns  true if it finds an element to be removed and on the contrary, it returns false.
set-delete-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya' }

// Delete an element:
var deleted = fruits.delete("Banana");

console.log("Deleted? " + deleted); // true

console.log(fruits); // Set { 'Apple', 'Papaya' }

clear()

Remove all elements out of  Set.
set-clear-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya' }

// Remove all elements.
fruits.clear();

console.log(fruits); // Set { }

console.log("Size after clear: " + fruits.size);

entries()

This method returns a new  Iterator object of which each  entry contains an array with the 2 elements such as  [value, value]. The order of  entries still be kept unchanged like the order of elements in the Set object. (See the following illustration)   

set-entries-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya' }

// Iterator Object:
var iteratorEntries = fruits.entries();

var entry;

while( !(entry = iteratorEntries.next() ).done )  {

    console.log(entry.value); // [ 'Apple', 'Apple' ]
}

has(value)

This method tests whether a value given by a parameter exists in Set or not. Return  true if existing, on the contrary, return  false.
set-has-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

var has = fruits.has("Banana");

console.log(has); // true

forEach(callbackFn[, thisArg])

mySet.forEach(callbackFn [, thisArg])
 
set-forEach-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );

console.log(fruits); // Set { 'Apple', 'Banana', 'Papaya' }

function showFruit(fruit, thisSet) {
  console.log("Fruit: " + fruit);
}

// Or Call: fruits.forEach(showFruit);
fruits.forEach(showFruit, fruits);
 

key() & values()

set-values-example.js
// Create a Set from an Array
var fruits = new Set( ["Apple","Banana","Papaya"] );


var fruitIterator = fruits.values();

var entry;
while ( !(entry = fruitIterator.next()).done)  {
   console.log(entry); // { value: 'Apple', done: false }
   console.log(entry.value); // Apple
}

View more Tutorials: