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