成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

深入理解ES6筆記(七)Set集合和Map集合

loostudy / 419人閱讀

摘要:創(chuàng)建并添加項(xiàng)目可以使用數(shù)組來(lái)初始化一個(gè),并且構(gòu)造器會(huì)確保不重復(fù)地使用這些值使用方法來(lái)測(cè)試某個(gè)值是否存在于中移除值使用方法來(lái)移除單個(gè)值,或調(diào)用方法來(lái)將所有值從中移除。屬性的初始化將數(shù)組傳遞給構(gòu)造器,以便使用數(shù)據(jù)來(lái)初始化一個(gè)。

主要知識(shí)點(diǎn):Set的基本操作,Weak Set,Map的基本操作,Weak Map

《深入理解ES6》筆記 目錄

ES6 的 Set

ES6 提供了新的數(shù)據(jù)結(jié)構(gòu) Set。它類似于數(shù)組,但是成員的值都是唯一的,沒有重復(fù)的值。

Set 本身是一個(gè)構(gòu)造函數(shù),用來(lái)生成 Set 數(shù)據(jù)結(jié)構(gòu)。

創(chuàng)建 Set 并添加項(xiàng)目
let set = new Set();
set.add(5);
set.add("5");
console.log(set.size); // 2

可以使用數(shù)組來(lái)初始化一個(gè) Set ,并且 Set 構(gòu)造器會(huì)確保不重復(fù)地使用這些值:

let set = new Set([1, 2, 3, 4, 5, 5, 5, 5]);
console.log(set.size); // 5

使用 has() 方法來(lái)測(cè)試某個(gè)值是否存在于 Set 中:

let set = new Set();
set.add(5);
set.add("5");
console.log(set.has(5)); // true
console.log(set.has(6)); // false
移除值

使用 delete() 方法來(lái)移除單個(gè)值,或調(diào)用 clear() 方法來(lái)將所有值從 Set 中移除。

let set = new Set();
set.add(5);
set.add("5");
console.log(set.has(5)); // true
set.delete(5);
console.log(set.has(5)); // false
console.log(set.size); // 1
set.clear();
console.log(set.has("5")); // false
console.log(set.size); // 0
Set 上的 forEach() 方法

forEach() 方法會(huì)被傳遞一個(gè)回調(diào)函數(shù),該回調(diào)接受三個(gè)參數(shù):

元素值;

元素索引;

目標(biāo) Set 自身。
Set 中的每一項(xiàng)鍵與值是相等的

let set = new Set([1, 2]);
set.forEach(function(value, key, ownerSet) {
    console.log(key + " " + value);
    console.log(ownerSet === set);
});
// 輸出
1 1
true
2 2
true
將 Set 轉(zhuǎn)換為數(shù)組
let set = new Set([1, 2, 3, 3, 3, 4, 5]),
array = [...set];
console.log(array); // [1,2,3,4,5]

可以用此方法進(jìn)行數(shù)組去重:

function eliminateDuplicates(items) {
    return [...new Set(items)];
}
let numbers = [1, 2, 3, 3, 3, 4, 5],
noDuplicates = eliminateDuplicates(numbers);
console.log(noDuplicates); // [1,2,3,4,5]
Weak Set

Set的引用類型:對(duì)象存儲(chǔ)在 Set 的一個(gè)實(shí)例中時(shí),實(shí)際上相當(dāng)于把對(duì)象存儲(chǔ)在變量中。只要對(duì)于 Set 實(shí)例的引用仍然存在,所存儲(chǔ)的對(duì)象就無(wú)法被垃圾回收機(jī)制回收,從而無(wú)法釋放內(nèi)存。

let set = new Set(),
key = {};
set.add(key);
console.log(set.size); // 1
// 取消原始引用
key = null;
console.log(set.size); // 1
// 重新獲得原始引用
key = [...set][0];

當(dāng) JS 代碼在網(wǎng)頁(yè)中運(yùn)行,同時(shí)你想保持與 DOM 元素的聯(lián)系,在該元素可能被其他腳本移除的情況下,你應(yīng)當(dāng)不希望自己的代碼保留對(duì)該 DOM 元素的最后一個(gè)引用(這種情況被稱為內(nèi)存泄漏)。
Weak Set
該類型只允許存儲(chǔ)對(duì)象弱引用,而不能存儲(chǔ)基本類型的值。對(duì)象的弱引用在它自己成為該對(duì)象的唯一引用時(shí),不會(huì)阻止垃圾回收:
創(chuàng)建 Weak Set

let set = new WeakSet(),
key = {};
// 將對(duì)象加入 set
set.add(key);
console.log(set.has(key)); // true
set.delete(key);
console.log(set.has(key)); // false

和Set的區(qū)別:

WeakSet 的成員只能是對(duì)象,而不能是其他類型的值。

const ws = new WeakSet();
ws.add(1)
// TypeError: Invalid value used in weak set
ws.add(Symbol())
// TypeError: invalid value used in weak set

WeakSet 中的對(duì)象都是弱引用,即垃圾回收機(jī)制不考慮 WeakSet 對(duì)該對(duì)象的引用,也就是說,如果其他對(duì)象都不再引用該對(duì)象,那么垃圾回收機(jī)制會(huì)自動(dòng)回收該對(duì)象所占用的內(nèi)存,不考慮該對(duì)象還存在于 WeakSet 之中。

Weak Set 不可迭代,因此不能被用在 for-of 循環(huán)中;

