Symbol.Iterator

The Symbol.iterator specifies the default iterator for an object. Mainly used for the for…of operator loop.

Support Iterable protocol to allow objects to customise their iteration behaviour. Its provide convenient of operator to iterate over all values of an Iterable object.

Symbol.iterator function was called without the any argument, Symbol.iterator have the next() function inside it, it was called every time and returns the output, When we use the Symbol.iterable in for…of loop it will call the next() function of it, and next() function returns values of the results.

Please note that next() function is zero argument function that call without any argument and returns the object with the two properties done and value.

Syntax:

var FunctionName = {
	[Symbol.iterator](){
		return{
			next(){
				//your rest logic...
				//example: { done: true || false, value= "your results or object" }
			}
		};
	}
}

Fibonacci Series Example Using Symbol.iterator

var fibonacci={
	[Symbol.iterator](){
		var previous=0, current=1;
		return{
			next(){
				previous=current;
				current=previous+current;
				return { done: false, value: current }
			}
		};
	}
}

for(var i of fibonacci){
  if(i>100){
	break;
  }
  document.write(" "+i);
}

As you see above we created the object with name Fibonacci which generate the Fibonacci series here we create the Symbol.iterator function first it was return the next() and next() returns the two properties done and value.

1. done: As the property name suggest the work is done or not.
   1. If it has the true than the for…of loop is terminated, it means the now Symbol.iterator does not have the value to return. It simply indication of the end of the iterator. when the done is true, than value property is simply omitted.
   2. If it has false than it means, It have the value to return. the for…of loop continue executing it the done is false.
2. value: It is any JavaScript value returns by the iterator to the for…of loop. it’s value can be omitted when the value of the done is true.

Symbol.iterator is useful to generate the finite and infinite set of series.

Let’s we can make the iterator for the our array. Which is useful to print the array’s value one by one on the screen.

Example:

var PrintArrayValue = function(array){
	var index=0;
	return{
	  next: () => {
		   return index < array.length ?
		  { value: array[index++], done: false } :
		  { done: true };
	  }
	};
}

var values = PrintArrayValue([ "JavaScript", "Hive" ]);

document.write("0: "+values.next().value); //0: JavaScript
document.write("1: "+values.next().value); //1: Hive
document.write("2: "+values.next().value); //2: undefined

In above example we create the custom iterator for the array, now that iterator will work as per define our behaviour. Here the length of the array is 2. if you call the next() method of the iterator more than 2 time than every time it will give the undefined message.

Please comment down review about it,

Happy Coding...

🙂