Analysis of the role of ES6 Symbol in objects

This article describes the role of ES6 Symbol in objects. Share it for your reference, as follows:

In ES5, the object attribute names are all strings, which can easily cause conflicts in attribute names. For example, if you use an object provided by others, but want to add a new method (mixin pattern) to this object, the name of the new method may conflict with the existing method. Therefore, ES6 introduced Symbol. Symbol is a new primitive data type that represents a unique value. It is the seventh data type after six data types: undefined, null, Boolean, String, Number, and Object. Any attribute name belongs to the Symbol type, which is unique and can be guaranteed to not conflict with other attribute names.

1. Declare Symbol

The Symbol function can accept a string as a parameter to represent the description of the Symbol instance, mainly for easier distinction when displayed on the console or converted to a string.

var f= Symbol();//Symbol()
var f= Symbol('foo');//Symbol(foo)

// No parameterslet s1 = Symbol();
let s2 = Symbol();
s1 === s2 // false

// If there are parameterslet s1 = Symbol('foo');
let s2 = Symbol('foo');

s1 === s2 // false

Note that the parameters of the Symbol function only represent a description of the current Symbol value, so the return values ​​of the Symbol function with the same parameters are not equal.

s1 and s2 are both return values ​​of Symbol functions, and the parameters are the same, but they are not equal.

Application in an object

Symbol as attribute name:

let mySymbol = Symbol();

// The first way to writelet a = {};
a[mySymbol] = 'Hello!';

// The second way to writelet a = {
 [mySymbol]: 'Hello!'
};

// The third way of writinglet a = {};
(a, mySymbol, { value: 'Hello!' });

//The above writing methods get the same resulta[mySymbol] // "Hello!"

Assignment-bracket form:

a[mySymbol]='web';

Protection of object elements

There are many values ​​in the object, but when cycling output, we do not want all outputs, so we can use Symbol for protection.

No protection is written:

var obj={name:'Xiao Ming',skill:'web',age:18};
for (let item in obj){
  (obj[item]);
}

Now I don't want others to know my age, so I can use Symbol for loop protection.

let obj={name:'Xiao Ming',skill:'web'};
let age=Symbol();
obj[age]=18;
for (let item in obj){
  (obj[item]);//Xiao Ming, web} 
(obj[age]);

Interested friends can use itOnline HTML/CSS/JavaScript code running tool：http://tools./code/HtmlJsRunTest the above code running effect.

For more information about JavaScript, readers who are interested in reading this site's special topic:JavaScript object-oriented tutorial》、《Summary of JavaScript Errors and Debugging Skills》、《Summary of JavaScript data structure and algorithm techniques》、《JavaScript traversal algorithm and skills summary"and"Summary of JavaScript mathematical operations usage》

I hope this article will be helpful to everyone's JavaScript programming.