ES6의 Iterator 인터페이스에 대한 코드 예제 설명-JS 튜토리얼-php.cn

ES6의 Iterator 인터페이스에 대한 코드 예제 설명

不言

풀어 주다： 2018-10-29 15:18:20

앞으로

1945명이 탐색했습니다.

이 기사의 내용은 ES6의 Iterator 인터페이스에 대한 코드 예제입니다. 이는 특정 참조 가치가 있으므로 도움이 될 수 있습니다.

es6에서 특정 데이터 구조(배열 객체 맵 세트)를 작동할 때 어떻게 통합된 메소드로 작동할 수 있나요? 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 loop

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

로그인 후 복사

있음 칼럼

~ ~ ~ ~ ~ ~ ~ 스크립트
#🎜🎜 ##### 🎜🎜#14번읽음 읽는 데 6분이 걸립니다.

es6에서 특정 데이터 구조(배열 객체 맵 세트)를 작동할 때 통합 메서드를 사용하여 작동하는 방법은 무엇입니까?

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
    }
}

로그인 후 복사

#🎜 🎜#

# ㅋㅋㅋㅋㅋㅋㅋㅋㅋ #🎜 🎜#