Heim > häufiges Problem > Ausführliche Erläuterung der Symbolverwendung

Ausführliche Erläuterung der Symbolverwendung

藏色散人
Freigeben: 2020-07-08 12:02:37
Original
14131 Leute haben es durchsucht

symbol ist ein neuer primitiver Datentyp, der der siebte Datentyp von JavaScript ist. Symbolwerte werden über die Symbolfunktion unter Verwendung der Syntax „let s = Symbol();typeof s;“ generiert. Dabei gibt typeof an, dass s ein Symboldatentyp ist.

Ausführliche Erläuterung der Symbolverwendung

So verwenden Sie Symbol()

Einführung: ES5-Objektattributnamen sind alle Zeichenfolgen, daher ist es einfach Wenn ein Projekt beispielsweise sehr groß ist und nicht von einer Person entwickelt wird, kann es zu Konflikten mit Variablennamen kommen. Es wäre großartig, wenn es einen eindeutigen Namen gäbe, sodass Konflikte mit Attributnamen grundsätzlich verhindert werden könnten . . Aus diesem Grund hat ES6 Symbol eingeführt.

ES6 führt einen neuen primitiven Datentyp ein, Symbol, der Einzigartigkeit darstellt. Es ist der siebte Datentyp von JavaScript. Symbolwerte werden über die Symbolfunktion generiert. Solange der Attributname zum Symboltyp gehört, ist er eindeutig und es kann garantiert werden, dass er nicht mit anderen Attributnamen in Konflikt steht.

let s = Symbol();
typeof s;
//"symbol"
Nach dem Login kopieren

Im obigen Code ist s ein eindeutiger Wert und typeof gibt an, dass s vom Symboldatentyp ist.

Hinweis: Das neue Schlüsselwort kann nicht vor der Symbolfunktion verwendet werden, da sonst ein Fehler gemeldet wird. Dies liegt daran, dass das Symbol ein primitiver Datentyp und kein Objekt ist und daher keine Attribute hinzugefügt werden können.

symbol kann eine Zeichenfolge als Parameter akzeptieren, die die Beschreibung des Symbols darstellt, hauptsächlich um die Unterscheidung bei der Anzeige auf der Konsole zu erleichtern.

var s1 = Symbol("foo");
var s2 = Symbol("bar");
s1 // Symbol("foo")
s2 // Symbol("bar")
s1.toString() // "Symbol(foo)"
s2.toString() // "Symbol(bar)
Nach dem Login kopieren

Dieser Parameter kann weggelassen werden Es wird nicht hinzugefügt, es wird auf der Konsole ausgegeben. Es ist nur so, dass die beiden Symbol() der Unterscheidung nicht förderlich sind und die Parameter hinzugefügt werden, um sie zu unterscheiden.

Zwei Symbole ohne Parameter sind beispielsweise nicht gleich, unabhängig davon, ob Parameter vorhanden sind oder nicht.

Symbole können nicht mit anderen Werten betrieben werden. Andernfalls wird ein Fehler gemeldet

// 没有参数的情况
var s1 = Symbol();
var s2 = Symbol();
s1 == s2 // false
// 有参数的情况
var s1 = Symbol("foo");
var s2 = Symbol("foo");
s1 == s2 // false
Nach dem Login kopieren

Symbole können zur Anzeige in eine Zeichenfolge oder einen booleschen Wert konvertiert werden, können jedoch nicht in eine Zahl umgewandelt werden

var s1 = Symbol("My Symbol");
"your symbol is" + s1;
// TypeError: can't convert symbol to string
`your symbol is ${s1}`
// TypeError: can't convert symbol to string
Nach dem Login kopieren

Da jedes Symbol anders ist, kann es als Bezeichner verwendet werden und als Attributname eines Objekts, um sicherzustellen, dass Attribute mit demselben Namen nicht angezeigt werden.

// 转为字符串
var s1 = Symbol("My Symbol");
String(s1) // "Symbol(My Symbol)"
s1.toString() // "Symbol(My Symbol)"
//转为布尔值
var s1 = Symbol();
Boolean(s1) //true
!s1 //false
if(s1) {
 //  ...  
}
//转为数值就会报错
Nach dem Login kopieren

Hinweis: Symbolwerte können den Punktoperator nicht verwenden, wenn sie als Attributnamen von Objekten verwendet werden Symbolwerte innerhalb eines Objekts müssen ebenfalls in eckige Klammern gesetzt werden

var mySymbol = Symbol();
//第一种写法
var a = {};
a[mySymbol] = "Hello!";
//第二种写法
var a = {
     [mySymbol]: "Hellow!"
}
//第三种写法
var a = {};
Object.defineProperty(a, mySymbol, { value: "Hellow!" });
//以上写法的结果都相同
a[mySymbol] // "Hellow!"
Nach dem Login kopieren

Symbol kann auch einen Satz von Konstanten definieren, um sicherzustellen, dass die Werte dieses Satzes von Konstanten ungleich sind

let s = Symbol();
let obj = {
    [s]: function(arg) {...}  
}
//如果s不放在[]中,该属性名就是字符串,而不是Symbol
//可以采用增强的方式在书写上面的代码
let s = Symbol();
let obj = {
    [s](arg) {...}
}
Nach dem Login kopieren

Der größte Vorteil der Verwendung von Symbolwerten für Konstanten besteht darin, dass kein anderer Wert mit ihnen übereinstimmen kann.

Magische Zeichenfolge eliminieren

Magische Zeichenfolge bezieht sich auf eine bestimmte Zeichenfolge oder Zahl, die mehrmals im Code vorkommt und eine starke Verbindung mit dem Code eingeht. Ein guter Codierungsstil sollte magische Zeichenfolgen eliminieren und ersetzen sie mit Variablen mit klarer Bedeutung.

const COLOR_RED = Symbol();
const COLOR_GREEN = Symbol();
function getComponent(color) {
    switch(color) {
        case: COLOR_RED:
               return "red";
        case: COLOR_GREEN:
              return "green";
        default:
              throw new Error("Undefind color")
    }  
}
Nach dem Login kopieren

Tringel ist in der obigen Zeichenfolge eine magische Zeichenfolge. Sie erscheint mehrmals und bildet eine starke Kopplung mit dem Code, was einer zukünftigen Wartung nicht förderlich ist.

function getArea(shape, options) {
     var area = 0;
     switch(shape) {
          case: "Tringel":     // 魔术字符串
              area = 5*options.width*options.height;
              break;
     }
     return area;
}
getArea("Tringel", {width: 100, height: 100});    // 魔术字符串
Nach dem Login kopieren

Es ist sehr gut geeignet, Symbol anstelle von

var shapeType = {
   triangle: "Tringel"
}
function getArea(shape, options) {
     var area = 0;
     switch(shape) {
          case: shapeType.triangle:     // 消除魔术字符串
              area = 5*options.width*options.height;
              break;
     }
     return area;
}
getArea(shapeType.triangle, {width: 100, height: 100});    //消除魔术字符串
Nach dem Login kopieren
zu verwenden

Weitere Informationen zu diesem Thema finden Sie auf der

PHP-Chinese-Website

!

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Symbolverwendung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage