JS每日一題:Es6中新增的數據類型有哪些？使用場景？

DataPipeline 發布于2019-08-26 13:28 / 2196人閱讀

摘要：問中新增的數據類型有哪些使用場景中新增一種原始數據類型最大的特點是唯一性，值通過函數生成在中對象的屬性都是字符串，我們使用他人定義的對象，然后去新增自己的屬性，這樣容易起沖突覆蓋原有的屬性也可以看成為一個字符串，不過這個字符能保證是獨一無二

20190125問:

Es6中新增的數據類型有哪些？使用場景？

es6中新增一種原始數據類型Symbol,最大的特點是唯一性，Symbol值通過Symbol函數生成, 在es5中對象的屬性都是字符串，我們使用他人定義的對象，然后去新增自己的屬性，這樣容易起沖突覆蓋原有的屬性, Symbol也可以看成為一個字符串，不過這個字符能保證是獨一無二的

基本示例:

// Object

const obj = {
    name: "JS"
}

obj.name = "JS每日一題" 

// Symbol

const name = Symbol("name") // 這里的參數沒有特殊意義，可以看成為Symbol加了一個標記

obj[name] = "JS每日一題"

Symbol用法

Symbol 目前有多種寫法

// 一
const title = Symbol()

const obj = {}
obj[title] = "JS每日一題"

// 二
const obj = {
    [title]: "JS每日一題"
}

// 三
Object.defineProperty(obj, title, { value: "JS每日一題"})


obj[title] // 輸出的結果都為JS每日一題

這里注意一下，Symbol 做為屬性名時，不能用點去讀取

obj.title // undefined

Symbol作為屬性名，只有通過Object.getOwnPropertySymbols 方法返回

const attrs = Object.getOwnPropertySymbols(obj)

// [Symbol[title]]

Symbol.for()

如果我們想要重復Symbol可以使用Symbol.for， Smybol.for()及Smybol()的區別在于Symbol.for()會先去查找全局下有沒有聲明過，如果有就返回該值，沒有就新建一個，Symbol()每一次調用都會新建一個

代碼理解:

const title = Symbol.for("JS每日一題") 

....Symbol.for("JS每日一題") //調用多次都是使用的第一次聲明的值

Symbol.for("JS每日一題")  === Symbol.for("JS每日一題")  // true

const title = Symbol("JS每日一題")

Symbol("JS每日一題") === Symbol("JS每日一題") // false

總結

Symbol的特點

獨一無二

不能隱式轉換

不能與其它數據類型做運算

不能使用點運算符進行操作

ps: 今天答題的小伙伴多次都提到了map,set，，補充一下，新增的數據類型只有Symbol一種，map,set是新增的數據結構 ~_~

關于JS每日一題

JS每日一題可以看成是一個語音答題社區
每天利用碎片時間采用60秒內的語音形式來完成當天的考題
群主在次日0點推送當天的參考答案

注絕不僅限于完成當天任務，更多是查漏補缺，學習群內其它同學優秀的答題思路

點擊加入答題

GPU云服務器云服務器 js有哪些類型數據 js數據類型有哪些 js有哪些數據類型 js+復雜數據類型有哪些

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

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/108881.html

JS每日一題:Es6中新增的數據類型有哪些？使用場景？

摘要：問中新增的數據類型有哪些使用場景中新增一種原始數據類型最大的特點是唯一性，值通過函數生成在中對象的屬性都是字符串，我們使用他人定義的對象，然后去新增自己的屬性，這樣容易起沖突覆蓋原有的屬性也可以看成為一個字符串，不過這個字符能保證是獨一無二 20190125問: Es6中新增的數據類型有哪些？使用場景？ es6中新增一種原始數據類型Symbol,最大的特點是唯一性，Symbol值通過S...

jsummer 2019-08-02 14:12 評論0 收藏0
前端知識點(二)

摘要：在給一個目標對象為構造函數的代理對象構造實例時觸發該操作，比如在執行時。 1、元素上下垂直居中的方式有哪些？元素水平垂直居中的方式有哪些？ absolute加margin方案 fixed 加 margin 方案 display:table 方案行內元素line-height方案 flex 彈性布局方案 transform 未知元素寬高解決方案 absolute加mar...

zacklee 2019-08-30 15:55 評論0 收藏0
前端知識點(二)

摘要：在給一個目標對象為構造函數的代理對象構造實例時觸發該操作，比如在執行時。 1、元素上下垂直居中的方式有哪些？元素水平垂直居中的方式有哪些？ absolute加margin方案 fixed 加 margin 方案 display:table 方案行內元素line-height方案 flex 彈性布局方案 transform 未知元素寬高解決方案 absolute加mar...

lbool 2019-08-23 14:52 評論0 收藏0
前端知識點(二)

摘要：在給一個目標對象為構造函數的代理對象構造實例時觸發該操作，比如在執行時。 1、元素上下垂直居中的方式有哪些？元素水平垂直居中的方式有哪些？ absolute加margin方案 fixed 加 margin 方案 display:table 方案行內元素line-height方案 flex 彈性布局方案 transform 未知元素寬高解決方案 absolute加mar...

Alex 2019-08-02 14:09 評論0 收藏0
JS每日一題：如何理解es6中的Proxy？

20190124問: 如何理解es6中的Proxy？試題解析:對proxy的理解，可能會延伸到vue的雙向綁定 Proxy（代理）定義可以理解為為目標對象架設一層攔截，外界對該對象的訪問，都必須通過這層攔截簡單示例: const obj = new Proxy({}, { get: (target, key, receiver) => { return JS ...

tinysun1234 2019-08-23 14:58 評論0 收藏0