Algumas adições do ECMAScript 2015 não são novosbuilt-ins ou uma nova sintaxe, mas protocolos. Estes protocolos podem ser implementados por qualquer objeto desde que respeitando algumas convenções.Existem dois protocolos: Oprotocolo iterável (iterable protocol) e oprotocolo iterador (iterator protocol).

O protocolo iterável (iterable protocol)

O protocoloiterável permite que objetos JavaScript definam ou personalizem seu comportamento de iteração, como valores em um loop do construtorfor..of. Alguns tiposbuilt-in sãobuilt-in iterables com um comportamento de iteração padrão, tal comoArray ouMap, enquanto outros tipos (comoObject) não são assim.

Para seriterável, um objeto deve implementar o método@@iterator, o que significa que o objeto (ou um dos objetos acima de suacadeia de protótipos) deve ter uma propriedade com uma chave@@iterator que está disponível via constanteSymbol.iterator:

Sempre que um objeto precisa ser iterado (como no início de um loopfor..of), o método@@iterator é chamado sem argumentos e o retorno doiterador é usado para obter os valores a serem iterados.

O protocolo iterador (iterator protocol)

O protocoloiterador define uma maneira padrão de produzir uma sequência de valores (finito ou infinito).

Um objeto é um iterador quando implementa um métodonext() com a semântica adiante:

var myIterator = {  next: function () {    // ...  },  [Symbol.iterator]: function () {    return this;  },};

Exemplos de uso do protocolo de iteração

UmaString é um exemplo de um objeto iterable built-in:

var someString = "hi";typeof someString[Symbol.iterator]; // "function"

O iterador padrão de uma string retorna as posições dos caracteres de uma string um por um:

var iterator = someString[Symbol.iterator]();iterator + ""; // "[object String Iterator]"iterator.next(); // { value: "h", done: false }iterator.next(); // { value: "i", done: false }iterator.next(); // { value: undefined, done: true }

Alguns construtores built-in, comospread syntax, usam o mesmo protocolo de iteração interiormente:

[...someString]; // ["h", "i"]

Podemos redefinir o comportamento de iteração fornecendo nosso próprio@@iterator:

var someString = new String('hi');           // need to construct a String object explicitly to avoid auto-boxingsomeString[Symbol.iterator] = function() {  return { // this is the iterator object, returning a single element, the string "bye"    next: function() {      if (this._first) {        this._first = false;        return { value: 'bye', done: false };      } else {        return { done: true };      }    },    _first: true  };};

Observe como redefinir@@iterator afeta o comportamento built-in que faz uso do protocolo de iteração:

[...someString]; // ["bye"]someString + ""; // "hi"

Exemplos de Iteráveis

Iteráveis Built-in

String,Array,TypedArray,Map andSet são todos iteráveis internos, porque cada um dos seus objetos protótipos implementa um método@@iterator.

Iteráveis definidos pelo usuário

Nós podemos fazer nossos próprios iterables assim:

var myIterable = {};myIterable[Symbol.iterator] = function* () {    yield 1;    yield 2;    yield 3;};[...myIterable]; // [1, 2, 3]

Built-in APIs que aceitam iteráveis

Existem muitas APIs que aceitam iteráveis, por exemplo:Map([iterable]),WeakMap([iterable]),Set([iterable]) eWeakSet([iterable]):

var myObj = {};new Map([[1, 'a'], [2, 'b'], [3, 'c']]).get(2);               // "b"new WeakMap([[{}, 'a'], [myObj, 'b'], [{}, 'c']]).get(myObj); // "b"new Set([1, 2, 3]).has(3);                               // truenew Set('123').has('2');                                 // truenew WeakSet(function* () {    yield {};    yield myObj;    yield {};}()).has(myObj);                                         // true

Veja tambémPromise.all(iterable),Promise.race(iterable) eArray.from().

Sintaxe que espera iteráveis

Some statements and expressions expect iterables, for example thefor-of loops,spread operator,yield*, anddestructuring assignment:

for(let value of ['a', 'b', 'c']){    console.log(value);}// "a"// "b"// "c"[...'abc']; // ["a", "b", "c"]function* gen() {  yield* ['a', 'b', 'c'];}gen().next(); // { value:"a", done:false }[a, b, c] = new Set(['a', 'b', 'c']);a // "a"

Iteráveis não bem formados

If an iterable's@@iterator method doesn't return an iterator object, then it's a non-well-formed iterable. Using it as such is likely to result in runtime exceptions or buggy behavior:

var nonWellFormedIterable = {}nonWellFormedIterable[Symbol.iterator] = () => 1[...nonWellFormedIterable] // TypeError: [] is not a function

Iterator examples

Simple iterator

function makeIterator(array) {    var nextIndex = 0;    return {       next: function() {           return nextIndex < array.length ?               {value: array[nextIndex++], done: false} :               {done: true};       }    };}var it = makeIterator(['yo', 'ya']);console.log(it.next().value); // 'yo'console.log(it.next().value); // 'ya'console.log(it.next().done);  // true

Infinite iterator

function idMaker() {    var index = 0;    return {       next: function(){           return {value: index++, done: false};       }    };}var it = idMaker();console.log(it.next().value); // '0'console.log(it.next().value); // '1'console.log(it.next().value); // '2'// ...

Com um gerador

function* makeSimpleGenerator(array) {    var nextIndex = 0;    while (nextIndex < array.length) {        yield array[nextIndex++];    }}var gen = makeSimpleGenerator(['yo', 'ya']);console.log(gen.next().value); // 'yo'console.log(gen.next().value); // 'ya'console.log(gen.next().done);  // truefunction* idMaker() {    var index = 0;    while (true)        yield index++;}var gen = idMaker();console.log(gen.next().value); // '0'console.log(gen.next().value); // '1'console.log(gen.next().value); // '2'// ...

Com uma classe ES2015

class SimpleClass {  constructor(data) {    this.index = 0;    this.data = data;  }  [Symbol.iterator]() {    return {      next: () => {        if (this.index < this.data.length) {          return {value: this.data[this.index++], done: false};        } else {          this.index = 0; //If we would like to iterate over this again without forcing manual update of the index          return {done: true};        }      }    };  }}const simple = new SimpleClass([1,2,3,4,5]);for (const val of simple) {  console.log(val);  //'0' '1' '2' '3' '4' '5'}

Um objeto gerador um iterador ou iterável?

Um objeto gerador é tanto iterador quanto iterável:

var aGeneratorObject = function* () {    yield 1;    yield 2;    yield 3;}();typeof aGeneratorObject.next;// "function", because it has a next method, so it's an iteratortypeof aGeneratorObject[Symbol.iterator];// "function", because it has an @@iterator method, so it's an iterableaGeneratorObject[Symbol.iterator]() === aGeneratorObject;// true, because its @@iterator method returns itself (an iterator), so it's an well-formed iterable[...aGeneratorObject];// [1, 2, 3]

Especificações

Veja também

• Para mais informações sobregenerators ES2015, consultea documentação de function*.