> 웹 프론트엔드 > JS 튜토리얼 > 10분 안에 JavaScript 반복자가 무엇인지 이해하세요

10분 안에 JavaScript 반복자가 무엇인지 이해하세요

WBOY
풀어 주다: 2021-12-22 18:20:23
앞으로
4076명이 탐색했습니다.

이 기사에서는 JavaScript의 반복자에 대한 관련 지식을 제공하고 반복자가 무엇인지, 어떻게 사용자 정의하는지 살펴보겠습니다.

10분 안에 JavaScript 반복자가 무엇인지 이해하세요

1. 반복자란 무엇입니까?

  • Iterator는 다양한 데이터 구조에 대한 통합 액세스 메커니즘을 제공하는 인터페이스 메커니즘입니다. (즉, 순회를 지원하지 않는 일부 데이터 구조를 순회 가능하게 만들기 위해) 가장 일반적인 것은 배열의 값을 순서대로 반환하는 Array iterator입니다.
  • let arr = [1,2,3,4,5];for (let val of arr) {
        console.log(val);}
    로그인 후 복사

10분 안에 JavaScript 반복자가 무엇인지 이해하세요2. 맞춤 반복자


그럼 반복자는 어떻게 구현하나요?

우선 두 가지 점을 충족해야 합니다.

Iterable 프로토콜

    Iterator 프로토콜
  • Iterable 프로토콜

Iterable 프로토콜을 사용하면 JavaScript 객체가 반복 동작을 정의하거나 사용자 정의할 수 있습니다.

만족하는 방법 반복 가능한 프로토콜?

반복 가능한 객체가 되려면 객체가 @@iterator 메서드를 구현해야 합니다.

이는 객체(또는 프로토타입 체인의 객체)에 @@iterator 키가 있는 속성이 있어야 하며, 이는 Symbol.iterator 상수를 통해 액세스할 수 있음을 의미합니다.


즉, 반복 가능 항목을 충족하려면 프로토콜을 사용하려면 개체를 반복 가능한 개체로 만들기 위해 키 이름이 Symbol.iterator인 속성이 있어야 합니다.

Iterator 프로토콜

Symbol.iterator的属性,使其成为可迭代对象。

迭代器协议

迭代器协议定义了产生一系列值(无论是有限个还是无限个)的标准方式。
当值为有限个时,所有的值都被迭代完毕后,则会返回一个默认返回值。

如何满足迭代器协议 ?

你的对象需要至少实现一个next()方法,这个方法返回一个迭代器对象IteratorResult。这个迭代器对象包含两个属性done和·value

  • done:
    如果迭代器可以产生序列中的下一个值,则为 false。
    如果迭代器已将序列迭代完毕,则为 true
  • value
    迭代器返回的值。done 为 true 时可省略

那么我们接下来开始自定义一个迭代器

由前文所讲,要想自定义迭代器,需要符合以下两个条件:

  • 成为可迭代对象,即有一个 Symbol.iterator 属性
    (即可迭代协议:Symbol.iterator)
  • 该迭代器对象返回一个 next() 方法,这个 next() 方法返回一个包含valuedone
    반복자 프로토콜은 유한이든 무한이든 값의 시퀀스를 생성하는 표준 방법을 정의합니다.
  • 제한된 수의 값이 있는 경우 모든 값을 반복한 후 기본 반환 값이 반환됩니다.


반복자 프로토콜을 충족하는 방법은 무엇입니까?

객체는 반복자 객체 IteratorResult를 반환하는 next() 메서드를 하나 이상 구현해야 합니다. 이 반복자 객체에는 donevalue라는 두 가지 속성이 포함되어 있습니다.

10분 안에 JavaScript 반복자가 무엇인지 이해하세요done:
반복자가 시퀀스에서 다음 값을 생성할 수 있으면 거짓입니다.

반복자가 시퀀스 반복을 완료한 경우 true

value 반복자가 반환한 값입니다. done이 true이면 Done을 ​​생략할 수 있습니다

🎜🎜그럼 이터레이터 커스터마이징을 시작하겠습니다🎜🎜🎜위에서 언급했듯이 이터레이터를 커스터마이즈하려면 다음 두 가지 조건을 충족해야 합니다.🎜🎜🎜반복 가능한 객체가 되십시오. 즉, Symbol.iterator 속성이 있습니다🎜(즉, 반복 가능한 프로토콜: Symbol.iterator)🎜🎜반복자 객체는 next() 메서드를 반환합니다. 이 < code> next() 메서드는 valuedone 속성을 ​​포함하는 객체를 반환합니다 🎜(예: 반복자 프로토콜: return { next() { return { value, done } })🎜🎜
let colors = {
    blue : "蓝色",
    green : "绿色",
    yellow : "黄色"}
로그인 후 복사
🎜colors는 이제 반복 불가능한 객체입니다. for...of를 사용하여 탐색한 다음 반복자를 사용자 정의할 수 있습니다. 🎜 다음으로 구현을 시작합니다. 🎜
colors[Symbol.iterator] = function() {
	let keys = Object.keys(colors);
	// 如果用 let keys = Reflect.ownKeys(colors),keys 就会包括一些不可枚举的属性
	// 那么后面的 len 要减一,减去Symbol.iterator这个属性
	// 根据实际情况选择使用
	let len = keys.length;
	let index = 0;
	
	return {
	    next : function() {
	        if (index < len) {
	            return {
	                value : colors[keys[index++]],
	                done : false
	            }
	        }
	        return { done : true }
	    }
	}}
로그인 후 복사
🎜 검증해 보겠습니다. 🎜
for (let val of colors) {
    console.log(val);}
로그인 후 복사
🎜🎜🎜🎜🎜[관련 권장 사항: 🎜javascript 학습 튜토리얼🎜🎜]🎜🎜

위 내용은 10분 안에 JavaScript 반복자가 무엇인지 이해하세요의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