<ruby id="bdb3f"></ruby>

    <p id="bdb3f"><cite id="bdb3f"></cite></p>

      <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
        <p id="bdb3f"><cite id="bdb3f"></cite></p>

          <pre id="bdb3f"></pre>
          <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

          <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
          <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

          <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                <ruby id="bdb3f"></ruby>

                ??碼云GVP開源項目 12k star Uniapp+ElementUI 功能強大 支持多語言、二開方便! 廣告
                &emsp;&emsp;本節將會重點分析ES6引入的第6種基本類型:Symbol(符號)。符號可以像字符串那樣作為對象的屬性名,只是它有唯一性的特點,可以避免屬性名之間的沖突。 ## 一、創建 &emsp;&emsp;符號沒有字面量形式,只能通過Symbol()函數創建。該函數有一個可選的參數,只是用來描述當前符號,除了便于閱讀之外,沒有其他用途。由此可知,即使兩個符號的描述相同,它們還是不能畫等號。注意,Symbol()不是構造函數,因此不能和new運算符組合使用,否則會拋出類型錯誤。下面用一個例子展示符號的創建。 ~~~ var sym1 = Symbol(), sym2 = Symbol("name"), sym3 = Symbol("name"), sym4 = new Symbol(); //拋出類型錯誤 console.log(sym2 === sym3); //false ~~~ &emsp;&emsp;如果要識別一個變量是否為符號,可以用typeof運算符。ES6擴展了它,當檢測到符號時,能返回一個新的類型字符串“symbol”,具體如下所示。 ~~~ typeof sym1; //"symbol" typeof sym2; //"symbol" ~~~ ## 二、類型轉換 &emsp;&emsp;符號在類型轉換時表現得并不靈活,它無法與數字或字符串進行運算,也無法顯式的轉換成數字。如下所示,后面四條語句在執行時都會報錯。 ~~~ var sym = Symbol("age"); Number(sym); parseInt(sym); 1 + sym; "" + sym; ~~~ &emsp;&emsp;不過,符號可以顯式的轉換成字符串或布爾值,具體如下所示。 ~~~ Boolean(sym);   //true !sym;   //false sym.toString(); //"Symbol(age)" String(sym); //"Symbol(age)" ~~~ ## 三、全局共享 &emsp;&emsp;ES6會在內部維護一張全局符號注冊表,通過Symbol.for()方法,可以登記指定符號,使其變成一個全局有效地符號,從而達到全局共享。該方法只接收一個參數,這個參數既是注冊表中的鍵值,同時也是此符號的描述。下面的代碼調用了兩次Symbol.for()方法,傳遞了相同的參數,返回的卻是同一個全局符號。 ~~~ var sym1 = Symbol.for("name"), sym2 = Symbol.for("name"); console.log(sym1 === sym2); //true ~~~ &emsp;&emsp;在上面的代碼中,第一次調用Symbol.for()方法時,會在注冊表中搜索鍵值為“name”的符號,由于沒有找到,所以就會創建一個新的符號。而在第二次調用Symbol.for()方法時,由于傳遞的鍵值與前一次相同,因此會返回剛剛的那個符號。從而可知,對變量sym1和sym2進行全等比較,返回的結果將是true。 &emsp;&emsp;如果要獲取某個全局符號所對應的鍵值(即它的描述),那么可以通過Symbol.keyFor()實現,具體操作如下所示。 ~~~ Symbol.keyFor(sym1); //"name" Symbol.keyFor(sym2); //"name" ~~~ ## 四、屬性名 &emsp;&emsp;本節開頭曾提到過對象的屬性名可以用符號表示,而這類屬性可以有三種賦值方式。第一種是用方括號,注意,不能用點號,因為點號后面的標識符會被識別成字符串而不是符號。下面代碼分別用方括號和點號為obj對象的sym屬性賦值,前者被識別成了符號屬性,而后者卻被識別成了字符串屬性。 ~~~ var sym = Symbol("name"), obj = {}; obj[sym] = "strick"; obj.sym = "strick"; console.log(obj); //{Symbol(name): "strick", sym: "strick"} ~~~ &emsp;&emsp;第二種是在創建對象字面量時,用計算屬性名的方式(即屬性名被方括號包裹)為其賦值,如下所示。 ~~~ obj = { [sym]: "freedom" }; ~~~ &emsp;&emsp;第三種是調用Object.defineProperty()或Object.defineProperties()方法來為符號屬性賦值,如下所示。 ~~~ Object.defineProperty(obj, sym, { value: "justice" }); ~~~ &emsp;&emsp;注意,符號屬性是不可枚舉的,既不能被for-in等循環遍歷到,也不能被Object.keys()、Object.getOwnPropertyNames()等方法讀取到。但可以通過Object.getOwnPropertySymbols()方法獲得對象的符號屬性,具體如下所示。 ~~~ obj = { [sym]: "freedom", age: 28 }; Object.keys(obj);    //["age"] Object.getOwnPropertyNames(obj); //["age"] Object.getOwnPropertySymbols(obj); //[Symbol(name)] ~~~ ## 五、內置符號 &emsp;&emsp;ES6提供了一些內置符號,也叫做知名符號(Well-Known Symbol)。它們暴露了語言的內部邏輯,允許開發人員修改或拓展規范所描述的對象特征或行為。每一個內置符號對應Symbol對象的一個屬性,例如Symbol.hasInstance、Symbol.iterator等,表1列出了11個內置符號。 :-: ![](https://img.kancloud.cn/11/ce/11cef089950c526004b71da5a78615eb_1330x882.png) 表1 內置符號 &emsp;&emsp;下面會給出4個內置符號的示例,分別是hasInstance、isConcatSpreadable、match和toStringTag。 ~~~ let digit = { [Symbol.hasInstance](number) { return !(number % 2); //判斷數字是否為偶數 } }; 1 instanceof digit; //false 2 instanceof digit; //true let arr1 = [3, 4]; [1, 2].concat(arr1); //[1, 2, 3, 4] let arr2 = [3, 4]; arr2[Symbol.isConcatSpreadable] = false; //禁止展開 [1, 2].concat(arr2); //[1, 2, [3, 4]] let regex = { [Symbol.match](str) { return str.substr(0, 10); } }, message = "My name is strick"; message.match(regex);  //"My name is" let people = { [Symbol.toStringTag]: "People" }; people.toString(); //"[object People]" ~~~ ***** > 原文出處: [博客園-ES6躬行記](https://www.cnblogs.com/strick/category/1372951.html) [知乎專欄-ES6躬行記](https://zhuanlan.zhihu.com/pwes6) 已建立一個微信前端交流群,如要進群,請先加微信號freedom20180706或掃描下面的二維碼,請求中需注明“看云加群”,在通過請求后就會把你拉進來。還搜集整理了一套[面試資料](https://github.com/pwstrick/daily),歡迎瀏覽。 ![](https://box.kancloud.cn/2e1f8ecf9512ecdd2fcaae8250e7d48a_430x430.jpg =200x200) 推薦一款前端監控腳本:[shin-monitor](https://github.com/pwstrick/shin-monitor),不僅能監控前端的錯誤、通信、打印等行為,還能計算各類性能參數,包括 FMP、LCP、FP 等。
                  <ruby id="bdb3f"></ruby>

                  <p id="bdb3f"><cite id="bdb3f"></cite></p>

                    <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
                      <p id="bdb3f"><cite id="bdb3f"></cite></p>

                        <pre id="bdb3f"></pre>
                        <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

                        <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
                        <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

                        <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                              <ruby id="bdb3f"></ruby>

                              哎呀哎呀视频在线观看