ES6 신규 유형 Symbol

4875 단어 ES6
1. Symbol 개술
JavaScript 의 기본 데이터 형식 은 6 가지 가 있 습 니 다. Undefined, Null, Boolean, String, Number, Object 입 니 다.
ES6 에 데이터 형식 이 추가 되 었 습 니 다. Symbol 은 유일한 값 을 표시 합 니 다. Symbol 의 가장 큰 용 도 는 대상 의 유일한 속성 명 을 정의 하 는 것 입 니 다.
ES5 의 대상 속성 명 은 모두 문자열 로 속성 명 이 충돌 하기 쉽다.다른 사람 이 제공 하 는 대상 을 사 용 했 지만 새로운 방법 (mixin 모드) 을 추가 하려 면 새로운 방법의 이름 이 기 존 방법 과 충돌 할 수 있 습 니 다.따라서 모든 속성의 이름 이 유일무이한 것 을 확보 하여 속성 명의 충돌 을 방지 해 야 한다.ES6 가 심 볼 을 도입 한 이유 다.
Symbol 값 은 Symbol 함 수 를 통 해 생 성 됩 니 다.
var symbol1 = Symbol();
var symbol2 = Symbol("Alice");
console.log(symbol1, symbol2) //   :Symbol() Symbol(Alice)

type: of 연산 자 는 Symbol 형식 값 에 사용 되 며, symbol 을 되 돌려 줍 니 다.
console.log(typeof Symbol("Alice")) //   :symbol

Symbol 형식의 값 은 유일한 값 입 니 다. Symbol 함수 의 매개 변 수 는 현재 Symbol 값 에 대한 설명 일 뿐 같은 매개 변수의 Symbol 함수 의 반환 값 은 같 지 않 습 니 다.
console.log(Symbol() === Symbol()); //   :false
console.log(Symbol("Alice") === Symbol("Alice")); //   :false

Symbol 은 구조 함수 가 아 닙 니 다. new Symbol 을 사용 하면 오류 가 발생 합 니 다 (Symbol 은 원본 형식의 값 이지 대상 이 아 닙 니 다).
var symbol = new Symbol(); //   :TypeError

Symbol 값 은 대상 이 아니 기 때문에 속성 을 추가 할 수 없습니다.
var symbol = Symbol();
symbol.name = "Alice"; //   :TypeError

Symbol 값 은 다른 유형의 값 과 연산 할 수 없습니다.
console.log(Symbol('Alice') + "Bruce"); //   

Symbol 값 은 문자열 로 표시 할 수도 있 고 불 값 으로 바 꿀 수도 있 지만 수치 로 바 꿀 수 없습니다.
var symbol = Symbol("Alice");
console.log(symbol.toString()); //   :Symbol(Alice)
console.log(Boolean(symbol)); //   :Symbol(Alice)
if (symbol)
	console.log("YES"); //   :Yes
console.log(Number(symbol)); //   :TypeError

2, 대상 속성 이름 의 Symbol
모든 Symbol 값 이 같 지 않 기 때문에 Symbol 값 은 대상 의 속성 명 에 사용 할 수 있 고 같은 이름 의 속성 이 나타 나 지 않도록 하 는 것 을 의미 합 니 다. 이것 은 한 대상 이 여러 모듈 로 구 성 된 경우 에 매우 유용 하 며 특정한 키 가 부주의 로 바 뀌 거나 덮어 쓰 는 것 을 방지 할 수 있 습 니 다.
대상 의 속성 명 은 두 가지 유형 이 있 을 수 있 습 니 다. 하 나 는 원래 문자열 이 고 다른 하 나 는 새로 추 가 된 Symbol 형식 입 니 다.속성 명 이 Symbol 유형 에 속 하 는 것 은 모두 유일무이한 것 으로 다른 속성 명 과 충돌 하지 않 을 것 을 보증 할 수 있 습 니 다.
괄호 구조 와 Object. defineProperty 를 통 해 대상 의 속성 명 을 Symbol 값 으로 지정 합 니 다.
방법 1:
var name = Symbol();
var obj = {
	[name]: "Alice"
};

방법 2:
var name = Symbol();
var obj = {};
obj[name] = "Alice";

방법 3:
var obj = {};
Object.defineProperty(obj, name, { value: 'Alice' });

대상 내부 에서 Symbol 값 으로 속성 을 정의 할 때 Symbol 값 은 괄호 안에 넣 어야 합 니 다. 괄호 에 넣 지 않 으 면 이 속성 이름 은 문자열 이지 대표 적 인 Symbol 값 이 아 닙 니 다.
var name = Symbol();
var obj1 = {
	[name]: "Alice"
};
var obj2 = {
	name: "Bruce"
};
console.log(obj1.name); //   :undefined
console.log(obj1[name]); //   :Alice
console.log(obj2.name); //   :Bruce
console.log(obj2[name]); //   :undefined

Symbol 값 이 대상 속성 명 일 때 점 연산 자 를 사용 할 수 없습니다.점 연산 자 뒤에 항상 문자열 이 있 기 때문에 name 이 표지 명 으로 가리 키 는 값 을 읽 지 않 습 니 다. 속성 명 은 Symbol 값 이 아 닌 문자열 입 니 다.
var obj = {};
var name = Symbol();
obj.name = 'Alice';
console.log(obj.name);
console.log(obj[name]);
console.log(obj['name']);

3. 대상 함수 이름 의 Symbol
var func = Symbol();
var obj = {
	func: function() {
		console.log("YES");
	}
};
obj.func(); //   :YES

4. 대상 속성 을 획득 하 는 두 가지 방법
1) Object. getOwnPropertySymbols () 방법
Symbol 형식의 속성 명 만 포함 하 는 배열 을 되 돌려 줍 니 다.
2) Object. getOwnPropertyNames () 방법
문자열 형식 만 포함 하 는 속성 이름 의 그룹 을 되 돌려 줍 니 다.
var obj = {};
var age = Symbol("age");
var job = Symbol("job");
obj[age] = "Alice";
obj[job] = "student";
obj.age = 23;
var symbols = Object.getOwnPropertySymbols(obj);
var names = Object.getOwnPropertyNames(obj);
console.log(symbols.length); //   :2
console.log(symbols); //   :[Symbol(age), Symbol(job)]
console.log(obj[symbols[0]]); //   :Alice
console.log(names.length); //   :1
console.log(obj[names[0]]); //   :23

5. Symbol. for () 와 Symbol. keyFor () 방법
1) Symbol. for () 방법
단일 모드 와 유사 합 니 다. 우선 이 매개 변 수 를 이름 으로 하 는 Symbol 값 이 있 는 지 전역 에서 검색 하고 있 으 면 Symbol 값 을 되 돌려 줍 니 다. 그렇지 않 으 면 이 매개 변 수 를 이름 으로 하 는 Symbol 값 을 새로 만 들 고 되 돌려 줍 니 다.
var symbol1 = Symbol.for('Alice');
var symbol2 = Symbol.for('Alice');
console.log(symbol1 === symbol2) //   :true

2) Symbol. keyFor () 방법
만 든 Symbol 형식 값 의 key 를 되 돌려 줍 니 다. 실질 적 으로 이 Symbol 이 만 들 어 졌 는 지 확인 하 는 것 입 니 다.
var symbol1 = Symbol.for("Alice");
console.log(Symbol.keyFor(symbol1)); //   :"Alice"
var symbol2 = Symbol("Alice");
console.log(Symbol.keyFor(symbol2)); //   :undefined

좋은 웹페이지 즐겨찾기