Es6中的Set和Map數(shù)據(jù)結構以及Iterator(遍歷器)的概念

sumory 發(fā)布于2019-07-01 10:01 / 1555人閱讀

摘要：和數(shù)據(jù)結構以及遍歷器的概念無序不可重復的集合實例化實例可以調用的方法結構的實例有以下屬性。返回一個布爾值，表示該值是否為的成員。返回結構的成員總數(shù)。一種數(shù)據(jù)結構只要部署了接口，我們就稱這種數(shù)據(jù)結構是可遍歷的。

Set和Map數(shù)據(jù)結構以及Iterator(遍歷器)的概念

Set

無序不可重復的集合
1.實例化

new Set();
new Set([]);
new Set("terry");// t e r y

2.Set實例可以調用的方法

Set 結構的實例有以下屬性。

    Set.prototype.constructor：構造函數(shù)，默認就是Set函數(shù)。
    Set.prototype.size：返回Set實例的成員總數(shù)。

Set 結構的實例有以下方法。

    add(value)：添加某個值，返回Set結構本身
    delete(value)：刪除某個值，返回一個布爾值，表示刪除是否成功。
    has(value)：返回一個布爾值，表示該值是否為Set的成員。
    clear()：清除所有成員，沒有返回值。
    keys()：返回鍵名的遍歷器
    values()：返回鍵值的遍歷器
    entries()：返回鍵值對的遍歷器
    forEach()：使用回調函數(shù)遍歷每個成員
    Set本身就是就是一個構造函數(shù)，用來生成Set數(shù)據(jù)結構


    let set = new Set();
    set.add(1);    //添加數(shù)據(jù)
    set.add(2);
    set.add(3);
    set.add(2);
    console.log(set);    //set{1,2,3}

應用：去除數(shù)組中重復元素的方法

    let arr = [1,2.3,4,3,2,1];
    let set = new Set(arr);
    let result = [...set];    //set轉換為數(shù)組

Map

Map可以接受一個數(shù)組作為參數(shù)，該數(shù)組的成員是一個個表示鍵值對的數(shù)組

let map = new Map();
map.set("name","terry");
const map = new Map([ ["name", "張三"], ["title", "Author"] ]);

Map 結構的實例有以下屬性。

Set.prototype.size：返回 Map 結構的成員總數(shù)。

Map 結構的實例有以下方法。

set(key, value)：set方法設置鍵名key對應的鍵值為value，然后返回整個 Map 結構。如果key已經(jīng)有值，則鍵值會被更新，否則就新生成該鍵。
get(key)：get方法讀取key對應的鍵值，如果找不到key，返回undefined。
has(key)：has方法返回一個布爾值，表示某個鍵是否在當前 Map 對象之中。
delete(key)：delete方法刪除某個鍵，返回true。如果刪除失敗，返回false。
clear():清除所有成員，沒有返回值
keys()：返回鍵名的遍歷器
values()：返回鍵值的遍歷器
entries()：返回鍵值對的遍歷器
forEach()：使用回調函數(shù)遍歷每個成員

Iterator

遍歷器（Iterator）就是這樣一種機制。它是一種接口，為各種不同的數(shù)據(jù)結構提供統(tǒng)一的訪問機制。任何數(shù)據(jù)結構只要部署Iterator接口，就可以完成遍歷操作（即依次處理該數(shù)據(jù)結構的所有成員）

Iterator 的作用有三個：

為各種數(shù)據(jù)結構，提供一個統(tǒng)一的、簡便的訪問接口；

使得數(shù)據(jù)結構的成員能夠按某種次序排列；

ES6創(chuàng)造了一種新的遍歷命令for...of循環(huán)，Iterator接口主要供for...of消費。

Iterator 的遍歷過程：

創(chuàng)建一個指針對象，指向當前數(shù)據(jù)結構的起始位置。也就是說，遍歷器對象本質上，就是一個指針對象。

第一次調用指針對象的next方法，可以將指針指向數(shù)據(jù)結構的第一個成員。

第二次調用指針對象的next方法，指針就指向數(shù)據(jù)結構的第二個成員。

不斷調用指針對象的next方法，直到它指向數(shù)據(jù)結構的結束位置。

默認Iterator接口

