34장 이터러블

Eriniss·2023년 1월 2일
0
post-thumbnail

34.1 이터레이션 프로토콜

이터레이션 프로토콜은 순회 가능한 데이터 컬렉션을 만들기 위해 ES6에서 도입하였다.

34.1.1 이터러블

이터러블 프로토콜을 준수한 객체를 이터러블이라 한다. 이터러블 프로토콜은 Symbol.iterator를 프로퍼티 키로 사용한 메서드를 직접 구현하거나 프로토타입 체인을 통해 상속받은 객체를 말한다.

const arr = [1, 2, 3]

// 배열은 Array.prototype의 Symbol.iterator 메서드를 상송받는 이터러블이다.
console.log(Symbol.iterator in array); // true

for (const item of array) {
  console.log(item);
}

34.2 빌트인 이터러브

이터레이션 프로토콜을 준수한 객체인 빌트인 이터러블은 다음과 같다

  • Array
  • String
  • Map
  • Set
  • TypedArray
  • arguments
  • DOM 컬렉션

34.3 for... of 문

for... of 문은 이터러블을 순회하면서 이터러블의 요소를 변수에 할당한다.

for... in 문은 객체의 프로토타입 체인 상에 존재하는 모든 프로토타입의 프로퍼티 중에서 프로퍼티 어트리뷰트 [[Enumerable]]의 값이 true인 프로퍼티를 순회하며 열거한다.

for (const i of [1, 2, 3]) {
  // i에 순차적으로 1 ,2 , 3이 할당된다.
  console.log(i); // 1 2 3
}

34.4 이터러블과 유사 배열 객체

유사 배열 객체는 마치 배열처럼 인덱스로 프로퍼티 값에 접근할 수 있고 length 프로퍼티를 갖는 객체를 말한다. 대표적으로 String이 있다.

const intro = {
  0: 1,
  1: 2,
  2: 3,
  length: 3
}

// 유사 배열 객체는 length를 가지기 때문에 for 문으로 순회할 수 있다.
for(let i = 0; i < arrayLike.length; i++) {
  console.log(arrayLike[i]); // 1 2 3
}

//하지만 for... of 문으로는 순회가 불가능 하다.
for(const i of arrayLike) {
  console.log(i); // Error
} 

34.5 이터레이션 프로토콜의 필요성

이터레이션 프로토콜은 데이터 소비자와 데이터 공급자를 연결하는 인터페이스의 역할을 한다.

쉽게 말해서 이터레이션 프로토콜은 순회 가능한 데이터 콜렉션을 하나로 통일하는 규약이다. ES6 이전까지는 이러한 규칙이 없었다. 순회가 불가능한 유사 배열 객체는 이터러블이라 할 수 없다.

0개의 댓글