surf core js:構成部品(Symbol)


JavaScriptはオブジェクトのpropertyキーで、文字型と素子型のみが許可されます.
Propertyキーを使用して構成部品の値を表示し、構成部品キーを使用するメリットを理解します.

Symbol


シンボル(シンボル)は、一意の識別子(一意の識別子)を作成するために使用します.
Symbol()を使用して、構成部品値を作成します.
// id는 새로운 심볼이 됩니다.
let id = Symbol();
構成部品を作成するときに、構成部品名という説明(description)を追加することもできます.構成部品名は、デバッグ時に便利です.
// 심볼 id에는 "id"라는 설명이 붙습니다.
let id = Symbol("id");
構成部品は一意のデータ型であるため、同じ説明の構成部品を複数作成しても、各構成部品の値は異なる.
構成部品に貼り付けられた説明(構成部品名)は、内容に影響を与えないラベルとしてのみ機能します.
2つの説明が同じ構成部品を同じ演算子(==)と比較した場合、falseが返されることが決定されます.
let id1 = Symbol("id");
let id2 = Symbol("id");

alert(id1 == id2); // false

構成部品は自動的に文字形式に変換されません。


javascriptでは、暗黙的な変換が自由です.
これがalert関数がパラメータとしてほとんどの値を受信できる理由です.
しかし、記号は例外です.構成部品タイプの値は、暗黙的に他のデータ型に変換(自動変換)されません.
次の例ではalertがエラーを引き起こします.
let id = Symbol("id");
alert(id); // TypeError: Cannot convert a Symbol value to a string
文字列と素子が根本的に異なるため、偶然でも互いのタイプに変換できない.
JAvascriptでは、構成部品の他のタイプへの変換を防止する「言語レベルの保護(language guard)」が提供されています.
構成部品を出力する必要がある場合は、次の操作を行います.TOString()メソッドを明確に呼び出せばよい.
description propertyを使用する場合は、説明のみを表示することも可能です.
let id = Symbol("id");
alert(id.toString()); // "Symbol(id)"가 얼럿 창에 출력됨
alert(id.description); // "id"

隠し番組


コンポーネントを使用して、非表示プログラムを作成します.
非表示プロパティは、外部コードからアクセスできず、値を上書きできないプロパティです.
userという名前のオブジェクトがサードパーティコードから複数存在し、userを使用していくつかの操作を実行する必要があると仮定します.
識別子は構成部品を使用して作成されます.
let user = { // 서드파티 코드에서 가져온 객체
  name: "John"
};

let id = Symbol("id");

user[id] = 1;

alert( user[id] ); // 심볼을 키로 사용해 데이터에 접근할 수 있다.
文字列「id」を鍵として使用できますが、なぜSymbol(「id」)を使用しますか?
userはサードパーティコードからのオブジェクトであり,新しいpropertyを勝手に追加することはできない.ただし、エレメントはサードパーティコードからアクセスできないため、エレメントを使用する場合、サードパーティコードは知らないうちにuserに識別子を付与することができる.
ユーザソースのサードパーティコード、現在作成中のスクリプト、サードパーティスクリプトが互いのコードを知らない場合は、ユーザを識別する必要があります.
3番目のスクリプトでは、次のようにSymbol(「id」)を使用して専用識別子を作成できます.
// ...
let id = Symbol("id");

user[id] = "제3 스크립트 id 값";
構成部品に一意性があるため、作成した識別子は、3番目のスクリプトで作成した識別子と競合しません.
構成部品ではなく文字列「id」を使用して識別子を作成すると、競合する可能性があります.
let user = { name: "John" };

// 문자열 "id"를 사용해 식별자를 만들었다.
user.id = "스크립트 id 값";

// 만약 제3의 스크립트가 우리 스크립트와 동일하게 문자열 "id"를 이용해 식별자를 만들었다면

