📙ES6 문법공부
📌심볼(Symbol)
✏️식별자란?
변수, 함수, 객체, 클래스 등 프로그래밍에서 이름을 가진 모든 것을 지칭하는 용어이다.
코드를 작성할 때, 무언가를 식별할 수 있도록 붙인 이름라고 할 수 있다.
✨심볼이란?
Symbol() 함수가 반환하는 유일하고 변경 불가능한 원시값이다. 유일한 식별자를 만들 때 사용한다.
✏️원시값이란?
자바스크립트의 기본 데이터 유형으로, 변경되지 않는 단순한 값 자체를 의미한다. 객체처럼 참조를 사용하지 않고, 메모리상에서 값 자체로 저장이 된다. 따라서, 변수에 원시값을 할당하면, 변수에는 원시값 자체가 저장된다.
1.string(문자열)
2. number(숫자)
3. bigint(큰 정수)
4. boolean(불리언)
5. undefined
6. null
7. symbol(심볼)
✏️원시 자료형이란?
원시값을 가진 변수의 자료형을 말한다.
1.string(문자형)
2. number(정수형)
3. bigint(bigint형)
4. boolean(boolean형)
5. undefined(undefined형)
6. null(null형)
7. symbol(심볼형)
💡심볼 만드는 방법
new 연산자를 사용하지 않고, Symbol() 함수를 호출하여 심볼을 생성한다. 이때, 유일한 값을 반환한다. 아래 코드처럼, 심볼 a와 b가 출력된 건 똑같지만 실제로 일치 연산자와 동등 연산자로 확인해보면 false가 반환된다.
✨심볼 만들 때 설명 붙이기
Symbol() 함수를 호출할 때, 인자로 문자열로 된 설명을 넘겨줄 수 있다. 설명을 붙이면 해당 심볼의 용도나 의미를 쉽게 파악할 수 있기에 디버깅을 할 때 편하다. 다만, 해당 설명은 심볼 생성에는 어떠한 영향도 주지 않는다. 다시말해, 심볼은 이름(문자열로된 설명)이 같더라도 서로 다른 존재이다.
💡심볼의 이름 찾는 방법
전역 심볼이 아닌 심볼은 Symbol.keyFor() 메서드를 사용할 수 없다. 대신, description 속성을 사용하여 심볼의 이름을 알 수 있다.
✏️심볼은 객체가 아닌데 메서드와 속성을 사용할 수 있는 이유
자바스크립트는 심볼을 비롯한 원시 자료형에 접근할 때, 래퍼 객체(wrapper object)를 일시적으로 생성한다. 따라서 일시적으로 생성된 Symbol 객체를 통해 속성이나 메서드를 사용할 수 있다.
✨심볼형인 객체의 키
객체의 프로퍼티 키는 문자형이나 심볼형으로 만들 수 있다. 키로 심볼형을 사용할 경우, 다른 키와 절대 충돌하지 않는다.
✏️프로퍼티 키 자동형 변환
객체의 프로퍼티 키를 숫자형이나 불린형으로 정의해도, Object.keys()로 키를 불러오면 문자형으로 반환된다. 객체의 키에 접근할 때도 문자형으로 접근한다. 객체의 키가 심볼형이 아니면 무조건 문자형이다.
💡객체에 문자형 키를 추가할 때 생길 수 있는 문제
- 다른 사람이 만든 객체에서 이미 정의된 동일한 키로 프로퍼티를 추가하여 덮어쓸 수도 있다.
- 이를 피하기 위해서 프로퍼티의 키 이름을 길고 이상하게 만드는 것은 좋지 않다.
- 원복 객체가 for...in 문이나 Object.keys()로 순회하면서 데이터를 사용하고 있을 수도 있다. 따라서, 내가 추가한 프로퍼티가 언제, 어디서 나올지 예측 불가능 하다는 문제가 있다.
💡(해결책) 심볼형의 키를 객체에 추가하기
키를 심볼형으로 사용하면, 특정 객체의 원본 데이터는 건드리지 않고 속성을 추가할 수 있다. 따라서 객체에 유일한 프로퍼티를 추가할 때 심볼을 사용하자.
✨심볼형인 키를 건너뛰는 경우
Object.keys(), Object.values(), Object.entries() 객체의 프로퍼티를 순회하는 메서드는 키가 심볼형인 프로퍼티는 건너뛴다. 마찬가지로, for...in 반복문에서도 해당 프로퍼티를 건너뛴다.
✨숨겨진 Symbol key 보는 법
- Object.getOwnPropertySymbols() : 객체의 심볼형 키들만 보여준다.
- Reflect.ownKeys() : 심볼형 키를 포함한 객체의 모든 키를 보여준다.
Object.getOwnPropertySymbols()와 Reflect.ownKeys() 메서드는 심볼 키를 다루는 특별한 메서드로, 대부분의 라이브러리 내장 함수들은 이런 메서드를 사용하지 않는다.
✨Symbol.for() : 전역 심볼
전역 변수처럼 이름이 같으면 같은 객체를 가리켜야 할 때 Symbol.for()를 사용한다.
💡전역 심볼 특징
- 하나의 심볼만 보장받을 수 있다.
- 없으면 심볼을 만들고, 있으면 해당 심볼을 가져오기 때문이다.
- Symbol() 함수는 매번 다른 Symbol 값을 생성하지만, Symbol.for() 메서드는 최초로 심볼 하나를 생성한 뒤 심볼 이름이 같다면 동일한 Symbol 값을 공유한다.
- 전역 심볼은 Symbol.keyFor() 메서드를 통해서 심볼의 이름을 얻을 수 있다.
