ES6 Symbol - 基本使用方法

paney129 發(fā)布于2019-08-26 10:19 / 454人閱讀

摘要：但是，前來提到的個方法都不支持屬性，為了保持原有的功能，新增了一個方法來檢索類型的屬性接下來看一下式例以上，就是關于的基本使用方法。

ES6新增了一個基本數據類型：Symbol，至此ECMAScript的基本數據類型就有了6種：
字符串，數字，布爾，null，undefined,Symbol。
關于Symbol，我打算寫2篇文章來提取一下比較重要的知識點，這篇是第一篇，主要講Symbol的基本特性和使用場景。下一篇主要講幾個比較重要的Symbol屬性。廢話不多說，先進入第一篇的主題：
一：Symbol的分類和創(chuàng)建
Symbol有兩種類型：

1: 非全局（非共享）類型的Symbol
2: 全局（共享）類型的Symbol

接下來就看看怎樣創(chuàng)建以上兩種不同的Symbol：

1: 創(chuàng)建非全局（非共享）類型的Symbol

所有的原始值，都有其字面形式，比如一個數字：24，一個字符串："javaScript"。但是，Symbol沒有。創(chuàng)建一個Symbol，必須使用Symbol函數：

let color = Symbol();

Symbol()函數也接受一個可選的參數，其為字符串類型，可以作為這個Symbol的描述：

let color = Symbol("color");

但是，這里的描述并沒有實際的用途，你也不能通過任何途徑訪問到它，它僅僅是用作更好地理解代碼或者調試的時候給你一些context。

2: 創(chuàng)建全局（共享）類型的Symbol

在基于可能的需求場景，比如你想要在一個大的代碼庫中或者跨文件追蹤一個Symbol變量，ES6提供了一個可以創(chuàng)建全局的（共享的）Symbol變量的方法，這些全局的Symbol存在于全局的Symbol注冊表里。先來看一下創(chuàng)建一個全局的Symbol的方法：

let uid = Symbol.for("uid");
console.log(uid); // Symbol(uid)

全局的Symbol，需要使用到Symbol.for()方法，接受一個字符串類型的參數，這個參數作為這個Symbol的key，唯一標示，同時也作為其描述。為了更了解全局Symbol的特性，我們可以看下面一段代碼：

let uid = Symbol.for("uid");
let uid2 = Symbol.for("uid");
console.log(uid === uid2); // true

上面一段代碼，我們先創(chuàng)建了一個key為"uid"的全局Symbol，后面又創(chuàng)建了一個相同key的全局Symbol，最后證明這兩個Symbol全等，因為當調用Symbol.for("uid")方法的行為表現為：

1: 先在全局的Symbol注冊表中查找key為"uid"的Symbol，如果已經存在，就直接返回
2: 如果不存在，則創(chuàng)建一個新的Symbol，并用這個key在全局注冊，隨即返回新創(chuàng)建的Symbol

這里還有一個方法Symbol.keyFor()用來檢測一個特定的Symbol是否已經在注冊表中存在：

let uid = Symbol.for("uid");
let uid2 = Symbol.for("uid");
let uid3 = Symbol("uid3");
console.log(Symbol.keyFor(uid));// uid
console.log(Symbol.keyFor(uid2));// uid
console.log(Symbol.keyFor(uid3));// undefined

變量uid和uid2的key都是"uid"，所以"uid"既是uid也是uid2的key。但是uid3不是一個全局Symbol，所以調用Symbol.keyFor()得到的結果是undefined。

二：Symbol的使用場景

Symbol的使用場景只要有：
    1: 所有使用可計算屬性名的地方
    2: Object.defineProperty()
    3: Object.defineProperties()
下面來看一個綜合了以上三種使用場景的代碼示例：
    let firstName = Symbol("first name");
let person = {
    [firstName]: "mike" //用在對象的可計算屬性
};

// 用在Object.defineProperty()
Object.defineProperty(person, firstName, {writable: false});

//用在Object.defineProperties()
let lastName = Symbol("last name");

Object.defineProperties(person, {
    [lastName]: {
        value: "deep",
        writable: true
    }
});

三：Symbol的強制類型轉換
Symbol是比較特殊的原始類型，因為其他類型沒有與其邏輯等價的值，所以在某些可能會發(fā)生強制類型轉換的場景，會因為二出錯，需要特別注意一下。這里先看一下2個會報錯的場景：

1: 將Symbol與字符串相加
2: 將Symbol進行數學運算

1: 將Symbol與字符串相加

let firstName = Symbol("first name");
let desc = firstName + "!"; //Uncaught TypeError: Cannot convert a Symbol value to a string

2: 將Symbol進行數學運算

let firstName = Symbol("first name");
let desc = firstName + 1; //Uncaught TypeError: Cannot convert a Symbol value to a number