Weak Set 無(wú)法暴露出任何迭代器(例如 keys() 與 values() 方法),因此沒有任何編程手段可用于判斷 Weak Set 的內(nèi)容;

Weak Set 沒有 forEach() 方法;

Weak Set 沒有 size 屬性。

ES6 的 Map

ES6 的 Map 類型是鍵值對(duì)的有序列表,而鍵和值都可以是任意類型。

基本用法:

let map = new Map();
map.set("title", "Understanding ES6");
map.set("year", 2016);
console.log(map.get("title")); // "Understanding ES6"
console.log(map.get("year")); // 2016

如果任意一個(gè)鍵不存在于 Map 中, 則 get() 方法就會(huì)返回特殊值 undefined

可以將對(duì)象作為鍵,這些鍵不會(huì)被強(qiáng)制轉(zhuǎn)換成其他形式,每個(gè)對(duì)象就都被認(rèn)為是唯一的

let map = new Map(),
key1 = {},
key2 = {};
map.set(key1, 5);
map.set(key2, 42);
console.log(map.get(key1)); // 5
console.log(map.get(key2)); // 42
Map 的方法

has(key) :判斷指定的鍵是否存在于 Map 中;

delete(key) :移除 Map 中的鍵以及對(duì)應(yīng)的值;

clear() :移除 Map 中所有的鍵與值。

屬性:size

let map = new Map();
map.set("name", "Nicholas");
map.set("age", 25);
console.log(map.size); // 2
console.log(map.has("name")); // true
console.log(map.get("name")); // "Nicholas"
console.log(map.has("age")); // true
console.log(map.get("age")); // 25
map.delete("name");
console.log(map.has("name")); // false
console.log(map.get("name")); // undefined
console.log(map.size); // 1
map.clear();
console.log(map.has("name")); // false
console.log(map.get("name")); // undefined
console.log(map.has("age")); // false
console.log(map.get("age")); // undefined
console.log(map.size); // 0
Map 的初始化

將數(shù)組傳遞給 Map 構(gòu)造器,以便使用數(shù)據(jù)來(lái)初始化一個(gè) Map 。該數(shù)組中的每一項(xiàng)也必須是數(shù)組,內(nèi)部數(shù)組的首個(gè)項(xiàng)會(huì)作為鍵,第二項(xiàng)則為對(duì)應(yīng)值:

let map = new Map([["name", "Nicholas"], ["age", 25]]);
console.log(map.has("name")); // true
console.log(map.get("name")); // "Nicholas"
console.log(map.has("age")); // true
console.log(map.get("age")); // 25
console.log(map.size); // 2
便歷方法

forEach

let map = new Map([ ["name", "Nicholas"], ["age", 25]]);
map.forEach(function(value, key, ownerMap) {
    console.log(key + " " + value);
    console.log(ownerMap === map);
});
//打?。?name Nicholas
true
age 25
true

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/96950.html

相關(guān)文章

  • 深入理解ES6筆記——Set集合Map集合(7)

    摘要:常被用來(lái)檢查對(duì)象中是否存在某個(gè)鍵名,集合常被用來(lái)獲取已存的信息。返回一個(gè)布爾值,表示該值在中存在與否。集合存放對(duì)象的弱引用,當(dāng)該對(duì)象的其他強(qiáng)引用被清除時(shí),集合中的弱引用也會(huì)自動(dòng)被垃圾回收機(jī)制回收,追蹤成組的對(duì)象是該集合最好的使用方式。 Map和Set都叫做集合,但是他們也有所不同。Set常被用來(lái)檢查對(duì)象中是否存在某個(gè)鍵名,Map集合常被用來(lái)獲取已存的信息。 Set Set是有序列表,含...

    Charlie_Jade 評(píng)論0 收藏0
  • 學(xué)習(xí)ES6筆記──工作中常用到的ES6語(yǔ)法

    摘要:但是有了尾調(diào)用優(yōu)化之后,遞歸函數(shù)的性能有了提升。常被用來(lái)檢查對(duì)象中是否存在某個(gè)鍵名,集合常被用來(lái)獲取已存的信息。循環(huán)解構(gòu)對(duì)象本身不支持迭代,但是我們可以自己添加一個(gè)生成器,返回一個(gè),的迭代器,然后使用循環(huán)解構(gòu)和。 一、let和const 在JavaScript中咱們以前主要用關(guān)鍵var來(lái)定義變量,ES6之后,新增了定義變量的兩個(gè)關(guān)鍵字,分別是let和const。對(duì)于變量來(lái)說,在ES5中...

    curried 評(píng)論0 收藏0
  • 深入理解ES6筆記——導(dǎo)讀

    摘要:最近買了深入理解的書籍來(lái)看,為什么學(xué)習(xí)這么久還要買這本書呢主要是看到核心團(tuán)隊(duì)成員及的創(chuàng)造者為本書做了序,作為一個(gè)粉絲,還是挺看好這本書能給我?guī)?lái)一個(gè)新的升華,而且本書的作者也非常厲害。 使用ES6開發(fā)已經(jīng)有1年多了,以前看的是阮一峰老師的ES6教程,也看過MDN文檔的ES6語(yǔ)法介紹。 最近買了《深入理解ES6》的書籍來(lái)看,為什么學(xué)習(xí)ES6這么久還要買這本書呢?主要是看到Daniel A...

    Godtoy 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<