JavaScript 이터러블 객체

이터러블 객체는 반복할 수 있는 객체입니다(예: 배열).

이터러블 객체는 간단하고 효율적인 코드로 접근할 수 있습니다。

이터러블 객체는 다음과 같이 사용할 수 있습니다 for..of 루프는 반복하여 이터러션을 수행합니다。

for..of 루프

for..of 은 이터러블 객체의 요소를 순회하는 문장입니다。

문법

for (변수 of iterable) {
  // 실행할 코드 블록
}

반복

반복은 쉽게 이해할 수 있습니다。

이는 간단히 일련의 요소를 순회하는 것을 의미합니다。

다음은 몇 가지 간단한 예제입니다:

  • 문자열을 순회합니다
  • 배열을 순회합니다

문자열을 순회합니다

다음을 사용하여 for..of 문자열의 요소를 순회합니다:

예제

const name = "W3Schools";
for (const x of name) {
  // 실행할 코드 블록
}

직접 테스트해 보세요

배열을 순회합니다

다음을 사용하여 for..of 배열의 요소를 순회합니다:

예제 1

const letters = ["a","b","c"];
for (const x of letters) {
  // 실행할 코드 블록
}

직접 테스트해 보세요

예제 2

const numbers = [2,4,6,8];
for (const x of numbers) {
  // 실행할 코드 블록
}

직접 테스트해 보세요

Set을 순회합니다

다음을 사용하여 for..of Set의 요소를 순회합니다:

예제

const letters = new Set(["a","b","c"]);
for (const x of letters) {
  // 실행할 코드 블록
}

직접 테스트해 보세요

주의:Set과 Map은 후속 장에서 자세히 설명할 것입니다.

Map을 루프할 수 있습니다.

다음을 사용하여 for..of Map의 요소를 루프로 돌립니다:

예제

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
});
for (const x of fruits) {
  // 실행할 코드 블록
}

직접 테스트해 보세요

JavaScript 이터레이터

이터레이터 프로토콜은 객체에서 어떻게 값을 생성할지 정의합니다.일련의 값이터레이터

객체가 next() 되어버립니다.메서드를 호출할 때, 그것은이터레이터

next()

  • 메서드는 두 가지 속성을 포함하는 객체를 반환해야 합니다:
  • value(다음 값)
done(true 또는 false)

value

이터레이터가 반환하는 값.

done이 true이면 생략할 수 있습니다.

done

이터레이터가 완료되면 true입니다.

이터레이터가 새 값을 생성하면 false입니다.

주의:

기술적으로, 이터러블 객체는 Symbol.iterator 메서드를 구현해야 합니다.

문자열, 배열, TypedArray, Map 및 Set은 이터러블 객체입니다. 이들의 프로토타입 객체는 Symbol.iterator 메서드를 가지고 있습니다.

사용자 정의 이터러블 객체 next() 다음 예제는 자체적으로 끝나지 않는 사용자 정의 이터러블 객체를 보여줍니다. 매번 호출될 때마다

예제

모두 10, 20, 30, 40, ...을 반환합니다:
// 사용자 정의 이터러블 객체
  let n = 0;
  return {
    function myNumbers() {
      n += 10;
      next: function() {
    }
  };
}
return { value: n, done: false };
// 이터러블 객체를 생성
const n = myNumbers();
n.next(); // 10을 반환
n.next(); // 20을 반환

직접 테스트해 보세요

n.next(); // 30을 반환

문제는 다음과 같습니다: for..of 문을 지원하지 않습니다.

사용자 정의 이터러블 객체는 JavaScript의

JavaScript 이터러블 객체는 for..of 문을 지원하는 이터러블 객체를 가지고 있습니다. Symbol.iterator 의 객체.

Symbol.iterator는 반환 next() 메서드 함수.

다음 코드를 사용하여 이터러블 객체를 이터레이션할 수 있습니다:

for (const x of iterable}) { }

예제

// 객체를 생성합니다
myNumbers = {};
// 이터러블하게 만듭니다
myNumbers[Symbol.iterator] = function() {
  let n = 0;
  done = false;
  return {
    next() {
      n += 10;
      if (n == 100) { done = true; }
      return { value: n, done: done };
    }
  };
};
// 지금 for..of를 사용할 수 있습니다
for (const num of myNumbers) {
  // 임의 코드
}

직접 테스트해 보세요

Symbol.iterator 메서드는 for..of 자동 호출

하지만 우리는 그것을 수동으로 호출할 수도 있습니다:

예제

let iterator = myNumbers[Symbol.iterator]();
while (true) {
  const result = iterator.next();
  if (result.done) break;
  // 임의 코드
}

직접 테스트해 보세요