快捷導(dǎo)航

詳細(xì)談?wù)凟S6中的symbol數(shù)據(jù)類型

更新時(shí)間：2021年08月19日 09:05:53 作者：山外小樓夜聽風(fēng)

這篇文章主要給大家介紹了關(guān)于ES6中symbol數(shù)據(jù)類型的相關(guān)資料,Symbol函數(shù)的特性是每一個Symbol函數(shù)的返回值都是唯一的,可以通過給symbol函數(shù)傳遞不同的參數(shù)產(chǎn)生具有不同標(biāo)記的值,需要的朋友可以參考下

symbol數(shù)據(jù)類型

js語言中，ES6前有6種數(shù)據(jù)類型。

ES6新提出symbol數(shù)據(jù)類型，所以symbol是js的第七種數(shù)據(jù)類型，表示獨(dú)一無二的值。是一種類似于字符串的數(shù)據(jù)類型。

目的是為了防止屬性名的沖突，保證對象中每一個屬性名都是獨(dú)一無二的。

let s1 = Symbol('foo');
let s2 = Symbol('foo');

s1 === s2 // false

Symbol類型可以有一個字符串參數(shù)，表示對Symbol實(shí)例的描述。所以相同描述的兩個Symbol類型實(shí)例也是不相等的。

symbol出現(xiàn)的原因

ES5 的對象屬性名都是字符串，這容易造成屬性名的沖突。比如，你使用了一個他人提供的對象，但又想為這個對象添加新的方法（mixin 模式），新方法的名字就有可能與現(xiàn)有方法產(chǎn)生沖突。如果有一種機(jī)制，保證每個屬性的名字都是獨(dú)一無二的就好了，這樣就從根本上防止屬性名的沖突。這就是 ES6 引入Symbol的原因

Symbol特點(diǎn)

Symbol的值是唯一的，用來解決命名沖突的問題
Slymbol 值不能與其他數(shù)據(jù)進(jìn)行運(yùn)算
Symbol 定義的對象屬性不能使用fr..in 循環(huán)遍歷，但是可以使用Reflect.ownKeys來獲取對象的所有鍵名
Symbol函數(shù)前不能使用new命令，否則會報(bào)錯。這是因?yàn)樯傻?Symbol 是一個原始類型的值，不是對象。也就是說，由于 Symbol 值不是對象，所以不能添加屬性?；旧?，它是一種類似于字符串的數(shù)據(jù)類型。

//創(chuàng)建Symbol
let s= Symbol();
console.log(s, typeof s);


// 試試創(chuàng)建2個symbol相同
let s2 = Symbol(' 辣雞rb');
let s3 = Symbol(' 辣雞rb');
console.log(s2 === s3); //false


//用Symbol.for創(chuàng)建一樣的symbol
let s4 = Symbol.for('辣雞rb');
let s5 = Symbol.for('辣雞rb');
console.log(s4 === s5); //true


//不能與其他數(shù)據(jù)進(jìn)行運(yùn)算
let result = s + 100;//報(bào)錯，

文章結(jié)尾回顧一下js的數(shù)據(jù)類型

引用尚硅谷的一個記憶口訣

// USONB =>you are so .niubility 你是如此牛逼

// u=>undefined

// s=>string symbol

// 0=>object

// n=>null number

// b=>boolean

思考一下，決定再寫點(diǎn)，

symbol的應(yīng)用

在rb對象中添加up和down方法

方法1

let rb = {
    name: '日本戰(zhàn)犯',
    age: 500,
};
// 用symbol處理
// 聲明對象，里面包含兩個方法，方法用symbol()寫
let methods = {
    up: Symbol(),
    down: Symbol()
};
// 把方法加進(jìn)去
rb[methods.up] = function () {
    console.log('原諒說的是人');
};
rb[methods.down] = function () {
    console.log('畜生沒臉讓中華兒女原諒它');
};
console.log(rb);

方法2

在rb對象中添加sb和dsb方法

let rb = {
    name: '日本戰(zhàn)犯',
    age: 500,
    [Symbol('sb')]: function () {
        console.log('我喜歡日本動畫');
    },
     [Symbol('dsb')]: function () {
         console.log('但不妨礙我恨他們在華夏大地犯的罪');
     },
};

console.log(rb);