정처기 감자정처기 감자
SW 설계디자인패턴

이터레이터 iterator 패턴 - 타입스크립트 예시

SW설계디자인패턴
읽는데 8분 소요
처음 쓰인 날: 2025-09-01
마지막 수정일: 2025-09-01
조회수: —

요약

이터레이터 iterator 패턴을 타입스크립트 코드와 함께 알아봅니다.

이터레이터 (Iterator) 패턴 요약

패턴 종류핵심 키워드
이터레이터 (Iterator)컬렉션의 내부 구조를 노출하지 않고 요소에 순차적으로 접근하는 방법을 제공
이터레이터 패턴 감자
이터레이터 패턴 감자

이터레이터 (Iterator) 패턴

이터레이터 패턴은 배열, 리스트, 트리 등과 같은 컬렉션(Collection) 객체의 내부 표현(구조)을 외부에 노출시키지 않고, 그 요소들을 순차적으로 접근할 수 있는 방법을 제공하는 패턴입니다.

가장 쉬운 비유는 'TV 리모컨의 채널 버튼' 입니다. 우리는 '다음' 버튼(▶)을 누르기만 하면 다음 채널로 넘어갑니다. 우리는 방송국 주파수 목록이 어떻게 저장되어 있는지, 어떤 자료구조로 관리되는지 전혀 알 필요가 없습니다. 이터레이터 패턴은 이처럼 컬렉션의 복잡한 내부를 숨기고, '다음 것(next)', '끝났는가(done)'와 같은 단순한 인터페이스만으로 데이터에 접근하게 해주는 역할을 합니다.

사실 현대 프로그래밍 언어에서는 이 패턴이 이미 깊숙이 내장되어 있습니다. 자바스크립트의 for...of 루프, 배열의 map, filter 메서드, 자바의 Iterator 인터페이스 등이 모두 이터레이터 패턴의 구현체입니다.

기본 구조

  • Iterator: 이터레이터의 공통 인터페이스입니다. 보통 다음 요소를 가져오는 next() 메서드와 순회가 끝났는지 확인하는 hasNext() (또는 next()의 반환값에 done 속성을 포함) 메서드를 정의합니다.
  • ConcreteIterator: Iterator 인터페이스를 구현한 구체적인 클래스입니다. 특정 컬렉션에 맞춰 순회 로직을 구현하며, 현재 순회 중인 위치를 추적합니다.
  • Aggregate: 이터레이터를 생성하는 createIterator() 메서드를 가지는 컬렉션의 공통 인터페이스입니다.
  • ConcreteAggregate: Aggregate 인터페이스를 구현한 구체적인 컬렉션 클래스입니다. createIterator() 메서드 내에서 자신에게 맞는 ConcreteIterator의 인스턴스를 생성하여 반환합니다.

예시: 자바스크립트 이터러블 프로토콜 구현하기

자바스크립트/타입스크립트에서는 for...of 구문을 사용하기 위해 이터레이터 패턴을 직접 구현할 수 있습니다. [Symbol.iterator]라는 특별한 메서드를 가진 객체를 '이터러블(iterable)'이라고 부릅니다.

알파벳 순서대로 단어를 순회하는 간단한 단어장(WordCollection) 클래스를 만들어 보겠습니다.

typescript
코드 하이라이팅 중…

클라이언트는 WordCollection 내부에서 단어들이 어떻게 words 배열에 저장되는지, 정렬이 어떻게 일어나는지 전혀 알 필요가 없습니다. 그저 for...of라는 표준적인 방법으로 컬렉션의 요소에 하나씩 접근할 수 있습니다. 이것이 바로 이터레이터 패턴이 제공하는 '접근'과 '구현'의 분리입니다.

이터레이터 패턴 중요 키워드

  • 컬렉션의 내부 구조를 노출하지 않고 요소에 순차적으로 접근합니다.
  • 접근 방식과 컬렉션 구현을 분리하여 결합도를 낮춥니다.
  • 하나의 컬렉션에 대해 다양한 순회 방식을 제공할 수 있습니다. (예: 정방향, 역방향 이터레이터)
  • for...of, map, filter 등 현대 언어의 많은 기능이 이 패턴을 기반으로 합니다.

정처기 실기 기출 문제

문제를 불러오는 중이에요.
문제를 불러오는 중이에요.
메가커피와 함께, 홈페이지 개선에 참여하세요! ☕
혹시 이용에 불편한 점이나 개선이 필요한 부분을 발견하셨나요? 댓글로 알려주시면 더 나은 감자가 될 수 있어요! 🥔 제보해주신 모든 분께 메가커피 기프티콘을 드립니다! (본인 이메일로 댓글 달아주셔야해요~)

관련 글

