es6에서 기호의 기능은 무엇입니까

es6에서 기호의 역할: 1. 속성 이름으로 사용됩니다. 기호는 속성에 중복된 이름이 없으며 클래스 외부에서도 액세스할 수 있도록 보장하는 고유한 값을 나타냅니다. 새로운 기본 데이터 유형이며 구문은 "const name=Symbol("value")"입니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, ECMAScript 버전 6.0, Dell G3 컴퓨터.

es6에서 기호의 역할은 무엇인가요?

ES6에서는 고유한 값을 나타내는 새로운 기본 데이터 유형인 기호를 도입합니다. 가장 큰 용도는 객체의 고유한 속성 이름을 정의하는 것입니다.

숫자, 문자열, 부울, 객체, null 및 정의되지 않음 외에도 ES6 데이터 유형에는 기호도 추가됩니다.

기본 사용법

Symbol은 객체가 아닌 기본 데이터 유형이므로 Symbol 함수 스택은 새 명령을 사용할 수 없습니다. 새로 생성된 기호에 대한 설명을 제공하기 위해 문자열을 매개변수로 허용할 수 있습니다. 이 설명은 콘솔에 표시되거나 쉽게 구별할 수 있도록 문자열로 사용할 수 있습니다.

let sy = Symbol("KK");
console.log(sy);   // Symbol(KK)
typeof(sy);        // "symbol"
 
// 相同参数 Symbol() 返回的值不相等
let sy1 = Symbol("kk"); 
sy === sy1;       // false

속성 이름으로

Usage

각 Symbol의 값이 동일하지 않기 때문에 해당 속성이 중복되는 이름이 없도록 하기 위해 Symbol을 객체의 속성 이름으로 사용합니다.

기호는 객체 속성 이름으로 사용할 수 없습니다. 연산자를 사용해야 하며 대괄호를 사용해야 합니다. . 연산자 뒤에 문자열이 오기 때문에 기호 값 sy 속성이 아닌 문자열 sy 속성을 얻습니다.

let syObject = {};
syObject[sy] = "kk";
 
syObject[sy];  // "kk"
syObject.sy;   // undefined

Notes

Symbol 값을 속성 이름으로 사용하는 경우 해당 속성은 private 속성이 아닌 public 속성이므로 클래스 외부에서 접근이 가능합니다. 그러나 for...in 및 for...of의 루프에는 나타나지 않으며 Object.keys() 및 Object.getOwnPropertyNames()에 의해 반환되지도 않습니다. 객체의 Symbol 속성을 읽으려면 Object.getOwnPropertySymbols() 및 Reflect.ownKeys()를 통해 가져올 수 있습니다.

let syObject = {};
syObject[sy] = "kk";
console.log(syObject);
 
for (let i in syObject) {
  console.log(i);
}    // 无输出
 
Object.keys(syObject);                     // []
Object.getOwnPropertySymbols(syObject);    // [Symbol(key1)]
Reflect.ownKeys(syObject);                 // [Symbol(key1)]

상수 정의

ES5에서 문자열을 사용하여 상수를 표현하세요. 예를 들면 다음과 같습니다.

const COLOR_RED = "red";
const COLOR_YELLOW = "yellow";
const COLOR_BLUE = "blue";

하지만 문자열을 사용한다고 해서 상수가 고유하다는 보장은 없으므로 몇 가지 문제가 발생할 수 있습니다.

그러나 기호를 사용하여 상수를 정의하면 이 상수 집합의 값이 동일하도록 보장됩니다. Symbol을 사용하여 위의 예를 수정합니다.

const COLOR_RED = Symbol("red");
const COLOR_YELLOW = Symbol("yellow");
const COLOR_BLUE = Symbol("blue");
 
function ColorException(message) {
   this.message = message;
   this.name = "ColorException";
}
function getConstantName(color) {
    switch (color) {
        case COLOR_RED :
            return "COLOR_RED";
        case COLOR_YELLOW :
            return "COLOR_YELLOW ";
        case COLOR_BLUE:
            return "COLOR_BLUE";
        default:
            throw new ColorException("Can't find this color");
    }
}
 
try {
   
   var color = "green"; // green 引发异常
   var colorName = getConstantName(color);
} catch (e) {
   var colorName = "unknown";
   console.log(e.message, e.name); // 传递异常对象到错误处理
}

Symbol의 값은 고유하므로 동일한 값을 가진 상수가 없으므로 스위치가 코드에서 예상한 대로 실행됩니다.

【관련 추천: javascript 비디오 튜토리얼, web front-end】

위 내용은 es6에서 기호의 기능은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!