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

資訊專欄INFORMATION COLUMN

es6學(xué)習之map和set

lvzishen / 1122人閱讀

摘要：和定義一組鍵值對的集合它是一組鍵值對的數(shù)據(jù)結(jié)構(gòu)，由于之前的鍵必須是字符串。

Map和Set Map 定義：一組鍵值對的集合

它是一組鍵值對的數(shù)據(jù)結(jié)構(gòu)，由于之前javascript的鍵（key）必須是字符串。為了使鍵可以是多種類型的于是在最新的es6中引入了map這種數(shù)據(jù)結(jié)構(gòu)，這樣可以加快查詢速度，類似于查字典

方法和屬性 
var m = map() //空map
m.set("學(xué)生年齡",6 ) //添加一對新的key-value
m.has("學(xué)生年齡") //是否存在key學(xué)生年齡 true
m.get("學(xué)生年齡") //拿到值 6
m.delete("學(xué)生年齡") // 刪除key學(xué)生年齡
m.clear()    //清除所有成員 沒有返回值
m.size() // 返回map結(jié)構(gòu)的成員總數(shù) 1

需要注意的是如果多次對相同key值插入value，前一次的value值會被覆蓋

map中的鍵實際是對內(nèi)存地址的引用，舉例說明

var k1 = 222；
var k2 = 222；
map
.set(k1, 123);
.set(k2, 222);

map.get(k1); // 123    
map.get(k2); // 222

因此如果鍵值是對象的話就算值相同也是兩個不同的鍵，如果是簡單類型的話（number，boolean，string），只要值相等，就是同一個鍵，0和-0也被map視為同一鍵，NaN也是同一鍵

遍歷map的方法

keys（）： 返回鍵名的遍歷器

values（）： 返回鍵值的遍歷器

entries（）：返回所有成員的遍歷器

forEach（）： 遍歷所有map成員

map遍歷的順序就是插入的順序

使用實例

var m = new map(
    ["F", "no"],
    ["t", "yes"]
);

for(let key of map.keys()) {
    console.log(key);
}
// f,t

for(let key of map.values()) {
    console.log(key);
}
// no, yes

for(let key of map) {
    console.log(key[0], key[1]);
}
// f no
// t yes

map.forEach( res => {
    console.log(res[0], res[1]);
});
// f no
// t yes

forEach方法還可以接受第二個參數(shù)，用來綁定this。

類型轉(zhuǎn)換

[ ] map如何轉(zhuǎn)換為數(shù)組

運用擴展運算符可以很方便的轉(zhuǎn)換

var m = map;
m.set("a", 1);
m.set("b", 2);

[...map];
// [["a",1], ["b",2]];

[ ] 數(shù)組轉(zhuǎn)換為map 

new Map([[true, 7], [{foo: 3}, ["abc"]]])
// Map {true => 7, Object {foo: 3} => ["abc"]}

[ ] map轉(zhuǎn)化為對象

如果鍵都是字符串

function mapToObj(strMap) {
    let obj = Object.create(null);
    for(let [k,v] of strMap) {
        obj[k] = v
    }
    return obj;
}

let map = new Map().set("yes",111);
mapToObj(map);
// {yes: 111};

[ ] 對象轉(zhuǎn)為map 

function objToMap(obj) {
    let map = new Map();
    for(let k of obj.keys()) {
        map.set(k.obj[k]);
    }
    return map;
}

objToStrMap({yes: true, no: false});
// [ [ "yes", true ], [ "no", false ] ]

[ ] map轉(zhuǎn)化為json

如果map鍵名都是字符串的話，可以轉(zhuǎn)化為對象json

function mapToJson(strMap) {
    return JSON.stringify(mapToObj(strMap)); // map轉(zhuǎn)化為對象在轉(zhuǎn)化為json    
}

let map = new Map().set("yes", 111);
strMapToJson(myMap)
// "{"yes":true,"no":false}"

如果鍵名時非字符串的話，轉(zhuǎn)化為數(shù)組json

function mapToJson1(strMap) {
    return JSON.stringify([...strMap]); //map轉(zhuǎn)化為數(shù)組在轉(zhuǎn)化為數(shù)組json
}

let myMap = new Map().set(true, 7).set({foo: 3}, ["abc"]);
mapToArrayJson(myMap)
// "[[true,7],[{"foo":3},["abc"]]]"

json轉(zhuǎn)化為map同理只是return的是JSON.parse()方法 也分為鍵名是字符串和非字符串

Set 特點

類型于數(shù)組。但是它的成員值都是唯一的，可以用來做數(shù)組去重

構(gòu)造函數(shù) 
var a = new Set([1,2,2,3,4,555,5,5,6]);
[...a];
// [1,2,3,4,555,6];

這是一個數(shù)組去重的例子在set內(nèi)部如果有兩個NAN會去掉一個

方法

add（value）: 添加值 返回set結(jié)構(gòu)本身

