[ js ] symbolFrontend/js2023. 10. 2. 20:08
Table of Contents
반응형
Symbol
원시 값을 반환하는 내장 객체이며 , 객체에 속성을 추가할 경우 혹은 고유한 키를 부여하여 다른 코드와 충돌하지 않게 하기 위하여 사용됩니다.
심볼 생성시 고유한 Symbol 생성
const sym1 = Symbol();
const sym2 = Symbol("bug");
const sym3 = Symbol("bug");
위 코드는 세개의 심볼을 생성하지만 , 심볼 호출 시 새로운 심볼을 생성합니다.
Symbol("bug") === Symbol("bug"); // false
그러므로 위 코드와 같이 엄격한 비교 연산자로 비교시 "false"의 결과값을 리턴하는 것을 확인할 수 있습니다.
const sym = new Symbol(); // TypeError
또한 , 새로운 심볼 값을 만들때 명시적으로 래퍼 객체를 생성하는 걸 방지합니다.
Symbor.keyFor
const sym1 = Symbol.for("bug");
console.log(`${Symbol.keyFor(sym1)}`);
-- > bug
const sym2 = Symbol("bug");
console.log(${Symbol.keyFor(sym2)});
-- > undefined
Symbol.for() 함수로 생성된 Symbol() 은 키를 가지고 있지만 , Symbol() 함수로 생성된 Symbol()은 키가 존재하지 않습니다.
typeof Symbol
typeof Symbol() === "symbol";
typeof Symbol("bug") === "symbol";
typeof Symbol.iterator === "symbol";
심볼 타입 변환시 다음과 같은 유의사항이 존재합니다.
1. 심볼을 숫자 변환시 TypeError
2. 엄격하지 않은 동등 연산 시 , Object(sym) == sym // true
3. Symbol("bug") + "bar" // TypeError -> 심볼을 문자열로 변환할 수 없습니다.
for ... in Symbol
const obj = {};
obj[Symbol("bug")] = "bug";
obj[Symbol.for("bug2")] = "bug2";
obj["bug3"] = "bug3";
obj.bug4 = "bug4";
for (const i in obj) {
console.log(i);
// "bug3" "bug4"
}
심볼은 for ... in 순회에 열거되지 않습니다.
JSON.stringify(Symbol)
JSON.stringify({[Symbol("bug")] : "bug"});
// '{}'
JSON.stringify() 는 심볼 키 속성을 완전히 무시합니다.
Object.getOwnPropertySymbols()
const obj = {};
const sym = Symbol();
obj[sym] = "symValue";
obj.bug = "bugValue";
Object.getOwnPropertySymbols(obj);
// [Symbol()]
Reflect.ownKeys(obj);
// [ "bugValue" , Symbol() ]
객체의 Symbol 타입인 키를 추출하기 위해서는 Object.getOwnPropertySymbols() 함수를 사용합니다.
모든 객체의 키를 배열로 추출해야 할 경우에는 Reflect.ownKeys() 함수를 사용합니다.
반응형
'Frontend > js' 카테고리의 다른 글
[ js ] Immutability(변경불가성) (0) | 2024.05.09 |
---|---|
[ js ] ES5 vs ES6 차이 (0) | 2024.04.22 |
@IT grow. :: IT grow.
#IT #먹방 #전자기기 #일상
#개발 #일상