javascript自定义一个迭代器

js中对象分为可迭代和不可迭代如果是可迭代哪它就会有一个[Symbol.iterator] 函数

这个函数就是对象的迭代器函数，如用for of 如果遍历的对象没有这个迭代方法那么就会报错

for of 传入的是可迭代对象,但是如何吧一个不可迭代的对象变为可迭代的对象呢！

很简单就是自己写一个[Symbol.iterator] 函数。

代码如下:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        let obj = {
            a: 1,
            b: 2
        }

        obj[Symbol.iterator] = function () {
            //取到对象的每个key值返回一个数组
            let keys = Object.keys(obj);
            //取到key值的长度
            let len = keys.length;
            //定义循环变量
            let n = 0;
            //返回对象 每次迭代会自动调用对象里面的next方法
            return {
                next() {
                    //返回值有value和done
                    //value能自定义
                    //done为true跳出循环
                    return n < len ? {
                        value: { k: keys[n], v: obj[keys[n++]] },
                        done: false
                    } : {
                            done: true
                        }
                }
            }
        }
        //循环 
        //for of 只能遍历可迭代对象
        //所以自己写了个迭代器 详情请查阅web迭代协议
        //返回的是个对象的key和value
        for (let { k, v } of obj) {
            console.log(k, v);
        }
    </script>
</body>

</html>

使用生成器迭代也就是Generator函数代码如下:

let obj = {
            a: 1,
            b: 2
        }
        obj[Symbol.iterator] = function *(){
           let keys = Object.keys(obj);
           //取到key值的长度
           let len = keys.length;
           //定义循环变量
            let n = 0;
            //条件判断
            while(n < len) {
                yield {k:keys[n],v: obj[keys[n++]]};
            }
        }
    //返回的是个对象的key和value
        for (let {k,v} of obj) {
            console.log(k,v);
        }

注释很完整就不多讲了，

2次输出结果相同

输出如下:

　　希望能够帮助到你们！！