Small knowledge, big challenge! This paper is participating in theEssentials for programmers”Creative activities

This paper also participates inProject DigginTo win the creative gift package and challenge the creative incentive money

preface

Hello, everyone. I don’t know if you have encountered such a situation: in our daily development, sometimes we may use some objects provided by others, and the business needs to make some extensions on the basis of this object, add some attributes or methods. At this time, if we do not understand the structure of the object, to extend, it is likely to conflict with the original attributes or methods of the object. Because object attribute names are named as strings in ES5, it is easy to create attribute name conflicts. The tips we’re going to share are a good way to solve this problem. That is a new primitive data type in ES6 – Symbol

The original data type Symbol

Symbol is a new primitive data type in ES6. Use it to represent a unique value. Just like we learned about NaN before, NaN and NaN are always not equal. Similarly Symbol and Symbol are always not equal. Next, let’s look at the usage and characteristics of Symbol

  • The use of the Symbol:
    • The use of Symbol is simple. The value of Symbol is generated by the Symbol function. The Symbol function can pass a string argument as a description of the Symbol value 
      	let s1 = Symbol(a);let s2 = Symbol('hello');
Copy the code
  • The characteristics of the Symbol
    • The value of Symbol is unique, and each Symbol value is different
    • The Symbol value is generated by the Symbol function, which can take a string as an argument that describes the Symbol instance
    • The Symbol function, if passed an object as an argument, calls the object’s toString method to convert the object to a string
    • The Symbol value cannot be evaluated with other types of values or an error will be reported
    • The Symbol value can be explicitly converted to a string or Boolean, but not to a number
    • Symbol as the attribute name of the object is wrapped in square brackets []
    • The dot operator cannot be used when the Symbol value is the name of an object property. It needs to be accessed as: object name [Symbol variable]
    • The Symbol type can also define a set of constants to ensure that the values are not equal
    • Symbol does not appear in for… In, for… Of, will not be the Object. The keys (), Object, getOwnPropertyNames (), JSON. The stringify () returns, But can be by Object. GetOwnPropertySymbols () method to obtain Symbol type of attribute names
// 1.symbol values are unique
//2. The Symbol value is generated by the Symbol function
let s1 = Symbol(a);let s2 = Symbol(a);console.log(s1===s2); //false

//3. the Symbol function can take a string as an argument that describes the Symbol instance
let s3 = Symbol('description');
let s4 = Symbol('description');
s3 === s4 ;//false

//4. Pass an object as an argument to the Symbol function
let s5 = Symbol([1.2.3])
console.log(s5); / / Symbol (1, 2, 3)

//5. Symbol values cannot be computed with other types of values
let s6 = Symbol('hello')
console.log(s6 + " world");// TypeError: can't convert symbol to string

//6. Symbol values can be explicitly converted to strings or bores, but cannot be converted to numbers
let s7 = Symbol('1')
String(s7);// Symbol(1)
s7.toString();// Symbol(1)
typeof s7 ;// "string"
Boolean(s7) //true
Number(s7);// TypeError: can't convert symbol to number

// 7.symbol is wrapped in square brackets [] as the attribute name of the object
The dot operator cannot be used when the Symbol value is used as the object attribute name. It needs to be accessed as: object name [Symbol variable]
let s8 = Symbol('obj');
let obj = {
	[s8]: 'hello world'
}
console.log(obj.s8);//undefined s8 is considered a string property and cannot be retrieved
console.log(obj[s8]);//hello world

The Symbol type can also define a set of constants to ensure that the values of these constants are not equal
const log = {};
log.levels = {
  DEBUG: Symbol('debug'),
  INFO: Symbol('info'),
  WARN: Symbol('warn')};console.log(log.levels.DEBUG, 'debug message');
console.log(log.levels.INFO, 'info message');

//10. Symbol does not appear in for... In, for... Of, will not be the Object. The keys (), Object, getOwnPropertyNames (), JSON. The stringify () returns, But can be by Object. GetOwnPropertySymbols () method to obtain Symbol type of attribute names
const obj = {};
let a = Symbol('a');
let b = Symbol('b');
obj[a] = 'Hello';
obj[b] = 'World';
obj.c = 'javascript'

Object.keys();// ['c']
Object.getOwnPropertySymbols(obj);//[Symbol(a), Symbol(b)]
Copy the code

Use scenario of Symbol

After understanding the characteristics of Symbol, we can do something with the help of these characteristics. Such as

  • Extend objects provided by others
  • Eliminate magic string
  • Define methods for objects that are not private but that you want to use only internally
  • Define a set of constants and so on

conclusion

Today we learned a new knowledge of ES6 Symbol, I believe that friends also feel the power of Symbol. The use and characteristics of Symbol are shared here. The next article will continue to explore some of the built-in values in Symbol and what they do. Thank you for your support.

Like small partners welcome to praise the message plus attention oh!