// 의도치 않게 값이 덮어 쓰여서 우리가 만든 식별자는 무의미해진다.
user.id = "제3 스크립트 id 값"

Symbols in a literal


オブジェクト文字{...}オブジェクトの作成を使用する場合は、カッコで構成部品キーを作成する必要があります.
let id = Symbol("id");

let user = {
  name: "John",
  [id]: 123 // "id": 123은 안됨
};
id: 123と入力すると、文字列「id」はエレメントidではなくキーになります.

構成部品はfor...inから除外されます

let id = Symbol("id");
let user = {
  name: "John",
  age: 30,
  [id]: 123
};

for (let key in user) alert(key); // name과 age만 출력되고, 심볼은 출력되지 않는다.

// 심볼로 직접 접근하면 잘 작동한다.
alert( "직접 접근한 값: " + user[id] );
Object.「キー(user)には、キーが構成部品であるPropertyも含まれません.」この「シンボル属性の非表示」と呼ばれる原則により、外部スクリプトまたはライブラリがシンボルキーを持つシンボルにアクセスできなくなります.
Object.assignは、キーが構成部品であるpropertyを排除することなく、オブジェクト内のすべてのpropertyをコピーします.
let id = Symbol("id");
let user = {
  [id]: 123
};

let clone = Object.assign({}, user);

alert( clone[id] ); // 123
矛盾しているように見えますが、これは意図的に設計されています.オブジェクトをコピーまたはマージする際には、通常idなどの要素を含むすべてのプログラムを使用することが望ましいため、このように設計されています.

グローバル構成部品


前述したように、素子は名称が同じであっても独立したものと見なされる.ただし、同じ名前の構成部品が同じオブジェクトを指す場合もあります.
アプリケーションは、コンポーネント「id」を使用して特定のプログラムにアクセスする必要があると仮定します.
グローバルシンボルレジストリは、このような状況のために作成されます.グローバル構成部品レジストリに構成部品を作成してアクセスすると、同じ名前の場合は常に同じ構成部品が返されます.
レジストリの構成部品を読み込むか、新しい構成部品を作成するにはSymbolを使用します.for(key)を使えばいいです.
このメソッドを呼び出すとkeyというエレメントが返されます.条件を満たす構成部品がレジストリにない場合は、新しい構成部品Symbol(key)を作成し、レジストリに格納します.
// 전역 레지스트리에서 심볼을 읽습니다.
let id = Symbol.for("id"); // 심볼이 존재하지 않으면 새로운 심볼을 만듭니다.

// 동일한 이름을 이용해 심볼을 다시 읽습니다(좀 더 멀리 떨어진 코드에서도 가능합니다).
let idAgain = Symbol.for("id");

// 두 심볼은 같습니다.
alert( id === idAgain ); // true

Symbol.keyFor


Symbol.keyFor(sym)を使用して名前(description)を取得します.
// 이름을 이용해 심볼을 찾음
let sym = Symbol.for("name");
let sym2 = Symbol.for("id");

// 심볼을 이용해 이름을 얻음
alert( Symbol.keyFor(sym) ); // name
alert( Symbol.keyFor(sym2) ); // id
Symbol.keyForは、グローバル構成部品レジストリを検索することによって、その構成部品の名前を取得します.
検索範囲はグローバル構成部品レジストリであるため、非グローバル構成部品では使用できません.パラメータがグローバル構成部品でない場合、システムmbol.keyForは未定義を返します.
グローバル構成部品ではないすべての構成部品にdescription propertyがあります.一般的な構成部品から名前を取得する場合はdescription propertyを使用します.
let globalSymbol = Symbol.for("name");
let localSymbol = Symbol("name");

alert( Symbol.keyFor(globalSymbol) ); // name, 전역 심볼
alert( Symbol.keyFor(localSymbol) ); // undefined, 전역 심볼이 아님

alert( localSymbol.description ); // name

Reference

  • ko.javascript.info