Symbols in ES6

Symbol是ES6中(時隔多年)新增的一種primitive type,可以把它看做一種自動生成唯一字符串的機(jī)制,它的真實(shí)值被隱藏在代碼后且永遠(yuǎn)無法直接獲得

如何生成Symbol

// 最基礎(chǔ)的方式
const a = Symbol()

// 可以傳入一串描述該Symbol用途的字符串作為參數(shù)
const b = Symbol('some description text')

// 從全局的Symbol庫中查詢所需的Symbol
// 如果未找到則新建一個并返回
// 這種方式較以上直接構(gòu)造Symbol的優(yōu)點(diǎn)在于
// 可以不必在外部作用域中專門維護(hù)一個變量用于存儲生成的Symbol
const c = Symbol.for('my Symbol')

// 由于不管如何Symbol都是全局存在的
// 為了盡量避免可能發(fā)生的沖突 可以給Symbol添加相應(yīng)的前綴
const d = Symbol.for('prefix.Symbol')

如何判斷一個值是否為Symbol

const a = Symbol()
// 推薦方式
typeof a === 'symbol'// true

// 其余方式
a instanceof Symbol // false
Object(a) instanceof Symbol // true
Object(a).valueOf() === a // true

如何獲得Symbol的描述字符串

const a = Symbol('desc a')
const b = Symbol.for('desc b')

Symbol.keyFor(a) // undefined
Symbol.keyFor(b) // desc b

a.toString() // Symbol(desc a)
b.toString() // Symbol(desc b)

通過上述對比,個人感覺用Symbol.for()來生成Symbol好像更加合適

不僅可以避免使用不必要的變量污染作用域,并且能更方便的獲得其描述

Symbol的用途

借助Symbol來實(shí)現(xiàn)單例模式

const Instance = Symbol.for('instance')
function singleton() {
    if (singleton[Instance]) {
        return singleton[Instance]
    }
    
    return singleton[Instance] = {}
}
const a = singleton()
const b = singleton()
a === b // true

如果將上例中的Symbol替換成任意一個不規(guī)則字符串(Magic String)對邏輯的實(shí)現(xiàn)并無影響

所以從這個角度看來,Symbol的出現(xiàn)更多的是對代碼或者說程序?qū)用嫔系奶嵘?,而不是函?shù)性的提升

const o = {
    foo: 1,
    [Symbol.for('bar')]: 2
}
Object.getOwnPropertyNames(o) // ['foo']
Object.getOwnPropertySymbols(o) // [Symbol(for)]
Object.keys(o) // ['foo']
for (let key in o ){
    console.log(key) // 'foo'
}

可以看到,雖然Symbol作為Object的屬性key不會被當(dāng)作普通的鍵值被獲取

但是還是有特殊途徑來獲得,所以并不能試圖通過Symbol把Object的部分屬性隱藏(作為外部不可訪問的私有屬性)

Built-in Symbols

個人感覺ES6自身提供的Built-in Symbols會是最常見的Symbol使用方式,例如Symbol.iterator:

const arr = [1, 2, 3]
arr[Symbol.iterator] // native function
const it = arr[Symbol.iterator]() // 獲得數(shù)組arr的Iterator

值得一提的是這些內(nèi)部的Symbol并不是像我們自定義的那樣注冊到全局庫中

而是作為Symbol構(gòu)造函數(shù)的靜態(tài)屬性對外提供


(完)

如有錯誤 歡迎各位大佬在評論區(qū)指正~~~

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 一、ES6簡介 ? 歷時將近6年的時間來制定的新 ECMAScript 標(biāo)準(zhǔn) ECMAScript 6(亦稱 ...
    一歲一枯榮_閱讀 6,209評論 8 25
  • 第2章 基本語法 2.1 概述 基本句法和變量 語句 JavaScript程序的執(zhí)行單位為行(line),也就是一...
    悟名先生閱讀 4,569評論 0 13
  • [TOC] 參考阮一峰的ECMAScript 6 入門參考深入淺出ES6 let和const let和const都...
    郭子web閱讀 1,915評論 0 1
  • 萘嫵閱讀 235評論 0 3
  • 嗯,了解之后,會不會是個衣冠禽獸嘞? 無所謂了,總之謝謝他的有心就好了,別的,不會那么輕易。 (圖太丑,表示不發(fā)了)
    淳溪閱讀 214評論 0 0

友情鏈接更多精彩內(nèi)容