2020-11-01

// 遍历器（Iterator）它是一种接口，为各种不同的数据结构提供统一的访问机制。
// 任何数据结构只要部署 Iterator 接口，就可以完成遍历操作（即依次处理该数据结构的所有成员）。
// 具有Iterator接口的数据(可用for in遍历)：Array,Arguments,Set,Map,String,TypedArray,NodeList
// 工作原理：
// 1、创建一个指针对象，指向当前数据结构的起始位置，也就是说遍历器对象的本质就是一个指针对象
// 2、第一次调用指针对象的next方法，可以将指针指向数据结构的第一个成员
// 3、第二次调用，第三次调用。。。依次指向下一个成员直到指向结束位置
// 4、每次调用都返回(value,done):(当前位置值，是否结束)
// eg
const arr = ['a', 'b', 'c', 'd']
// for in遍历键名，for of遍历键值
for (let v of arr) {
    console.log(v)
}
for (let i in arr) {
    console.log(i)
}

// 调用对象的next方法
let iterator = arr[Symbol.iterator]();
console.log(iterator.next())
console.log(iterator.next())
console.log(iterator.next())
console.log(iterator.next())
// 最后undfined和true
console.log(iterator.next())

// 自定义iterator接口
const json = {
    name: '开始',
    arr: ['a1', 'b1', 'c1', 'd1'],
    [Symbol.iterator]() {
        let i = 0;
        return {
            next:()=>{
                if (i < this.arr.length) {
                    let data = { value: this.arr[i], done: false }
                    i++
                    return data
                } else {
                    return { value: undefined, done: true }
                }

            }
        }
    }

}
for (let v of json) {
    console.log(v)
}

// 生成器其实是一个特殊的函数
// 异步编程 纯回调函数 node fs mongodb
// 函数代码的分隔符
// 执行->第一个yield后代码->再次执行->第二个yield后代码。。。
// *可偏左，也可偏右
// function* ge()
// function *ge()
// function * ge()
// function*gen
// yield类似于return
function* gen() {
    yield 1
    yield 2
    yield 3
    yield 4
}
// 使用
let iterator = gen();
iterator.next();
iterator.next();
iterator.next();
iterator.next();
iterator.next();
console.log(gen)
for (let v of gen()) {
    console.log(v)
}

// 函数参数
function* gen1(arg) {
    console.log(arg)
    let a = yield 1;
    console.log(a)
    let b = yield 2;
    console.log(b)
    let c = yield 3
    console.log(c)
}
// 第一次不会输出(gen1('AAA'))
// 执行迭代器对象
let it = gen1('01');
// 第一次调用next方法，arg为执行迭代器传递的参数
console.log('----------')
console.log(it.next('a1'));
// 第一次调用next方法，arg为'b1'
console.log('----------')
console.log(it.next('b1'));
console.log('----------')
console.log(it.next('c1'));
console.log('----------')
console.log(it.next('d1'));

// 生成器函数实例
// 异步编程  文件操作 网络操作(ajax,request) DB操作
// es5实现，回调地狱
// setTimeout(()=>{
//     console.log(1);
//     setTimeout(()=>{
//         console.log(2)
//         setTimeout(()=>{
//             console.log(3)
//         },1000)
//     },1000)
// },1000)

// 生成器函数解决回调地狱
function a(){
    setTimeout(()=>{
        console.log('a')
        iter.next()
    },1000)
}
function b(){
    setTimeout(()=>{
        console.log('b')
        iter.next()
    },1000)
}
function c(){
    setTimeout(()=>{
        console.log('c')
        iter.next()
    },1000)
}
function*run(){
    yield a();
    yield b();
    yield c();
}
let iter = run();
iter.next()

// 
function getA(){
    setTimeout(()=>{
        let A = "A哦"
        // 调用next方法，传入数据
        iter1.next(A)
    },1000)
}
function getB(){
    setTimeout(()=>{
        let data = "B哦"
        // 调用next方法，传入数据
        iter1.next(data)
    },1000)
}
function getC(){
    setTimeout(()=>{
        let data = "C哦"
        iter1.next(data)
    },1000)
}

function* run1(){
    // 接收getA方法结果
    let A = yield getA();
    console.log(A)
    // 接收getB方法结果
    let B = yield getB();
    console.log(B)
    // 接收getC方法结果
    let C = yield getC();
    console.log(C)
    
}
let iter1 = run1();
iter1.next()