Explication détaillée de l'utilisation du symbole

symbol est un nouveau type de données primitif, qui est le septième type de données de JavaScript. Les valeurs de symbole sont générées via la fonction Symbol, en utilisant la syntaxe "let s = Symbol();typeof s;", où typeof indique que s est un type de données de symbole.

Comment utiliser Symbol()

Introduction : les noms d'attributs d'objet ES5 sont tous des chaînes, donc c'est facile pour provoquer des conflits de noms d'attributs. Par exemple, si un projet est très volumineux et n'est pas développé par une seule personne, cela peut provoquer des conflits de noms de variables. Ce serait formidable s'il y avait un nom unique, afin que les conflits de noms d'attributs puissent être fondamentalement évités. . C'est pourquoi ES6 a introduit Symbol.

ES6 introduit un nouveau type de données primitif, Symbol, qui représente l'unicité. Il s'agit du septième type de données de JavaScript. Les valeurs des symboles sont générées via la fonction Symbole. Tant que le nom d'attribut appartient au type Symbole, il est unique et peut être garanti qu'il n'entre pas en conflit avec d'autres noms d'attribut.

let s = Symbol();
typeof s;
//"symbol"

Dans le code ci-dessus, s est une valeur unique et typeof indique que s est du type de données symbole.

Remarque : le mot-clé new ne peut pas être utilisé avant la fonction symbol, sinon une erreur sera signalée car le symbole est un type de données primitif, pas un objet, donc les attributs ne peuvent pas être ajoutés.

le symbole peut accepter une chaîne comme paramètre, qui représente la description du symbole, principalement pour le rendre facile à distinguer lorsqu'il est affiché sur la console

var s1 = Symbol("foo");
var s2 = Symbol("bar");
s1 // Symbol("foo")
s2 // Symbol("bar")
s1.toString() // "Symbol(foo)"
s2.toString() // "Symbol(bar)

Ce paramètre peut être omis. il n'est pas ajouté, il sera affiché sur la console. C'est juste que les deux Symbol() ne favorisent pas la distinction, et les paramètres sont ajoutés pour les distinguer.

Deux symboles sans paramètres ne sont pas égaux. Par exemple,

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

ne sont pas égaux, qu'il y ait ou non des paramètres

Le symbole ne peut pas être utilisé avec d'autres valeurs, sinon, ce sera Erreur

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

Le symbole peut être converti en chaîne ou en valeur booléenne pour l'affichage, mais il ne peut pas être converti en nombre

// 转为字符串
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) {
 //  ...  
}
//转为数值就会报错

Comme chaque symbole est différent, il peut être utilisé comme identifiant et comme nom d'attribut de l'objet. , garantissant que les attributs portant le même nom n'apparaîtront pas

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

Remarque : les valeurs de symbole ne peuvent pas utiliser l'opérateur point lorsqu'elles sont utilisées comme noms d'attribut d'objets. Valeurs des symboles à l'intérieur d'un objet, elles doivent également être placées entre crochets

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

Le symbole peut également définir un ensemble de constantes pour garantir que les valeurs de cet ensemble de constantes sont inégales

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")
    }  
}

.

Le plus grand avantage de l'utilisation des valeurs de symboles pour les constantes est qu'aucune autre valeur ne peut leur correspondre de la même manière.

Éliminer la chaîne magique

La chaîne magique fait référence à une chaîne ou à un nombre spécifique qui apparaît plusieurs fois dans le code et forme un couplage fort avec le code. Un bon style de codage doit éliminer les chaînes magiques et les remplacer. les avec des variables avec des significations claires.

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});    // 魔术字符串

Dans la chaîne ci-dessus, Tringel est une chaîne magique. Elle apparaît plusieurs fois et forme un couplage fort avec le code, ce qui n'est pas propice à une maintenance future.

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});    //消除魔术字符串

Il est très approprié d'utiliser Symbol au lieu de

var shapeType = {
   triangle: Symbol()
}

Pour plus de connaissances connexes, veuillez visiter le Site Web PHP chinois !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!