ES6中Symbol類(lèi)型用法實(shí)例詳解
本文實(shí)例講述了ES6中的Symbol類(lèi)型。分享給大家供大家參考，具體如下：
Symbol是在ES6中新加入的類(lèi)型。
正如我們所知，JavaScript中有以下幾種類(lèi)型：
Undefined ,Null ,Boolean ,Number ,String, Object。
但是上述類(lèi)型在處理某些情況的時(shí)候是遠(yuǎn)遠(yuǎn)不夠的。下面我們來(lái)舉一個(gè)例子：
假設(shè)我們要移動(dòng)div，也需要在某些情況下判斷該div是否處于移動(dòng)狀態(tài)，所以我們會(huì)想到給div這類(lèi)的對(duì)象設(shè)置一個(gè)屬性。
if (element.isMoving) {
smoothAnimations(element);
}
element.isMoving = true;
但是這樣會(huì)存在一些問(wèn)題，比如：
我們可能和第三方的庫(kù)沖突；
我們可能和未來(lái)的標(biāo)準(zhǔn)沖突等。
于是可以采用第二種方法，也就是采用加密函數(shù)，制定一個(gè)值：
var isMoving = SecureRandom.generateName();
...
if (element[isMoving]) {
smoothAnimations(element);
}
element[isMoving] = true;
這樣確實(shí)解決了沖突問(wèn)題，但卻帶來(lái)了調(diào)試問(wèn)題，我們每次查看該對(duì)象屬性時(shí)都會(huì)看見(jiàn)一大堆垃圾命名。
于是為了解決沖突問(wèn)題，ES6提出了Symbol這樣的新類(lèi)型。
Symbol是一種特殊的、不可變的數(shù)據(jù)類(lèi)型，可以作為對(duì)象屬性的標(biāo)識(shí)符使用。我們看demo：
var sym1 = Symbol();
var sym2 = Symbol("foo");
var sym3 = Symbol("foo");
Symbol("foo") 不會(huì)強(qiáng)制字符串 "foo" 進(jìn)入一個(gè)Symbol，它每次都創(chuàng)建一個(gè)新的Symbol：
Symbol("foo") === Symbol("foo"); // false
所以可以利用這個(gè)特性來(lái)創(chuàng)建私有屬性：
(function() {
// 創(chuàng)建symbol
var key = Symbol("key");
function MyClass(privateData) {
this[key] = privateData;
}
MyClass.prototype = {
doStuff: function() {
... this[key] ...
}
};
})();
var c = new MyClass("hello")
c["key"] === undefined//無(wú)法訪(fǎng)問(wèn)該屬性，因?yàn)槭撬接械?
也可以利用Symbol來(lái)解除上面所說(shuō)的沖突問(wèn)題：
// create a unique symbol
var isMoving = Symbol("isMoving");
...
if (element[isMoving]) {
smoothAnimations(element);
}
element[isMoving] = true;
當(dāng)然，也可以通過(guò)另外的調(diào)用方法來(lái)生成可以與外界共享的Symbol類(lèi)型，就是Symbol.for方法。
Symbol.for(key) 方法會(huì)根據(jù)給定的鍵 key，來(lái)從 symbol 注冊(cè)表中找到對(duì)應(yīng)的 symbol，如果找到了，則返回它，否則，新建一個(gè)與該鍵關(guān)聯(lián)的 symbol，并放入 symbol 注冊(cè)表中。
Symbol.for("foo"); // 創(chuàng)建一個(gè) symbol 并放入 symbol 注冊(cè)表中，鍵為 "foo"
Symbol.for("foo"); // 從 symbol 注冊(cè)表中讀取鍵為"foo"的 symbol
Symbol.for("bar") === Symbol.for("bar"); // true，證明了上面說(shuō)的
Symbol("bar") === Symbol("bar"); // false，Symbol() 函數(shù)每次都會(huì)返回新的一個(gè) symbol
var sym = Symbol.for("mario");
sym.toString();
// "Symbol(mario)"，mario 既是該 symbol 在 symbol 注冊(cè)表中的鍵名，又是該 symbol 自身的描述字符串
所以為了防止沖突，我們最好給symbol帶上前綴：
Symbol.for("mdn.foo");
Symbol.for("mdn.bar");
希望本文所述對(duì)大家ECMAScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
這篇文章主要給大家介紹了關(guān)于微信小程序使用Vant Weapp組件庫(kù)的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用微信小程序具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
layui數(shù)據(jù)表格 table.render 報(bào)錯(cuò)的解決方法
今天小編就為大家分享一篇layui數(shù)據(jù)表格 table.render 報(bào)錯(cuò)的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
php實(shí)例分享之實(shí)現(xiàn)顯示網(wǎng)站運(yùn)行時(shí)間
這篇文章主要介紹了php實(shí)現(xiàn)顯示網(wǎng)站運(yùn)行時(shí)間,需要的朋友可以參考下2014-05-05
JS實(shí)現(xiàn)可用滑塊滑動(dòng)的緩動(dòng)圖代碼
這篇文章主要介紹了JS實(shí)現(xiàn)可用滑塊滑動(dòng)的緩動(dòng)圖代碼，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-09-09
這篇文章主要介紹了JavaScript獲取表單內(nèi)所有元素值的方法,實(shí)例分析了javascript操作表單元素的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
js禁止頁(yè)面復(fù)制功能禁用頁(yè)面右鍵菜單示例代碼
禁止頁(yè)面復(fù)制功能、禁用頁(yè)面右鍵菜單等等在瀏覽網(wǎng)頁(yè)時(shí)想必大家都有遇到過(guò)吧，下面為大家詳細(xì)介紹下使用js是如何實(shí)現(xiàn)的，感興趣的朋友可以參考下2013-08-08
這篇文章主要給大家介紹了關(guān)于Javascript中click與blur事件順序的相關(guān)資料，文中介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用Javascript中的click與blur事件具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友可以下面來(lái)一起看看吧。2017-04-04
javascript設(shè)計(jì)模式之解釋器模式詳解
這篇文章主要介紹了javascript設(shè)計(jì)模式之解釋器模式詳解,當(dāng)有一個(gè)語(yǔ)言需要解釋執(zhí)行，并且可以將該語(yǔ)言中的句子表示為一個(gè)抽象語(yǔ)法樹(shù)的時(shí)候，可以考慮使用解釋器模式,需要的朋友可以參考下2014-06-06
批量設(shè)置樣式的三種方法:第一種使用JSON/第二種使用cssText/使用第三種with(不推薦使用),感興趣的朋友可以參考下，希望可以幫助到你2013-02-02
JS的數(shù)字類(lèi)型一旦數(shù)字超過(guò)限值,JS將會(huì)丟失精度,導(dǎo)致前后端的值出現(xiàn)不一致,這篇文章主要給大家介紹了關(guān)于JS數(shù)字精度丟失的原因分析及解決方法,需要的朋友可以參考下2022-04-04