Web/JavaScript/Reference/Global objects/Array/@@iterator

The @@iterator method is part of The iterable protocol, that defines how to synchronously iterate over a sequence of values.

The initial value of the @@iterator property is the same function object as the initial value of the values() property.

Syntax

arr[Symbol.iterator]()

Return value

The initial value given by the values() iterator. By default, using arr[Symbol.iterator] will return the values() function.

Examples

Iteration using for...of loop

HTML

<ul id="letterResult">
</ul>

JavaScript

var arr = ['a', 'b', 'c'];
var eArr = arr[Symbol.iterator]();
var letterResult = document.getElementById('letterResult');
// your browser must support for..of loop
// and let-scoped variables in for loops
// const and var could also be used
for (let letter of eArr) {
 letterResult.innerHTML += "<li>" + letter + "</li>";
}

Result

Alternative iteration

var arr = ['a', 'b', 'c', 'd', 'e'];
var eArr = arr[Symbol.iterator]();
console.log(eArr.next().value); // a
console.log(eArr.next().value); // b
console.log(eArr.next().value); // c
console.log(eArr.next().value); // d
console.log(eArr.next().value); // e

Use Case for brace notation

The use case for this syntax over using the dot notation (Array.prototype.values()) is in a case where you don't know what object is going to be ahead of time. If you have a function that takes an iterator and then iterate over the value, but don't know if that Object is going to have a [Iterable].prototype.values method. This could be a built-in object like String object or a custom object.

function logIterable(it) {
 if (!(Symbol.iterator in Object.getPrototypeOf(it)
 /* or "Symbol.iterator in Object.__proto__" 
    or "it[Symbol.iterator]" */)) {
   console.log(it, ' is not an iterable object...');
   return;
 } 

 var iterator = it[Symbol.iterator]();
  // your browser must support for..of loop
  // and let-scoped variables in for loops
  // const and var could also be used
  for (let letter of iterator) {
      console.log(letter);
  }
}

// Array
logIterable(['a', 'b', 'c']);
// a
// b
// c

// string
logIterable('abc'); 
// a
// b
// c

logIterable(123);
// 123 " is not an iterable object..."

Specifications

Specification
ECMAScript (ECMA-262)The definition of 'Array.prototype[@@iterator()' in that specification.]

Browser compatibility

Update compatibility data on GitHub

	Desktop						Mobile						Server
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet	Node.js
`@@iterator`	Chrome Full support 38	Edge Full support 12	Firefox Full support 36 Full support 36 No support 27 — 36 Notes' Alternate Name' Notes' A placeholder property named `@@iterator` is used. Alternate Name' Uses the non-standard name: `@@iterator` No support 17 — 27 Notes' Alternate Name' Notes' A placeholder property named `iterator` is used. Alternate Name' Uses the non-standard name: `iterator`	IE No support No	Opera Full support 25	Safari Full support 10	WebView Android Full support 38	Chrome Android Full support 38	Firefox Android Full support 36 Full support 36 No support 27 — 36 Notes' Alternate Name' Notes' A placeholder property named `@@iterator` is used. Alternate Name' Uses the non-standard name: `@@iterator` No support 17 — 27 Notes' Alternate Name' Notes' A placeholder property named `iterator` is used. Alternate Name' Uses the non-standard name: `iterator`	Opera Android Full support 25	Safari iOS Full support 10	Samsung Internet Android Full support 3.0	nodejs Full support 0.12

Legend

Full support: Full support
No support: No support
See implementation notes.': See implementation notes.
Uses a non-standard name.': Uses a non-standard name.