Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung des Symboltyps, der versteckten Attribute und der globalen Registrierung von JavaScript

Detaillierte Erläuterung des Symboltyps, der versteckten Attribute und der globalen Registrierung von JavaScript

WBOY
WBOYnach vorne
2022-06-02 11:50:342779Durchsuche

Dieser Artikel vermittelt Ihnen relevantes Wissen über Javascript, das hauptsächlich Probleme im Zusammenhang mit Symboltypen, versteckten Attributen und der globalen Registrierung behandelt, einschließlich der Beschreibung von Symboltypen, und Symbol wird nicht implizit in Zeichenfolgen konvertiert. Wenn Sie weitere Fragen haben , werfen wir einen Blick darauf. Ich hoffe, es wird für alle hilfreich sein.

Detaillierte Erläuterung des Symboltyps, der versteckten Attribute und der globalen Registrierung von JavaScript

【Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend

Symboleinführung

Der Typ Symbol ist ein spezieller Typ in JavaScript Typ, insbesondere insofern, als sich alle Werte des Typs Symbol voneinander unterscheiden. Wir können „Symbol“ verwenden, um einen eindeutigen Wert darzustellen. Das Folgende ist ein Beispiel für die Erstellung eines Symbol-Objekts: Symbol类型是JavaScript中的一种特殊的类型,特殊在所有的Symbol类型值都互不相同。我们可以使用“Symbol”来表示唯一的值,下面是创建Symbol对象的案例:

let id = Symbol();

这样我们就创建了一个Symbol类型的值,并把这个值存储在了变量id中。

Symbol类型的描述

我们在创建一个Symbol类型变量的时候,可以在参数中传入一些秒属性的字符串,用于描述这个变量的用途信息。
例如:

let id1 = Symbol('狂拽酷炫吊炸天的小明的id');
let id2 = Symbol('低调奢华有内涵的婷婷的id');

Symbol类型在任何时候都是不同的,即使他们拥有相同的描述信息,描述只是一个标签,除此之外就没有别的用途了,例如:

let id1 = Symbol('id');
let id2 = Symbol('id');
console.log(id1==id2);//false

这个标签存在的意义,个人认为和Symbol不能直观的看到内部具体值的特性有关,通过添加一个描述信息,让我们对变量的用途有更直观的了解。

Symbol不会隐式转字符串

JavaScript中的大多数类型都可以直接转换成字符串类型输出,所以我们不能直观的看到它的值到底是什么,例如我们可以直接用alert(123)把数字123转换成字符串弹出。
但是Symbol类型比较特殊,它不能直接转换,例如:

let id = Symbol();
alert(id);//报错,不能把Symbol类型转为字符串

JavaScript中的Symbol类型不能转成字符串是由于其内在的防治语言混乱的“语言保护”机制,因为字符串和Symbol在本质上有着区别,不应该将其中一个转换成另一个。

试想一下,如果Symbol可以转为字符串,那么它就变成了一个生成独一无二字符串的函数,就不再具备独立数据类型的必要。

如果我们真的想知道Symbol变量的值,我们可以使用.toString()方法,如下所示:

let id = Symbol('this is identification');
console.log(id.toString());//Symbol(this is identification);

或者使用.description属性,获取描述信息:

let id = Symbol('加油,奥利给');
console.log(id.description);//加油,奥利给”

Symbol类似作为对象的属性键

根据JavaScript的规范,只有两种类型的值可以作为对象的属性键:

  1. 字符串
  2. Symbol

如果使用其他类型,则会隐式的转为字符串类型。对象的键在前面的章节有详细的介绍,这里不再重复。

创建Symbol键

Symbol作为键值有两种方法:
例1:

let id = Symbol('id');
let user = {};
user[id] = 'id value';//添加Symbol键
console.log(user[id]);//id value

例2:

let id = Symbol('id');
let user = {
	[id]:'id value',//注意这里的方括号	
};
console.log(user[id]);

以上两个案例展示了在对象中插入Symbol类型作为键的用法,需要注意的是,在访问属性时需要使用obj[id]而不是obj.id,因为obj.id代表的是obj[‘id’]

如果我们使用Symbol作为对象的键会有什么效果呢?

for…in中被跳过

Symbol非常明显的一个特征是,如果对象中使用Symbol作为键,那么使用for…in语句是访问不到Symbol类型的属性的。

举个例子:

let id = Symbol('id');
let user = {
	name : 'xiaoming',
	[id] : 'id',
};
for (let key in user) console.log(user[key]);

执行以上代码,得到以下结果:

> xiaoming

可以发现,[id]对象的值没有被打印出来,说明在对象属性列表中,使用for … in会自动忽略Symbol类型的键。

同样的,Object.keys(user)也会忽略所有的Symbol类型的键。

这样的特性能带来非常有用的效果,例如我们可以创建只能自己能用的属性。

虽然我们没有办法直接获取到Symbol键,但是Object.assign方法能够复制所有的属性:

