小兔网

本篇文章给大家带来的内容是关于ES6中Iterator接口的代码示例讲解,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

es6中,操作某些数据结构(array object map set)时,怎么用一个统一的方法操作,Iterator接口实现了这样的功能

1.Iterator在数组中的应用

{    let arr = ['hello', 'world'];    // 数组内部实现了iterator接口,所以直接调用[Symbol.iterator]()    let map = arr[Symbol.iterator]();    console.log(map.next()); // {value: "hello", done: false}    console.log(map.next()); // {value: "world", done: false}    console.log(map.next()); // {value: undefined, done: true}    // value 表示数组元素,done表示循环是否有下一步状态,true:没有下一步了,false:循环没有结束}

2.自定义Iterator接口

{    // object没有内置iterator接口,自定义iterator接口,让obj也可以使用for...of    let obj = {        start: [1,2,3],        end: [4,5,6],        // 声明iterator接口方法        [Symbol.iterator]() {            // 先遍历start,再遍历end            let arr = this.start.concat(this.end);            let index = 0;            // 返回next()            return {                next() {                    if (index < arr.length) {                        return {                            value: arr[index++],                            done: false                        }                    } else {                        return {                            value: arr[index++],                            done: true                        }                    }                }            }        }    };    // for...of 实现的原理就是不断调用Iterator接口    // 通过 for...of 验证接口是否配置成功,如果没有配置成功,object就无法使用 for...of循环    for (let key of obj) {        console.log(key); // 1 2 3 4 5 6    }}

3.for...of循环

{    // 数组内部实现了iterator接口,所以可以直接使用for...of循环    let arr = ['hello', 'world'];    for (let value of arr) {        console.log(value); // hello world    }}








ican ES6中Iterator接口的代码示例讲解26 发布于 超级有温度的代码

1 天前发布

【ES6入门13】:Iterator
  • 前端

  • es6

  • javascript

14 次阅读 · 读完需要 6 分钟



0


es6中,操作某些数据结构(array object map set)时,怎么用一个统一的方法操作,Iterator接口实现了这样的功能

1.Iterator在数组中的应用

{    let arr = ['hello', 'world'];    // 数组内部实现了iterator接口,所以直接调用[Symbol.iterator]()    let map = arr[Symbol.iterator]();    console.log(map.next()); // {value: "hello", done: false}    console.log(map.next()); // {value: "world", done: false}    console.log(map.next()); // {value: undefined, done: true}    // value 表示数组元素,done表示循环是否有下一步状态,true:没有下一步了,false:循环没有结束}

2.自定义Iterator接口

{    // object没有内置iterator接口,自定义iterator接口,让obj也可以使用for...of    let obj = {        start: [1,2,3],        end: [4,5,6],        // 声明iterator接口方法        [Symbol.iterator]() {            // 先遍历start,再遍历end            let arr = this.start.concat(this.end);            let index = 0;            // 返回next()            return {                next() {                    if (index < arr.length) {                        return {                            value: arr[index++],                            done: false                        }                    } else {                        return {                            value: arr[index++],                            done: true                        }                    }                }            }        }    };    // for...of 实现的原理就是不断调用Iterator接口    // 通过 for...of 验证接口是否配置成功,如果没有配置成功,object就无法使用 for...of循环    for (let key of obj) {        console.log(key); // 1 2 3 4 5 6    }}

3.for...of循环

{    // 数组内部实现了iterator接口,所以可以直接使用for...of循环    let arr = ['hello', 'world'];    for (let value of arr) {        console.log(value); // hello world    }}

  • images/2021/06/21/08/2021062108210316503522.svg


你可能感兴趣的



评论

默认排序 时间排序



载入中...

显示更多评论


2021062108210415609643

以上就是ES6中Iterator接口的代码示例讲解的知识。速戳>>知识兔学习精品课!