- 이터레이터를 사용하여 컬렉션의 요소들에 접근하는 디자인 패턴
const mp = new Map()
mp.set('a' , 1)
mp.set('b' , 2)
mp.set('c' , 3)
const st = new Set()
st.add(1)
st.add(2)
st.add(3)
for(let a of mp) console.log(a)
for(let b of st) console.log(b)- 서로 다른 구조인 set과 map임에도 똑같은 for a of b라는 이터레이터 프로토콜을 통해 순회하는 것을 볼 수 있음.
이터레이터 프로토콜
- 이터러블한 객체들을 순회할 때 쓰이는 규칙
이터러블한 객체
- 반복 가능한 객체로 배열을 일반화한 객체
실무에서 어떻게 활용할 수 있을까?
이터레이터 패턴은 자바스크립트에서 다양한 곳에서 활용될 수 있습니다. 예를 들면 다음과 같습니다.
- 데이터 집합을 반복하는 경우: 이터레이터 패턴은 배열, 맵, 셋 등의 데이터 집합을 반복하고, 각 요소에 접근하는 것을 단순화할 수 있습니다.
- 비동기 작업을 처리하는 경우: 비동기 작업의 결과를 처리하는 데에도 이터레이터 패턴을 활용할 수 있습니다. 예를 들어, 프로미스를 반환하는 함수를 이터레이터로 래핑하여, 비동기 작업의 결과를 순차적으로 처리할 수 있습니다.
- 컬렉션을 정렬하는 경우: 이터레이터 패턴은 정렬을 위해 사용될 수 있습니다. 이터레이터를 통해 컬렉션의 각 요소를 접근하고, 정렬 알고리즘을 적용할 수 있습니다.
- 커스텀 이터레이터를 생성하는 경우: 이터레이터 패턴은 개발자가 직접 커스텀 이터레이터를 생성하여 객체의 내부 상태를 노출하지 않고, 객체의 요소에 접근할 수 있도록 해줍니다.
따라서 이터레이터 패턴은 자바스크립트에서 다양한 상황에서 활용될 수 있으며, 코드의 가독성과 유지 보수성을 높여줄 수 있습니다.
그냥 반복문을 활용하면 이터레이터 패턴이라고 볼 수 있을 것 같은데?
반복문과 이터레이터 패턴은 유사하지만, 미묘한 차이점이 있습니다.
일반적인 for 반복문을 사용하면 배열의 인덱스를 직접 사용하여 배열의 요소에 접근합니다. 이 경우 배열의 내부 구조를 직접 노출하고, 배열의 요소를 순서대로 접근하고 있음을 명시하지 않습니다.
하지만 이터레이터 패턴을 사용하면 배열의 내부 구조를 노출하지 않고, 배열의 요소를 순서대로 접근할 수 있습니다. 이터레이터 패턴은 객체의 내부에서 next() 메소드를 호출하여, 각 요소를 순서대로 반환하는 방식으로 동작합니다. 이렇게 함으로써, 객체의 내부 구조를 노출하지 않고, 요소에 접근할 수 있으며, 이는 코드의 가독성과 유지 보수성을 높여줍니다.
또한, 이터레이터 패턴은 객체를 반복하는 방법을 표준화하고, ES6에서 도입된 for...of 루프를 사용하여 반복할 수 있습니다. 이는 반복문과 달리, 객체의 내부 구조를 명시하지 않고, 요소에 순서대로 접근할 수 있으며, 이는 코드의 가독성과 유지 보수성을 높여줍니다.
따라서, 반복문과 이터레이터 패턴은 유사하지만, 이터레이터 패턴은 객체의 내부 구조를 노출하지 않고, 요소에 접근하는 것을 명시적으로 지원하는 패턴입니다.
chat을 이용해 확인해본 결과 for… of를 이용해 배열의 내부구조를 노출하지 않고 배열의 요소에 접근하는 장점을 가지는 패턴이라고 볼 수 있겠음.
