JavaScript

Symbol

쭈녁 2024. 1. 21. 23:03

 

Symbol

심볼은 Symbol 함수를 호출 해 생성할 수 있다. 생성되는 심볼은 변경 불가능한 원시 타입이다.

Symbol은 유일한 식별자로써 안에 가지고 있는 값이 같은 두 객체를 === 비교 하여도 같지 않다는 결과를 얻을 수 있다.

 

const a = Symbol();
const b = Symbol();

a===b; //-> false
a==b; //-> false

const id = Symbol('id');
const id2 = Symbol('id');
id === id2// false

const id = Symbol('id');
const user = {
	name : 'Mike',
	age : 30,
	[id] : 'myid'
}
Object.keys(user); // ["name","age"] Symbol은 제외됨
Object.getOwnPropertySymbols(user) // -> [Symbol(id)]

 

Symbol.for() : 전역심볼

심볼을 생성하는 함수 중 하나로 하나의 심볼만 보장받을 수 있다.

같은 값의 심볼이 없으면 만들고 , 있으면 해당 심볼을 가져옴

const a = Symbol.for('id');
const b = Symbol.for('id');

a===b; //-> true
a==b; //-> true

Symbol.keyFor(a) // "id"

const a = Symbol('id');

a.description; // "id"

 

Symbol for문 내 사용

const user = {
  name: "kim",
  age: 30,
}

const showName = Symbol("show name");

user.[showName] = function(){
  console.log(this.name);
};

for(let key in user){
  console.log(`his ${key} is ${user[key]}.`)
}

/*
"his name is kim."
"his age is 30."
*/

 

1. user라는 객체를 생성한다.

이 객체는 name에 "kim", age에 30이라는 값을 갖는다.

 

2. Symbol을 생성하고 이를 showName이라는 변수에 할당한다.

Symbol은 JavaScript의 원시 데이터 타입 중 하나로, 고유하고 변경 불가능 하다.

 

4. user 객체에 showName 심볼을 키로 가지는 새로운 속성을 추가한다. this.name을 콘솔에 출력하는 함수를 작성한다..

 

5. 루프를 사용하여 user 객체를 순회하며 각 속성의 키와 값을 콘솔에 출력하는 함수를 실행한다.

 

6. 이 코드를 실행하면 showName 심볼로 추가한 속성은 출력되지 않습니다.

왜냐하면 for루프는 심볼 키를 가진 속성을 건너뛰기 때문이다.

 

 

'JavaScript' 카테고리의 다른 글

await 와 async  (0) 2024.05.28
Object 메서드 정리  (0) 2024.01.12
변수와 생성자 함수  (1) 2024.01.05
JavaScript에서 Object 및 this  (0) 2023.12.27
자바스크립트 기본  (0) 2023.12.16