Iterator 接口的目的，就是為所有數(shù)據(jù)結構，提供了一種統(tǒng)一的訪問機制，即for...of循環(huán)（詳見下文）。當使用for...of循環(huán)遍歷某種數(shù)據(jù)結構時，該循環(huán)會自動去尋找 Iterator 接口。一種數(shù)據(jù)結構只要部署了 Iterator 接口，我們就稱這種數(shù)據(jù)結構是“可遍歷的”（iterable）。
可以通過如下方法訪問Iterator對象

var iterator = iterObj[Symbol.iterator]();

原生具備 Iterator 接口的數(shù)據(jù)結構如下

Array
Map
Set
String
TypedArray
函數(shù)的 arguments 對象
NodeList 對象

云服務器 GPU云服務器 js頁面獲取map中的數(shù)據(jù) js遍歷數(shù)據(jù)map js中的6大數(shù)據(jù)類型以及應用 oss中的目錄文件夾概念

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

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

Es6中的Set和Map數(shù)據(jù)結構以及Iterator(遍歷器)的概念

摘要：和數(shù)據(jù)結構以及遍歷器的概念無序不可重復的集合實例化實例可以調用的方法結構的實例有以下屬性。返回一個布爾值，表示該值是否為的成員。返回結構的成員總數(shù)。一種數(shù)據(jù)結構只要部署了接口，我們就稱這種數(shù)據(jù)結構是可遍歷的。 Set和Map數(shù)據(jù)結構以及Iterator(遍歷器)的概念 Set 無序不可重復的集合1.實例化 new Set(); new Set([]); new Set(terry);/...

ASCH 2019-08-26 11:55 評論0 收藏0
ES6學習（二）之解構賦值及其原理

摘要：基本原理解構是提供的語法糖，其實內在是針對可迭代對象的接口，通過遍歷器按順序獲取對應的值進行賦值。屬性值返回一個對象的無參函數(shù)，被返回對象符合迭代器協(xié)議。迭代器協(xié)議定義了標準的方式來產生一個有限或無限序列值。更多系列文章請看 1、基本語法 1.1、數(shù)組 // 基礎類型解構 let [a, b, c] = [1, 2, 3] console.log(a, b, c) // 1, 2, ...

chunquedong 2019-08-23 16:19 評論0 收藏0
es6 promise面試

摘要：執(zhí)行函數(shù)會返回一個遍歷器對象，每一次函數(shù)里面的都相當一次遍歷器對象的方法，并且可以通過方法傳入自定義的來改變函數(shù)的行為。函數(shù)可以通過配合函數(shù)更輕松更優(yōu)雅的實現(xiàn)異步編程和控制流管理。它和構造函數(shù)的不同點類的內部定義的所有方法，都是不可枚舉的。 let const的命令在ES6之前，聲明變量只能用var，var方式聲明變量其實是很不合理的，準確的說，是因為ES5里面沒有塊級作用域是很不合...

timger 2019-08-23 18:38 評論0 收藏0
JavaScript 設計模式（五）：迭代器模式

摘要：文章內容分兩部分前半部分為迭代器模式概念后半部分為中迭代器上半部分開始迭代器模式提供一種方法順序訪問一個聚合對象中的各個元素，而又不需要暴露該對象的內部表示。下半部分開始的迭代器迭代器等同于遍歷器。執(zhí)行該函數(shù)，會返回一個遍歷器對象。 showImg(https://segmentfault.com/img/bVbuyaZ?w=800&h=600); 文章內容分兩部分：前半部分為迭...

zhou_you 2019-08-23 18:26 評論0 收藏0
從forEach到迭代器

摘要：本文從使用對數(shù)組進行遍歷開始說起，粗略對比使用進行遍歷的差異，并由此引入中可迭代對象迭代器的概念，并對其進行粗略介紹。說到這里，就繼續(xù)說一下迭代器關閉的情況了。確實，符合可迭代協(xié)議和迭代器協(xié)議的。本文從使用 forEach 對數(shù)組進行遍歷開始說起，粗略對比使用 forEach , for...in , for...of 進行遍歷的差異，并由此引入 ES6 中可迭代對象/迭代器的概...

rockswang 2019-08-23 12:36 評論0 收藏0