以上兩例代碼都是因為Symbol無法直接強制轉換為字符串類型和數字類型，從而報錯。但是，在一下三種場景中，卻可以把Symbol轉換為字符串類型：

1: 調用console.log(symbol)時，會自動轉為字符串
2: Symbol主動調用toString()方法
3: 直接調用String(symbol)方法

看一下示例：

let firstName = Symbol("first name");
let middleName = Symbol("middle name");
let lastName = Symbol("last name");

let firstNameDesc = firstName.toString();
let middleNameDesc = String(middleName);
console.log(lastName); // Symbol(last name)

使用console.log()的時候，其實是因為會默認調用toString()方法，把Symbol轉換為String類型。
四：Symbol屬性檢索
在ES6之前，我們已經有2個檢索對象屬性的方法：

1: Object.keys() 返回所有可枚舉的屬性名
2: Object.getOwnPropertyNames() 不考慮可枚舉性一律返回

ES6新增了Symbol類型，且我們現在知道了Symbol也可以被用作對象的屬性名。但是，前來提到的2個方法都不支持Symbol屬性，為了保持原有的功能，ES6新增了一個方法來檢索Symbol類型的屬性：Object.getOwnPropertySymbols()
接下來看一下式例：

let firstName = Symbol("first name");
let person = {
    [firstName]: "mike",
    "lastName": "deep"
};
console.log(Object.keys(person));//["lastName"]
console.log(Object.getOwnPropertyNames(person));//["lastName"]
console.log(Object.getOwnPropertySymbols(person));//[Symbol(first name)]

以上，就是關于Symbol的基本使用方法。

云服務器 GPU云服務器 symbol python基本使用 linux基本使用 hbase基本使用

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規(guī)行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://systransis.cn/yun/105976.html

通俗易懂理解ES6 - ES6的變量類型及Iterator

摘要：迭代器在原有的數據結構類型上新增了兩種類型，我們在使用的時候還可以通過自由組合的形式使用這些結構類型達到自己想要的數據結構，這就需要一種統(tǒng)一的接口機制供我們調用處理不同的數據結構。引言萬丈高樓平地起，欲練此功，必先打好基本功: ) 在了解 ES6 新增的變量類型前，我們必須先知道 JavaScript 在ES6之前，有如下六種基本數據類型：Null、Undefined、Number...

Keven 2019-08-23 17:19 評論0 收藏0
ES6時代，你真的會克隆對象嗎？

摘要：原文你真的會克隆對象嗎開始之前在開始聊克隆之前，我們還是先來看看數據類型。值通過函數生成，是獨一無二的。同時，中規(guī)定了對象的屬性名有兩種類型，一種是字符串，另一種就是類型。返回一個數組，包含對象自身的所有屬性的鍵名。原文：你真的會克隆對象嗎開始之前在開始聊克隆之前，我們還是先來看看js數據類型。js的數據類型分為基本數據類型和復雜數據類型。基本數據類型：Number、Bool...

xiaokai 2019-08-26 11:32 評論0 收藏0
ES6學習總結（一）

摘要：可以通過調用方法將創(chuàng)建一個新的類型的值，這個值獨一無二，不與任何值相等。還可以使可擴展，在中，表達式被標準化為構造函數的一個方法，這意味著它是可擴展的。前端發(fā)展的太快了，快到ES6,ES7出來之后，今年已經是ES8了，但是縱然前端發(fā)展很快，我們除了馬不停蹄的學習新的技術之外，也要沉下心來，好好的潛心磨礪自己，本文是整理了自己學習ES6之后相關的知識要點，寄希望于書之于筆，一來自己可以...

_ipo 2019-08-21 11:54 評論0 收藏0
es6基礎0x022：Symbol

摘要：可以使用來判斷類型語法與該相關連的一個名字，可以通過這個名字獲取實例。例子說明和實例化的實例不同，使用實例化的實例在全局保存，相同的兩個返回的實例是一樣的。 0x000 概述 Symbol是es6新的基本數據類型，所以es之后的數據類型如下：基本數據類型： Boolean Null Undefined Number String Symbol 引用類型 Object ...

davidac 2019-08-26 13:23 評論0 收藏0
ES6 Symbol - 一些重要的Symbol屬性

摘要：是一個布爾值，用于確定當調用數組的方法時，如果傳入參數是一個數組，是否需要將這個數組拍平。與其他的屬性不同的是，并不默認出現在標準對象中。 ECMAScript 6 通過在原型鏈上定義與Symbol相關的屬性來暴露語言內部邏輯，使得開發(fā)者可以對一些語言的默認行為做配置。接下來我們來看看有哪些重要的Symbol屬性可供我們使用： 1: Symbol.hasInstance 一個在執(zhí)行 i...

Barrior 2019-08-26 10:20 評論0 收藏0