let id = Symbol();
let obj = {
    [id] : '123'
}

let obj2 = Object.assign({},obj);
console.log(obj2[id]);

这并不影响Symbol的隐藏属性,因为复制后的对象仍然无法获取Symbol

let tool = {//张三写好了的Tool
    usage : "Can do anything",
}

let name = Symbol("My tool obj");
tool[name] = "This is my tool";
console.log(tool[name]);
Auf diese Weise erstellen wir einen Wert vom Typ Symbol und put Dieser Wert wird in der Variablen id gespeichert. 🎜

Beschreibung des Symboltyps

🎜Wenn wir eine Variable vom Typ Symbol erstellen, können wir einige Zeichenfolgen mit Sekundenattributen in den Parametern übergeben Beschreiben Sie den Zweck dieser Variable.
Zum Beispiel: 🎜
let tool = {//张三写好了的Tool
    usage : "Can do anything",
}

tool.usage = "Boom Boom";
console.log(tool.usage);
🎜Symbol-Typen sind jederzeit unterschiedlich, auch wenn sie die gleichen Beschreibungsinformationen haben, die Beschreibung ist nur eine Beschriftung und hat keinen anderen Zweck
let id1 = Symbol.for('id');//注册表内没有名为id的Symbol,创建并返回
let id2 = Symbol.for('id');//注册表内已有名为id的Symbol,直接返回
console.log(id1===id2);//true
🎜Die Bedeutung dieses Tags hängt mit der Tatsache zusammen, dass Symbol den internen spezifischen Wert nicht intuitiv erkennen kann. Durch das Hinzufügen von Beschreibungsinformationen können wir ein intuitiveres Verständnis für die Verwendung von Variablen erlangen . 🎜

Symbol wird nicht implizit in einen String konvertiert

🎜Die meisten Typen in JavaScript können direkt in die Ausgabe vom Typ String konvertiert werden, sodass wir dies nicht intuitiv tun können Sehen Sie, was der Wert ist. Wir können beispielsweise alert(123) direkt verwenden, um die Zahl 123 in eine Zeichenfolge umzuwandeln und anzuzeigen.
Der Typ Symbol ist jedoch etwas Besonderes und kann nicht direkt konvertiert werden. Beispiel: 🎜
let id = Symbol.for('id');//注册表内没有名为id的Symbol,创建并返回
let name = Symbol.keyFor(id);
console.log(name);//id
🎜 Der Typ Symbol in JavaScript kann nicht konvertiert werden Da Zeichenfolgen und Symbol von Natur aus unterschiedlich sind, sollte das eine nicht in das andere umgewandelt werden. 🎜🎜Stellen Sie sich vor, wenn Symbol in eine Zeichenfolge konvertiert werden kann, wird es zu einer Funktion, die eine eindeutige Zeichenfolge generiert, und es ist kein unabhängiger Datentyp erforderlich. 🎜🎜Wenn wir den Wert der Variablen Symbol wirklich wissen wollen, können wir die Methode .toString() wie folgt verwenden: 🎜
let id = Symbol('id');//局部Symbol
let name = Symbol.keyFor(id);
console.log(name);//undefined
🎜oder verwenden. Beschreibung Attribut, Beschreibungsinformationen abrufen: 🎜rrreee🎜Symbol ähnelt dem Attributschlüssel eines Objekts🎜🎜Gemäß den Spezifikationen von JavaScript können nur zwei Arten von Werten verwendet werden als Attributschlüssel eines Objekts: 🎜
  1. String
  2. Symbol
🎜Wenn andere Typen verwendet werden, werden diese implizit in den String-Typ konvertiert. Objektschlüssel wurden in den vorherigen Kapiteln ausführlich vorgestellt und werden hier nicht wiederholt. 🎜

Symbolschlüssel erstellen

🎜Es gibt zwei Möglichkeiten, Symbol als Schlüsselwert zu verwenden:
Beispiel 1:🎜rrreee🎜Beispiel 2 :🎜 rrreee🎜Die beiden oben genannten Fälle zeigen die Verwendung des Typs Symbol als Schlüssel in ein Objekt. Beachten Sie, dass Sie beim Zugriff auf Eigenschaften obj[id] verwenden müssen. anstelle von obj.id, da obj.id obj['id'] darstellt. 🎜🎜Was wird der Effekt sein, wenn wir Symbol als Schlüssel des Objekts verwenden? 🎜

for…in wird übersprungen

