The article directories

    • What is a Symbol?
    • Application scenarios
    • Matters needing attention

What is a Symbol?

Symbol is a new data type added in ES6 that represents unique values. In ES5, we divided data types into basic data types (string, number, Boolean, undefined, NULL) and reference data types (Object). In ES6, the Symbol data type was added to the basic data type.

Why is there such a data type?

//You are given a defined object var obj = {name:"xiaoqiang",
    showName: function(){alert(1)}}//When you take an object and want to add new properties and methods to it, you might create a name attribute and showName method obj.name ="nodeing"
obj.showName = function(){alert(2)}
Copy the code

At this point, the new methods and attributes will overwrite the old methods, resulting in conflicts.

Object properties and methods are strings, so new methods and attributes may conflict. In ES6, a new data type was added to represent unique values.

The Symbol function creates a unique value and returns an object each time the Symbol function is executed.

let s1 = Symbol()
let s2 = Symbol(a)console.log(s1 === s2) //falseNote Created S1 and S2 are not the sameconsole.log(s1, s2); //Symbol(a)Symbol(a)Copy the code

In this code, the printed values are Symbol(). How do we distinguish s1 from S2? We can solve this by passing in the form of parameters

//The parameter passed in is the currentSymbolIs used to distinguish betweenSymbol
let s1 = Symbol("s1")
let s2 = Symbol("s2")
console.log(s1, s2);  //Symbol(s1) Symbol(s2)
Copy the code

Application scenarios

Symbol is used to set the name of an object’s property or method to prevent new properties or methods from colliding with the original.

 
let name = Symbol("name");
let show = Symbol("show");
 
let obj = {
    //Set attribute [name]:'xiaoqiang',
    [show](){alert(1)}};//The valuesconsole.log(obj[name]);
//Call method obj[show]()Copy the code

Note that the value of name must be indicated in [] as a variable that can change.

Matters needing attention

  • SymbolThe parameters are just rightSymbolSo, even if the description is the same,SymbolIt’s different.

The return value of the Symbol function is an object

console.log(Symbol("nodeing") = = =Symbol("nodeing")) / /false
Copy the code
  • SymbolFunction cannot be usedNewKeyword call
let s1 = new Symbol(a);//An errorCopy the code
  • SymbolA type cannot be converted to a number during a type conversion
let s1 = Symbol("s1");
console.log(String(s1));  //Symbol(s1)
console.log(Boolean(s1));  //true
console.log(Number(s1)) //An errorCopy the code
  • SymbolYou can’t do any operations
console.log(Symbol("s1") + "nodeing") //An errorconsole.log(Symbol("s1") - 100) //An errorCopy the code
  • SymbolWhen used as an object property or method, there is no way to take a value without assigning it to a variable.
let obj = {
    //Set properties [Symbol("name")]: 'xiaoqiang'
};
//The valuesconsole.log(obj[Symbol("name")]);
Copy the code
  • SymbolThere is no way to befor inTo iterate over
let name = Symbol('name')
let age = Symbol('age')
let obj = {
    a: 1,
    b: 2,
    [name]: 'xiaoqiang',
    [age]: 18
};
for(let attr in obj){
    console.log(attr,obj[attr])  //a b
}
Copy the code

You can use the Object. GetOwnPropertySymbols view all the symbol on Object attribute.

console.log(Object.getOwnPropertySymbols(obj))
Copy the code