迭代器与生成器详解-CSDN博客

迭代器：

迭代器（iterator）有时又称游标（cursor）是程序设计的软件设计模式，可在容器（container，例如链表或阵列）上遍访的接口，设计人员无需关心容器的内容。（可以粗糙理解为遍历器）

原理：

数组中迭代器的this（指针）, 每次指向下一个索引

Map Set 会把临接链表转化成一个单项链表指针每次指向一个节点。指针下移

有默认的iterator接口：（都可以迭代的）Array Map Set String NodeList arguments

数组迭代器原理：

let arr = [1, 2, 3]
function createIterator(arr) {
    let nextIndex = 0;
    return {
        next() {     //对象函数简写
            if (arr.length - 1 < nextIndex) { //数组长度 length-1 (从1和从0的区别)
                return {
                    value: undefined,
                    done: true
                }
            } else {
                return {
                    value: arr[nextIndex++],
                    done: false
                }
            }
        }
    }
}

以上代码，每次执行一次next() 方法都会遍历出数组中的一位数。

entries 迭代器对于数组返回 [index,value] ,Map 返回[key,value] ,Set 返回 [key,key]

let arr = [1, 2, 3];
let map = new Map([['name', 'xxx'], ['age', 18]])
let set = new Set([1, 2, 3])
//entries 迭代器 对于数组返回 [index,value] ,Map 返回[key,value] ,Set 返回 [key,key]
let arrEntries = arr.entries();
let mapEntries = map.entries();
let setEntries = set.entries();
for (let item of arrEntries) { //for of 的作用是遍历迭代器中的next方法
    console.log(item)
}
所有迭代器 都有symbol.iterator 属性 必须通过中括号形式访问。返回默认的迭代器
迭代必须是有序的
for (let item of arr) { //会默认调用arr[symbol.iterator]() =>arr.values()
    console.log(item)
}
for (let item of map) { //map[symbol.iter]
    console.log(item)
}

所有迭代器都有symbol.iterator 属性必须通过中括号形式访问。返回默认的迭代器。迭代必须是有序的

对象是不可迭代的

var obj = {}

obj[symbol.iterator]().next() //报错可以用for in 来遍历对象的属性和方法。

小知识点：String 有些是双字节 for in 遍历不出来所以需要使用 for of

生成器 Generator

用于生成迭代器

生成器是函数 * yield 应用：异步函数同步化

function* demo() {
    yield 1;
    yield 2;
    yield 3;

}
let i = demo()
i.next()

第一次执行i.next() 输出结果为1 第二次执行 i.next() 输出结果是2 。。。。

function washHands() {
    console.log('刷牙');
    setTimeout(function () {
        demo.next('挤牙膏刷好了牙')
    }, 2000)

}
function peeling() {
    console.log('洗脸');
    setTimeout(function () {
        demo.next('洗掉一天的疲惫')
    }, 2000)
}
function eat() {
    console.log('晚安~');
    setTimeout(function () {
        demo.next('躺在舒服的床上，对世界说一声晚安~')
    }, 2000)
}

function* eatOrange() {
    let result = `${yield washHands()}${yield peeling()}${yield eat()}`
    console.log(result);
}
let demo = eatOrange()
demo.next();  //调用第一次的yield  参数代表上一次next的返回值 这里没有 所以没有返回值

//委托迭代器 yield*
//遍历数组和字符串
function* show(arr, string) {
    yield* arr;
    yield* string;
}
let i = show([1, 2, 3], '我喜欢你')
for (let item of i) {
    console.log(item)
}

es6迭代器