🎜SymbolEine sehr offensichtliche Funktion ist, dass, wenn Symbol im Objekt As verwendet wird Wenn Sie einen Schlüssel verwenden, können Sie mit der Anweisung for...in nicht auf Attribute des Typs Symbol zugreifen. 🎜🎜Zum Beispiel: 🎜rrreee🎜Führen Sie den obigen Code aus und erhalten Sie die folgenden Ergebnisse:🎜rrreee🎜Es kann festgestellt werden, dass der Wert des [id]-Objekts nicht ausgedruckt wird, was darauf hinweist, dass im Wenn Sie in der Objektattributliste for … in verwenden, werden Schlüssel vom Typ Symbol automatisch ignoriert. 🎜🎜In ähnlicher Weise ignoriert Object.keys(user) auch alle Schlüssel vom Typ Symbol. 🎜🎜Eine solche Funktion kann sehr nützliche Effekte mit sich bringen, wir können beispielsweise Attribute erstellen, die nur wir selbst nutzen können. 🎜🎜Obwohl wir keine Möglichkeit haben, den Schlüssel Symbol direkt zu erhalten, kann die Methode Object.assign alle Attribute kopieren: 🎜rrreee🎜Dies hat keine Auswirkungen auf Symbol code>s versteckte Eigenschaft, da das kopierte Objekt den Schlüssel <code>Symbol immer noch nicht erhalten kann. 🎜

隐藏自定义属性

由于Symbol既不能直接转为字符串,我们没有办法直观的获得它的值,又不能通过for … in获得对象的Symbol属性,也就是说,如果没有Symbol变量本身,我们就没有办法获得对象内部的对应属性。

因此,通过Symbol类型的键值,我们可以隐藏属性,这些属性只能我们自己访问,其他人都看不到我们的属性。

举个例子:

我们在开发的过程中,需要和同事“张三”合作,而这个张三创建了一个非常好用的工具ToolTool是一个对象类型,我们想白嫖张三的Tool,并在此基础上添加一些自己的属性。

我们就可以通过添加Symbol类型的键:

let tool = {//张三写好了的Tool
    usage : "Can do anything",
}

let name = Symbol("My tool obj");
tool[name] = "This is my tool";
console.log(tool[name]);

以上示例展示了如何在别人写好的对象上添加自己的属性,那么为什么要使用Symbol类型而不是常规的字符串呢?

原因如下:

  1. 对象tool是别人写好的代码,原则上我们不应该去修改别人的代码,这样会造成风险;
  2. 避免命名冲突,我们直接使用字符串很有可能会和别人原有的属性键冲突,造成严重的后果;
  3. 使用Symbol永远不会发生命名冲突,因为Symbol都是不同的;
  4. 别人无法访问Symbol类型的键,相当于不会和别人的代码冲突;

错误示范:
如果我们不使用Symbol类型,很可能出现以下情况:

let tool = {//张三写好了的Tool
    usage : "Can do anything",
}

tool.usage = "Boom Boom";
console.log(tool.usage);

以上代码由于重复使用”usage”,从而重写了原属性,会造成对象原功能异常。

Symbol全局注册表

所有的Symbol变量都是不同的,即使他们有用相同的标签(描述)。
有些时候,我们希望通过一个字符串名称(标签),访问同一个Symbol对象,例如我们在代码的不同地方访问相同的Symbol

JavaScript会维护一个全局的Symbol注册表,我们可以通过向注册表中插入Symbol对象,并为对象起一个字符串名称访问该对象。

向注册表插入或者读取Symbol对象需要使用Symbol.for(key)方法,如果注册表中有名为key的对象,就返回该对象,否则就插入新对象再返回。

举个例子:

let id1 = Symbol.for('id');//注册表内没有名为id的Symbol,创建并返回
let id2 = Symbol.for('id');//注册表内已有名为id的Symbol,直接返回
console.log(id1===id2);//true

我们通过Symbol.for(key)就能以全局变量的方式使用Symbol对象,并使用一个字符串标记对象的名字。

相反的,我们还可以使用Symbol.keyFor(Symbol)反向的从对象获取名称。

举个例子:

let id = Symbol.for('id');//注册表内没有名为id的Symbol,创建并返回
let name = Symbol.keyFor(id);
console.log(name);//id

Symbol.keyFor()函数只能用在全局Symbol对象上(使用Symbol.for插入的对象),如果用在非全局对象上,就会返回undefined

举个例子:

let id = Symbol('id');//局部Symbol
let name = Symbol.keyFor(id);
console.log(name);//undefined

系统Symbol

JavaScript有许多系统Symbol,例如:

  • Symbol.hasInstance
  • Symbol.iterator
  • Symbol.toPrimitive

它们各有用途,我们在后面的会逐步介绍道这些独特的变量。

总结

  1. Symbol对象的值是唯一的;
  2. Symbol可以添加一个标签,并通过标签在全局注册表中查询对象的实体;
  3. Symbol作为对象的键无法被for … in探测到;
  4. 我们可以通过Symbol到全局注册表访问全局的Symbol对象;

但是,Symbol并不是完全隐藏的,我们可以通过Object.getOwnPropertySymbols(obj)获取对象所有的Symbol,或者通过Reflect.ownKeys(obj)获取对象所有的键。

【相关推荐:javascript视频教程web前端

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Symboltyps, der versteckten Attribute und der globalen Registrierung von JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen