Javascript ES6中數(shù)據(jù)類型Symbol的使用詳解
介紹
Symbol 是一種特殊的、不可變的數(shù)據(jù)類型,可以作為對(duì)象屬性的標(biāo)識(shí)符使用,表示獨(dú)一無二的值。Symbol 對(duì)象是一個(gè) symbol primitive data type 的隱式對(duì)象包裝器。
它是JavaScript語言的第七種數(shù)據(jù)類型,前6種分別是:Undefined、Null、Boolean、String、Number、Object。
語法
Symbol([description])
Parameters
description : 可選的字符串??捎糜谡{(diào)試但不訪問符號(hào)本身的符號(hào)的說明。如果不加參數(shù),在控制臺(tái)打印的都是Symbol,不利于區(qū)分。
demo
var s1 = Symbol('symbol1'); s1 //Symbol(symbol1);
因?yàn)镾ymbol函數(shù)返回的值都是獨(dú)一無二的,所以Symbol函數(shù)返回的值都是不相等的。
//無參數(shù) var s1 = Symbol(); var s2 = Symbol(); s1 === s2 // false //有參數(shù) var s1 = Symbol('symbol'); var s2 = Symbol('symbol'); s1 === s2 //false
作為屬性名的Symbol
由于每一個(gè)Symbol值都是不相等的,那么作為屬性標(biāo)識(shí)符是一種非常好的選擇。
定義方式:
let symbolProp = Symbol(); var obj = {}; obj[symbolProp] = 'hello Symbol'; //或者 var obj = { [symbolProp] : 'hello Symbol'; } //或者 var obj = {}; Object.defineProperty(obj,symbolProp,{value : 'hello Symbol'});
注意:
定義屬性的時(shí)候只能將Symbol值放在方括號(hào)里面,否則屬性的鍵名會(huì)當(dāng)做字符串而不是Symbol值。同理,在訪問Symbol屬性的時(shí)候也不能通過點(diǎn)運(yùn)算符去訪問,點(diǎn)運(yùn)算符后面總是字符串,不會(huì)讀取Symbol值作為標(biāo)識(shí)符所指代的值.
Symbol類型定義常量
常量的使用Symbol值最大的好處就是其他任何值都不可能有相同的值,用來設(shè)計(jì)switch語句是一種很好的方式。例如:消除魔術(shù)字符串(這里留給讀者思考,如果有什么疑問,可以給我留言)
Symbol.for(),Symbol.keyFor()
Symbol.for()
對(duì)于Symbol.for
方法需要記住兩點(diǎn):
Symbol.for()
所返回的Symbol值的作用域是整個(gè)代碼庫(包括不同的iframe或者service worker),是一個(gè)全局的變量,第一次產(chǎn)生的時(shí)候就會(huì)登記下來。- 調(diào)用
Symbol.for()
的時(shí)候,如果在全局環(huán)境中檢索給定的key是否存在,如果不存在才會(huì)新建一個(gè)值,而Symbol()
不會(huì),Symbol()
每次返回的都是不同的值。
Symbol.for('foo') === Symbol.for('foo'); //true Symbol('foo') === Symbol('foo'); //false
Symbol.keyFor()
Symbol.keyFor
方法返回一個(gè)已登記的Symbol類型的值的key。
var s1 = Symbol.for('foo'); Symbol.keyFor(s1) //"foo" var s2 = Symbol('foo'); Symbol.keyFor(s2);//undefiend
上面的代碼中,變量s2屬于未登記的Symbol值,所以返回undefined
屬性名的遍歷
Symbol作為屬性名,雖然不是私有屬性,但是在for…in,for…of循環(huán)中,Object.keys()
,Object.getOwnPropertyNames()
都不會(huì)獲取到。通常通過兩種方法達(dá)到Symbol屬性的遍歷。
Object.getOwnPropertySymbols
方法返回一個(gè)數(shù)組,成員是當(dāng)前對(duì)象的所有Symbol值的屬性。
Reflect.ownKeys()
可以返回所有類型的鍵名,包括包括常規(guī)的鍵名和Symbol鍵名.
下面給出一個(gè)例子來解釋上面所有的。
var obj = {}; var a = Symbol('a'); var b = Symbol('b'); obj[a] = 'hello'; obj[b] = 'world'; //獲取不到 for(var i in obj){ console.log(i); //無輸出 } Object.getOwnPropertyNames(obj);//[] //可以獲取 var objectSymbols = Object.getOwnPropertySymbols(obj); objectSymbols// [Symbol(a), Symbol(b)] Reflect.ownKeys(obj);//[Symbol(a), Symbol(b)]
以Symbol值作為名稱的屬性不會(huì)被常規(guī)方法遍歷所得到。我們可以利用這個(gè)特性,為對(duì)象定義一些非私有但又希望只用于內(nèi)部的方法。
var size = Symbol('size'); class Collection { constructor(){ this[size] = 0; } add(item){ this[this[size]] = item; this[size]++; } static sizeOf(instance){ return instance[size]; } } var x = new Collection(); Collection.sizeOf(x); //0 x.add('foo'); Collection.sizeOf(x); //1 Object.keys(x)//['0'] Object.getOwnPropertyNames(x) //['0'] Object.getOwnPropertySymbols(x) //[Symbol(size)]
上面的代碼中,對(duì)象x的size屬性是一個(gè)Symbol值,所以Object.keys(x)
、Object.getOwnPropertyNames(x)
都無法獲取它。這就造成了一種非私有的內(nèi)部方法的效果。如果對(duì)ES6定義類方面還不清楚的,可以先不看這段,或者自己查查資料,后面的文章我也會(huì)分享出來,總的來說現(xiàn)在JavaScript的新標(biāo)準(zhǔn)越來越像Java了,比如新增的const、let塊級(jí)作用域,class定義類等等。
內(nèi)置的Symbol值
除了自己定義的Symbol值外,JavaScript有一些內(nèi)置的Symbol表示的內(nèi)部語言行為不在ECMAScript 5及以前暴露給開發(fā)者。這些Symbol可以被訪問被下列屬性:
1、Symbol.iterator
返回對(duì)象的默認(rèn)迭代器的方法。被for…of使用
2、Symbol.math
與字符串匹配的方法,也用于判斷對(duì)象是否可以用作正則表達(dá)式.被 String.prototype.match()
使用。
3、Symbol.replace
一種方法取代匹配字符串的子串。被String.prototype.replace()
使用。
4、Symbol.search
返回與正則表達(dá)式匹配的字符串內(nèi)返回索引的方法。被String.prototype.search()
使用。
5、Symbol.split
在與正則表達(dá)式匹配的索引處拆分字符串的方法。被String.prototype.split()
使用.
6、Symbol.hasInstance
確定構(gòu)造函數(shù)對(duì)象是否將對(duì)象作為實(shí)例識(shí)別的方法。被instanceof使用
7、Symbol.isConcatSpreadable
一個(gè)布爾值,指示對(duì)象是否應(yīng)該被扁平化為數(shù)組元素。被Array.prototype.concat()
使用.
8、Symbol.unscopables
從關(guān)聯(lián)對(duì)象的環(huán)境綁定中排除其自身和繼承的屬性名稱的對(duì)象值。被with使用
9、Symbol.species
用于創(chuàng)建派生對(duì)象的構(gòu)造函數(shù)。
10、Symbol.toPrimitive
將對(duì)象轉(zhuǎn)換為原始值的方法。
11、Symbol.toStringTag
用于對(duì)象的默認(rèn)描述的字符串值。被Object.prototype.toString()
使用.
我這里沒給出具體的例子,針對(duì)這11個(gè)屬性。讀者自己主動(dòng)去把這幾個(gè)屬性搞懂,對(duì)理解有些方法是非常有用的。
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
JS新標(biāo)簽頁打開的方法大全(讓你的網(wǎng)站訪問更加便捷)
在開發(fā)Web應(yīng)用中我們常常需要在當(dāng)前頁面打開一個(gè)鏈接,但又不希望離開當(dāng)前頁面,這篇文章主要給大家介紹了關(guān)于JS新標(biāo)簽頁打開的方法大全,通過這些方法可以讓你的網(wǎng)站訪問更加便捷,需要的朋友可以參考下2023-10-10用Div仿showModalDialog模式菜單的效果的代碼
用Div仿showModalDialog模式菜單的效果的代碼...2007-03-03詳解webpack-dev-server 設(shè)置反向代理解決跨域問題
后端只負(fù)責(zé)接口,前端負(fù)責(zé)數(shù)據(jù)展示、邏輯處理。那么如何跨域?這篇文章主要介紹了webpack-dev-server 設(shè)置反向代理解決跨域問題,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-04-04JS實(shí)現(xiàn)為表格動(dòng)態(tài)添加標(biāo)題的方法
這篇文章主要介紹了JS實(shí)現(xiàn)為表格動(dòng)態(tài)添加標(biāo)題的方法,涉及javascript中createCaption方法添加標(biāo)題的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03關(guān)于localStorage的存儲(chǔ),讀取,刪除
這篇文章主要介紹了關(guān)于localStorage的存儲(chǔ),讀取,刪除方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-04-04JavaScript算法系列之快速排序(Quicksort)算法實(shí)例詳解
這篇文章主要介紹了JavaScript算法系列之快速排序(Quicksort)算法實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2016-09-09