[JavaScript 문법] 31일차: 심볼과 이터레이터

Symbol 타입

Symbol은 ES6에서 도입된 원시 데이터 타입으로, 유일한 식별자를 만들 때 사용됩니다. Symbol은 주로 객체의 속성 키로 사용되며, 이름이 충돌할 염려 없이 고유한 속성을 정의할 수 있습니다.

기본 사용법

let symbol1 = Symbol('description');
let symbol2 = Symbol('description');

console.log(symbol1 === symbol2); // false
console.log(symbol1.toString()); // 'Symbol(description)'

객체의 심볼 속성

Symbol을 사용하여 객체에 고유한 속성을 추가할 수 있습니다.

예제

let obj = {};
let sym = Symbol('uniqueKey');

obj[sym] = 'value';

console.log(obj[sym]); // 'value'
console.log(Object.keys(obj)); // []
console.log(Object.getOwnPropertySymbols(obj)); // [Symbol(uniqueKey)]

심볼의 주요 용도

1. 고유한 객체 속성 키: 다른 속성과 충돌하지 않는 고유한 속성을 정의할 수 있습니다.
2. 내장 심볼 사용: JavaScript의 내장 심볼을 사용하여 객체의 기본 동작을 변경할 수 있습니다.

내장 심볼

ES6에서 제공하는 여러 내장 심볼을 사용하면 객체의 특정 동작을 커스터마이징할 수 있습니다.

예제

let obj = {
  [Symbol.iterator]() {
    let step = 0;
    const iterator = {
      next() {
        step++;
        if (step <= 3) {
          return { value: step, done: false };
        }
        return { value: undefined, done: true };
      }
    };
    return iterator;
  }
};

for (let value of obj) {
  console.log(value); // 1, 2, 3
}

이터러블과 이터레이터

이터러블(iterable)은 Symbol.iterator 메서드를 가지고 있으며, 이 메서드는 이터레이터를 반환합니다. 이터레이터(iterator)는 next 메서드를 가지고 있으며, 이 메서드는 { value, done } 객체를 반환합니다.

이터러블 객체

이터러블 객체는 Symbol.iterator 메서드를 구현하여 이터레이터를 반환해야 합니다.

예제

let iterable = {
  [Symbol.iterator]() {
    let step = 0;
    return {
      next() {
        step++;
        if (step <= 3) {
          return { value: step, done: false };
        } else {
          return { value: undefined, done: true };
        }
      }
    };
  }
};

for (let value of iterable) {
  console.log(value); // 1, 2, 3
}

이터레이터 객체

이터레이터 객체는 next 메서드를 구현하여 { value, done } 객체를 반환합니다.

예제

function createIterator(items) {
  let i = 0;
  return {
    next() {
      let done = i >= items.length;
      let value = !done ? items[i++] : undefined;
      return { value, done };
    }
  };
}

let iterator = createIterator([1, 2, 3]);

console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }

이터러블과 이터레이터의 장점

1. 순회 프로토콜 구현: 이터러블/이터레이터 프로토콜을 사용하여 커스텀 객체를 순회할 수 있습니다.
2. 유연한 순회 방식: for...of 문법을 사용하여 간결하고 직관적으로 순회할 수 있습니다.
3. 내장 이터러블 지원: 배열, 문자열, Map, Set 등 내장 객체가 이터러블을 지원합니다.

결론

Symbol과 이터러블/이터레이터는 JavaScript에서 객체의 고유한 속성을 정의하고, 순회 가능한 데이터를 쉽게 처리할 수 있도록 도와주는 중요한 기능입니다. 이번 글에서는 Symbol 타입, 객체의 심볼 속성, 내장 심볼, 이터러블과 이터레이터의 개념과 사용법에 대해 배웠습니다. 다음 글에서는 제너레이터에 대해 알아보겠습니다.

다음 글에서 만나요!