Es6-features 讀書心得

Iterators + For..Of

for...of

Difference between for...of and for...in

let arr = [3, 5, 7];
arr.foo = "hello";

for (let i in arr) {
   console.log(i); // "0", "1", "2", "foo"
}

for (let i of arr) {
   console.log(i); // "3", "5", "7"
}

Iterators-迭代器

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'

Iterator with a generator-使用產生器的迭代器

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);  // true

string

var a = "hi";
var iterator = a[Symbol.iterator]();

console.log(a[Symbol.iterator]); // function [Symbol.iterator]() { [native code] }
console.log(iterator.next()); // Object {value: "h", done: false}
console.log(iterator.next()); // Object {value: "i", done: false}
console.log(iterator.next()); // Object {value: undefined, done: true}
console.log([...a]); // ["h", "i"]

User-defined iterables

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