(42개)
제목태그업데이트시험
디자인패턴 정보처리기사 실기 모의 시험
디자인패턴SW설계디자인패턴
2026-07-10응시
추상 팩토리 abstract factory 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2026-10-20-
빌더 builder 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-02-
디자인패턴23개
제목태그업데이트시험
디자인패턴 정보처리기사 실기 모의 시험
디자인패턴SW설계디자인패턴
2026-07-10응시
추상 팩토리 abstract factory 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2026-10-20-
빌더 builder 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-02-
팩토리 메서드 factory method 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-11-03-
프로토타입 prototype 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2026-10-20-
싱글톤 singleton 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-02-
책임 연쇄 chain of responsibility 패턴 - 타입스크립트 예시
디자인패턴SW설계디자인패턴
2025-11-03-
커맨드 command 패턴 - 타입스크립트 예시
디자인패턴SW설계디자인패턴
2025-09-01-
인터프리터 interpreter 패턴 - 타입스크립트 예시
디자인패턴SW설계디자인패턴
2025-09-01-
중재자 mediator 패턴 - 타입스크립트 예제
디자인패턴SW설계디자인패턴
2026-10-20-
메멘토 memento 패턴 - 타입스크립트 예시
디자인패턴SW설계디자인패턴
2025-10-29-
옵저버 observer 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
상태 state 패턴 - 타입스크립트 예시
디자인패턴SW설계디자인패턴
2025-09-01-
전략 strategy 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
템플릿 메서드 template method 패턴 - 타입스크립트 예시
디자인패턴SW설계디자인패턴
2025-09-01-
방문자 Visitor 패턴 - 타입스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
어댑터 adapter 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-02-
브릿지 bridge 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
컴포지트 composite 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
데코레이터 decorator 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
퍼사드 facade 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
플라이웨이트 flyweight 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2025-09-01-
프록시 proxy 패턴 - 자바스크립트 예제
디자인패턴SW설계디자인패턴
2026-10-20-
SW설계19개
제목태그업데이트시험
릴리스 노트 작성 항목
제품 소프트웨어 패키징SW설계제품 소프트웨어 패키징
2026-06-26-
UI 정보처리기사 실기 모의 시험
UI/UXSW설계UI/UX
2026-05-04응시
애자일(Agile) 방법론
애자일SW설계방법론애자일
2026-10-01-
코딩 컨벤션과 표기법
코딩 스타일SW설계코딩 스타일
2026-10-01-
소프트웨어 비용 산정 기법
비용 산정SW설계비용 산정
2026-10-01-
비기능 요구사항
요구사항SW설계요구사항
2026-10-16-
리팩토링(Refactoring)
리팩토링SW설계리팩토링
2026-10-01-
UI 설계 원칙
UI/UXSW설계UI/UX
2026-10-01-
UI 종류 (CLI·GUI·NUI·OUI·VUI)
UI/UXSW설계UI/UX
2026-10-01-
SW 설계 왕감자 정보처리기사 실기 모의 시험
SW설계SW설계
2025-11-04응시
앱 설계(디자인패턴, 응집도-결합도,객체지향) 정보처리기사 실기 모의 시험
앱설계SW설계앱설계
2025-10-08응시
객체 지향 설계 원칙 - SOLID
객체지향SW설계앱설계객체지향
2026-10-20-
럼바우 객체 모델링 - 객(정)동기
객체지향SW설계앱설계객체지향
2026-10-20-
UML 정보처리기사 실기 모의 시험
UMLSW설계UML
2025-10-08응시
소프트웨어 아키텍처 4+1 뷰 모델
UMLSW설계UML
2025-09-26-
UML 클래스 다이어그램의 6가지 관계
UMLSW설계UML
2026-10-11-
UML 다이어그램
UMLSW설계UML
2026-10-20-
소프트웨어 모듈 응집도와 결합도
응집도/결합도SW설계앱설계응집도/결합도
2026-10-20-
정보처리기사 실기를 위한 디자인 패턴 암기 방법
앱설계SW설계앱설계
2026-10-16-

댓글

댓글을 불러오고 있어요
정처기 감자정처기 감자

정보처리기사 합격
도와줄라고 하는 감자

실기 이론

  • 이론 공부법
  • DB
  • 네트워크/OS
  • SW 설계
  • SW 개발
  • 보안/신기술

시험 응시

  • 시험장 찾기
  • 원서 접수
  • 응시자격 서류

요약 PDF

  • 26년 3회 이론 압축
  • 26년 3회 코딩 압축
  • 초압축 25년 3회
  • 압축 25년 3회

기출문제

  • 전체 기출문제
  • 25년 3회
  • 25년 2회
  • 문제 포럼

감자 이용권

  • 이용권 구매

실기 이론

  • 이론 공부법
  • DB
  • 네트워크/OS
  • SW 설계
  • SW 개발
  • 보안/신기술

시험 응시

  • 시험장 찾기
  • 원서 접수
  • 응시자격 서류

요약 PDF

  • 26년 3회 이론 압축
  • 26년 3회 코딩 압축
  • 초압축 25년 3회
  • 압축 25년 3회

기출문제

  • 전체 기출문제
  • 25년 3회
  • 25년 2회
  • 문제 포럼

감자 이용권

  • 이용권 구매
© 2025 재현기획개발. All rights reserved.
  • 정처기 감자의 시작
  • 업데이트 로그
  • 개인정보 처리방침
  • 이용약관
상호명 : 재현기획개발 / 주소: 서울특별시 영등포구 영등포로 150, 지하1층 108호 L145 가라지(당산동1가, 생각공장 당산) / 대표: 김재현 / 전화: 010-8158-7127 / 통신판매업신고: 제2025-서울영등포-1569호 / 이메일: contact@edugamja.com / 사업자등록번호: 573-51-00999