JavaScript

JavaScript - 4. 심볼(Symbol)

wooyit 2022. 11. 18. 08:24

 

JavaScript의 데이터 타입 중 하나인 심볼(Symbol)에 대해 알아보겠습니다. JavaScript Symbol은 유일하고 변경 불가능한 데이터 타입이며, 주로 충돌 위험이 없는 객체 속성의 키로 사용됩니다.

1. JavaScript Symbol 생성

JavaScript에서 심볼은 Symbol() 함수를 통해 생성할 수 있습니다. 심볼은 각각 유일하므로, 같은 함수로 여러 심볼을 생성하더라도 서로 다릅니다.

javascript

const a = Symbol();
const b = Symbol();
console.log(a === b); // false

위의 예에서는 두 개의 심볼 'a'와 'b'를 생성하고 비교하였습니다. 두 심볼이 동일한 Symbol() 함수로 생성되었음에도 불구하고, 두 심볼은 서로 다르기 때문에 결과는 'false'입니다.

2. JavaScript Symbol과 속성 키

심볼은 객체 속성의 키로 사용할 수 있습니다. 이런 경우, 해당 속성은 심볼을 통해 만들어진 고유의 속성이 되며, 일반적인 방법으로는 접근할 수 없습니다.

javascript

const id = Symbol('id');
const user = {
  name: 'Mike',
  age: 30,
  [id]: 'myId'
}
console.log(Object.keys(user)); // ["name", "age"]

이 예에서 Object.keys() 함수는 객체의 속성 키를 배열로 반환하지만, 심볼 키는 무시됩니다.

3. 전역 심볼과 Symbol.for()

전역 심볼 레지스트리는 특정 키와 연결된 심볼을 생성하고 재사용하는 기능을 제공합니다. Symbol.for(key) 함수는 주어진 키를 갖는 심볼을 반환합니다. 키에 해당하는 심볼이 이미 있으면 그 심볼을 반환하고, 그렇지 않으면 새로운 심볼을 생성합니다.

javascript

const id1 = Symbol.for('id');
const id2 = Symbol.for('id');
console.log(id1 === id2); // true

이 예에서 Symbol.for() 함수는 'id'라는 키를 갖는 심볼을 두 번 요청했지만, 동일한 심볼을 반환했습니다. 따라서 두 심볼은 동일합니다.

4. JavaScript Symbol 활용 예제

심볼은 객체의 속성을 숨기는 데 유용하게 사용할 수 있습니다. 이는 심볼로 생성된 속성이 일반적인 속성 열거에서 제외되기 때문입니다.

javascript

// 다른 개발자가 만들어 놓은 객체
const user = {
  name: 'Mike',
  age: 30
}

// 내가 작업
const showName = Symbol("showName");
user[showName] = function() {
  console.log(this.name);
};

// 사용자가 접속하면 보는 메세지
for (let key in user) {
  console.log(`His ${key} is ${user[key]}.`);
}

user[showName](); // Mike

이 예에서 showName 심볼을 키로 가지는 속성은 객체를 순회하는 반복문에서 무시되므로, 이 메소드를 호출하려면 명시적으로 user[showName]()와 같이 호출해야 합니다.

 

심볼은 JavaScript에서 강력한 도구입니다. 유일한 속성 키를 생성하여 객체를 안전하게 확장하거나, 충돌 없이 객체를 조작하는 데 사용할 수 있습니다. [공식문서]

 

Symbol - JavaScript | MDN

Symbol 은 생성자가 symbol 원시 값을 반환하는 내장 객체입니다. symbol 원시 값은 심볼 값, 혹은 짧게 심볼이라고만 부르며 고유함이 보장됩니다. 심볼은 객체에 속성을 추가할 때 고유한 키를 부여

developer.mozilla.org

 

이러한 심볼의 기능을 이해하고 잘 활용하면 JavaScript 코드를 더욱 효율적으로 작성할 수 있습니다. 다음 번에는 다른 JavaScript의 주요 기능에 대해 더 깊이 있게 살펴보도록 하겠습니다.[블러그]

 

Development

Development Today's development 2023 TypeScript 제네릭 Generics [2023] Tomcat 버전을 7.0에서 9.0으로 올리고 프로젝트를 실행하니 발생한 오류와 해결 방법 2023 Node.js 기본 사용 방법: 설치부터 간단한 실행까지 2

www.wooyit.com