delete（value）： 刪除某個值 返回布爾值 表示是否刪除成功

has（value）： 返回布爾值 表示該值是否為set的成員

clear（）： 清除所有成員

數(shù)組去重的兩種方法

var arr = [1,2,3,4,4,5];
var aSet = new Set(arr);
[...aSet];
//[1,2,3,4,5] 

var bSet = new Set(arr);
arr = Array.from(bSet); // [1,2,3,4,5]

由于set的keys（）和values（）完全一樣所以無法通過set[xxx]的方式找到其內(nèi)部的值，

遍歷set的方法

keys（）： 返回鍵名和遍歷器

values（）： 返回鍵值和遍歷器

entires（）： 返回鍵值對的遍歷器

forEach（）： 使用回調(diào)函數(shù)遍歷每個成員

  let set = new Set(["red", "green", "blue"]);
  
  for (let item of set.keys()) {
    console.log(item);
  }
  // red
  // green
  // blue
  
  for (let item of set.values()) {
    console.log(item);
  }
  // red
  // green
  // blue
  
  for (let item of set.entries()) {
    console.log(item);
  }
  // ["red", "red"]
  // ["green", "green"]
  // ["blue", "blue"]

forEach對空數(shù)組不會執(zhí)行回調(diào)函數(shù)

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/103305.html

相關(guān)文章

  • ES6學(xué)習之 -- 解構(gòu)（使數(shù)據(jù)訪問更便捷）

    摘要：數(shù)組的解構(gòu)賦值規(guī)定允許按照一定模式，從數(shù)組和對象中提取值對變量進行賦值，我們稱之為解構(gòu)。的規(guī)則是，只要有可能導(dǎo)致解構(gòu)的歧義，就不得使用圓括號。 數(shù)組的解構(gòu)賦值 ES6規(guī)定：允許按照一定模式，從數(shù)組和對象中提取值對變量進行賦值，我們稱之為解構(gòu)。以前賦值只能直接指定值 let a = 1; let b = 2; let c = 3; ES6允許以下這種做法 let [a, b, c] = ...

    mrcode 評論0 收藏0

  • ES6學(xué)習之 -- Set數(shù)據(jù)結(jié)構(gòu)

    摘要：類似于數(shù)組，但是中不存在重復(fù)元素?？梢越邮芤粋€數(shù)組或者其他具有接口的數(shù)據(jù)結(jié)構(gòu)作為參數(shù)從上面的代碼可以看出有去重的功能。去重還有另一個方法將數(shù)據(jù)結(jié)構(gòu)的數(shù)據(jù)轉(zhuǎn)換成數(shù)組。清除實例的指定成員。返回一個布爾值，表示某個值是否在實例之中。 Set Set類似于數(shù)組，但是Set中不存在重復(fù)元素。Set可以接受一個數(shù)組（或者其他具有itarable接口的數(shù)據(jù)結(jié)構(gòu)）作為參數(shù) const set = ne...

    wawor4827 評論0 收藏0

  • Vim入門學(xué)習之二(cheat sheet)

    摘要：有種東西學(xué)了記不住，是正則表達式，就是了。最近在用寫個，我一個按鍵盤的，又沒什么太多的閑錢去購買高大上的，不得已開始用上了學(xué)的好多遍都沒學(xué)會的。 有10種東西學(xué)了記不住，00是正則表達式，10就是Vim了。 最近在用python寫個side project，我一個按鍵盤的，又沒什么太多的閑錢去購買高大上的IDE，不得已開始用上了學(xué)的好多遍都沒學(xué)會的Vim。Vim有多牛X，隨便問一個代碼...

    Shimmer 評論0 收藏0

  • Vim入門學(xué)習之二(cheat sheet)

    摘要：有種東西學(xué)了記不住，是正則表達式，就是了。最近在用寫個，我一個按鍵盤的，又沒什么太多的閑錢去購買高大上的，不得已開始用上了學(xué)的好多遍都沒學(xué)會的。 有10種東西學(xué)了記不住，00是正則表達式，10就是Vim了。 最近在用python寫個side project，我一個按鍵盤的，又沒什么太多的閑錢去購買高大上的IDE，不得已開始用上了學(xué)的好多遍都沒學(xué)會的Vim。Vim有多牛X，隨便問一個代碼...

    muzhuyu 評論0 收藏0

  • Java 容器學(xué)習之 HashMap

    摘要：底層的數(shù)據(jù)結(jié)構(gòu)就是數(shù)組鏈表紅黑樹，紅黑樹是在中加進來的。負載因子哈希表中的填滿程度。 前言 把 Java 容器的學(xué)習筆記放到 github 里了，還在更新~其他的目前不打算抽出來作為文章寫，感覺挖的還不夠深，等對某些東西理解的更深了再寫文章吧Java 容器目錄如下： Java 容器 一、概述 二、源碼學(xué)習 1. Map 1.1 HashMap 1.2 LinkedHashM...

    Alex 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<