Introduction aux connaissances liées aux symboles dans ES6 (exemple de code)

Le contenu de cet article est une introduction aux connaissances liées aux symboles dans ES6 (exemples de code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

symbole est un type introduit dans es6 Il appartient également à la catégorie des types primitifs (chaîne, nombre, booléen, nul, non défini, symbole)

basique

<.>

let name = Symbol('xiaohesong')
typeof name // 'symbol'
let obj = {}
obj[name] = 'xhs'
console.log(obj[name]) //xhs

symbole pour

Cette chose est partageable. Lors de sa création, il vérifiera si le symbole de cette clé est trouvé globalement. S'il existe, le symbole sera renvoyé directement. n'existe pas, il sera créé et placé en enregistrement global.

Le partage mentionné ici est un partage global, similaire à la portée mondiale, et est partagé dans l'ensemble de l'environnement

let uid = Symbol.for("uid");
let object = {
    [uid]: "12345"
};

console.log(object[uid]);       // "12345"
console.log(uid);               // "Symbol(uid)"

let uid2 = Symbol.for("uid");

console.log(uid === uid2);      // true
console.log(object[uid2]);      // "12345"
console.log(uid2);              // "Symbol(uid)"

symbol keyfor

let uid = Symbol.for("uid");
console.log(Symbol.keyFor(uid));    // "uid"

let uid2 = Symbol.for("uid");
console.log(Symbol.keyFor(uid2));   // "uid"

let uid3 = Symbol("uid");
console.log(Symbol.keyFor(uid3));   // undefined

uid3 n'existe pas dans le registre global. symbole partagé. La clé correspondante ne peut donc pas être obtenue. On voit qu'il s'agit d'obtenir la clé correspondante

le symbole ne peut pas être forcé à convertir

let uid = Symbol('uid')
uid + ''

Une erreur sera signalée. ici Selon la spécification, il convertira l'uid en chaîne et l'ajoutera. Si vous voulez vraiment ajouter, vous pouvez d'abord ajouter String(uid), puis ajouter, mais pour le moment, cela semble n'avoir aucun sens.

Obtenir la clé du symbole dans obj

let uid = Symbol('uid')
let obj = {
    [uid]: 'uid'
}

console.log(Object.keys(obj)) // []
console.log(Object.getOwnPropertyNames(obj)) // []
console.log(Object.getOwnPropertySymbols(obj)) // [Symbol(uid)]

ES6 ajoute la méthode Object.getOwnPropertySymbols pour cela.

Avez-vous l'impression que les symboles sont rarement utilisés ? En fait, il y en a encore beaucoup utilisés en interne dans es6.

Symbol.hasInstance

Chaque fonction a cette méthode. Peut-être que vous n'êtes pas très familier avec cette méthode, mais c'est en fait ce que fait instanceof. C'est vrai, es6 réécrit cette méthode pour vous.

function Xiao(){}
const xiao = new Xiao
xiao instanceof Xiao // true

En fait, es6 fait ça pour vous

Xiao[Symbol.hasInstance](xiao)

Il s'agit d'une méthode interne et ne prend pas en charge la réécriture. Bien sûr, nous pouvons la réécrire sur le prototype.

Object.definePrototype(Xiao, Symbol.hasInstance, {
   value: (v) : Boolean(v)
})
const x = new Xiao
x instanceof Xiao //true
0 instanceof Xiao //false
1 instanceof Xiao //true

Vous pouvez constater que nous le réécrivons pour indiquer si la valeur correspondante est de type booléen.

Symbol.isConcatSpreadable

Ceci est différent des autres propriétés dans la mesure où il n'existe pas par défaut sur certains objets standard. Utilisez simplement

let objs = {0: 'first', 1: 'second', length: 2, [Symbol.isConcatSpreadable]: true}
['arrs'].concat(objs) //["arrs", "first", "second"]

Symbol.toPrimitive

qui est plus utile lors de la conversion de type, l'objet essaiera de se convertir au type d'origine, via

. des prototypes de types standards existent. Lorsque toPrimitive effectue une conversion de type,
sera obligé d'appeler un paramètre. Dans la spécification, ce paramètre est appelé toPrimitive. Ce paramètre a trois valeurs ('number', 'string', 'default'. ) l'un d'eux. hintComme son nom l'indique,
renvoie string, string renvoie number, et la valeur par défaut n'est pas spécifiée, la valeur par défaut. numberAlors, quelle est la situation par défaut ? Dans la plupart des cas, la valeur par défaut est le mode numérique. (Sauf pour la date, son état par défaut est considéré comme le mode chaîne)
En fait, peu de gens appellent l'état par défaut lors de la conversion de type. Comme (
, ==) ou lors du passage de paramètres aux paramètres de construction de +. Date

• Le comportement du mode numérique dans le cas numérique (priorité de haut en bas)

• Premier appel valueOf, s'il s'agit d'un type primitif , Puis reviens.

• Si la valeur précédente n'est pas une valeur primitive, essayez d'appeler toString. Si c'est une valeur primitive, retournez

• If. ni l'un ni l'autre n'existe, alors il suffit de signaler une erreur

• mode chaîne Dans le cas des chaînes, le comportement est légèrement différent (priorité de haut en bas)

• Appelez d'abord toString , si c'est la valeur d'origine, puis retournez

• Si la valeur précédente n'est pas la valeur d'origine, essayez d'appeler valueOf, si c'est la valeur d'origine, puis revenez

• Lance une erreur

Eh bien, cela semble un peu déroutant, oui, laissez-moi vous expliquer le code.

let obj = {
    valueOf: function(){console.log('valueOf')},
    toString: function(){console.log('toString')}
}
// console.log value is
obj + 2 //valueOf
obj == 2 // valueOf
Number(obj) // valueOf
String(obj) // toString

Grâce à la sortie ci-dessus, vous pouvez constater que dans la plupart des cas, valueOf est appelé en premier

Y compris le cas par défaut, sa valeur par défaut est le mode numérique appelé, et la plupart d'entre eux sont appelés dans le. En mode numérique, vous pouvez constater que toString est le mode qui appelle la chaîne. Vous pouvez donc penser qu’il s’agit essentiellement d’un mode numérique, à moins qu’il ne s’agisse d’un mode chaîne.
Pas très clair sur ce mode d'appel ? C'est bon, es6 expose cette méthode interne au monde extérieur, nous pouvons la réécrire et afficher le type de l'indice. Venez

function Temperature(degrees) {
    this.degrees = degrees;
}

Temperature.prototype[Symbol.toPrimitive] = function(hint) {
    console.log('hint is', hint)
};

let freezing = new Temperature(32);

freezing + 2 // ..
freezing / 2 // ..
...

les types ci-dessus, vous pouvez l'essayer.

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!