ES6新增Map和WeakMap(2018-06-08)

Map
    //Object對象
    {"name":"劉英","gender":1}

????ES5中的key鍵名的類型要求一定是字符串管钳,ES6 提供了Map結(jié)構(gòu)給我們使用钦铁,它跟Object對象很像,但是不同的是蹋嵌,它的key鍵名的類型不再局限于字符串類型了,它可以是各種類型的值葫隙;可以說栽烂,它比Object對象更加靈活了,當(dāng)然恋脚,也更加復(fù)雜了腺办。

Map的基本用法
    let m = new Map();
    let m = new Map([
            ["name","王大拿"],
            ["gender",1]
    ]);
    
    console.log(m);
    //打印結(jié)果:Map {"name" => "王大拿", "gender" => 1}
set( )方法

????set( )方法作用:給實(shí)例設(shè)置一對鍵值對,返回map實(shí)例糟描。

    let m = new Map();
    //set方法添加

    //添加一個(gè)string類型的鍵名
    m.set("name","王大拿");  
  
    //添加一個(gè)數(shù)字類型的鍵名
    m.set(1,2);

    console.log(m);
    //打印結(jié)果:Map {"name" => "王大拿", 1 => 2}

????set方法的使用很簡單怀喉,只需要給方法傳入key和value作為鍵名和鍵值即可。注意:第三行代碼中船响,我們傳入的key是數(shù)字1躬拢,這就證明了,Map結(jié)構(gòu)確實(shí)可以存儲非字符串類型的鍵名见间,當(dāng)然你還可以設(shè)置更多其它類型的鍵名聊闯,比如:

    //數(shù)組類型的鍵名
    m.set([1],2);

    //對象類型的鍵名
    m.set({"name":"Zhangsan"},2);

    //布爾類型的鍵名
    m.set(true,2);

    //Symbol類型的鍵名
    m.set(Symbol('name'),2);

    //null為鍵名
    m.set(null,2);

    //undefined為鍵名
    m.set(undefined,2);

????使用set方法的時(shí)候有一點(diǎn)需要注意,如果你設(shè)置一個(gè)已經(jīng)存在的鍵名米诉,那么后面的鍵值會覆蓋前面的鍵值菱蔬。

    let m = new Map();
    m.set("name","王大拿");
    console.log(m);
    //結(jié)果:Map {"name" => "王大拿"}

    //再次設(shè)置name的值
    m.set("name","隔壁老王");
    console.log(m);
    //結(jié)果:Map {"name" => "隔壁老王"}

get( )方法

????get( )方法作用:獲取指定鍵名的鍵值,返回鍵值史侣。

    let m = new Map([["name","劉英"]]);

    m.get("name");//結(jié)果:劉英
    m.get("gender");//結(jié)果:undefined

????get方法使用也很簡單拴泌,只需要指定鍵名即可。獲取存在對應(yīng)的鍵值惊橱,如果鍵值對存在蚪腐,就會返回鍵值;否則税朴,返回undefined削茁,這個(gè)也很好理解宙枷。

delete( )方法

????delete( )方法作用:刪除指定的鍵值對,刪除成功返回:true茧跋,否則返回:false慰丛。

let m = new Map();
    m.set("name","劉英");
    //結(jié)果:Map {"name" => "劉英"}

    m.delete("name");//結(jié)果:true
    m.delete("gender");//結(jié)果:false
clear( )方法

????跟Set結(jié)構(gòu)一樣,Map結(jié)構(gòu)也提供了clear( )方法瘾杭,讓你一次性刪除所有鍵值對诅病。

    let m = new Map();
    m.set("name","劉英");
    m.set("gender",1);

    m.clear();
    console.log(m);
    //打印結(jié)果:Map {}

????使用clear方法后,我們再打印一下變量m粥烁,發(fā)現(xiàn)什么都沒有贤笆,一個(gè)空的Map結(jié)構(gòu),說明clear方法起作用了讨阻。

has( )方法

????has( )方法作用:判斷Map實(shí)例內(nèi)是否含有指定的鍵值對芥永,有就返回:true,否則返回:false钝吮。

    let m = new Map();
    m.set("name","趙鐵柱");

    m.has('name');//結(jié)果:true
    m.has('age');//結(jié)果:false

Map實(shí)例中含有鍵名:name埋涧,就返回了true,鍵名age不存在奇瘦,就返回false棘催。

可遍歷

????我們可以使用ES6的新特性for...of來遍歷它的鍵名或者鍵值。

entries( )方法

entries( )方法作用:返回實(shí)例的鍵值對遍歷器耳标。

    let m = new Map([
            ["name","趙鐵柱"],
            ["age",25]
    ]);

    for(let [key,value] of m.entries()){
        console.log(key+'  '+value);
    }
    //打印結(jié)果:name  趙鐵柱
    //         age  25

????m.entries( ) 返回鍵值對的遍歷器醇坝,使用了for...of來遍歷這個(gè)遍歷器,得到的值分別賦值到key和value次坡,然后控制臺分別輸出它們呼猪。

keys( ) 和 values( ) 方法

????keys( )方法:返回實(shí)例所有鍵名的遍歷器。
????values( ) 方法:返回實(shí)例所有鍵值的遍歷器砸琅。

    let m = new Map([
        ["name","趙鐵柱"],
        ["age",25]
    ]);

    //使用keys方法獲取鍵名
    for(let key of m.keys()){
        console.log(key);
    }
    //打印結(jié)果:name
    //         age

    //使用values方法獲取鍵值
    for(let value of m.values()){
        console.log(value);
    }
    //打印結(jié)果:趙鐵柱
    //         25
forEach( )方法
    let m = new Map([
        ["name","趙鐵柱"],
        ["age",25]
    ]);
    
    m.forEach(function(value,key){
        console.log(key+':'+value);
    });
    //打印結(jié)果:name:趙鐵柱
    //         age:25

????forEach方法接收一個(gè)匿名函數(shù)郑叠,給匿名函數(shù)傳參value和key,分別是Map實(shí)例的鍵名和鍵值

size屬性

????獲取實(shí)例的成員數(shù)明棍。

    let m = new Map();
    m.set(1,3);
    m.set('1','3');

    m.size;//結(jié)果:2
WeakMap

????WeakMap結(jié)構(gòu)和Map結(jié)構(gòu)很類似乡革,不同點(diǎn)在于WeakMap結(jié)構(gòu)的鍵名只支持引用類型的數(shù)據(jù)。哪些是引用類型的值呢摊腋?比如:數(shù)組沸版,對象,函數(shù)兴蒸。

    let wm = new WeakMap();
    let wm = new WeakMap();

    //數(shù)組類型的鍵名
    wm.set([1],2);

    //對象類型的鍵名
    wm.set({'name':'Zhangsan'},2);

    //函數(shù)類型的鍵名
    function fn(){};
    wm.set(fn,2);

    console.log(wm);
    //打邮恿浮:WeakMap {
            [1] => 2, 
            Object {name: "Zhangsan"} => 2, 
            function => 2
            }
WeakMap和Map的區(qū)別

????如果是普通的值類型則不允許。比如:字符串橙凳,數(shù)字蕾殴,null笑撞,undefined,布爾類型钓觉。而Map結(jié)構(gòu)是允許的茴肥,這就是兩者的不同之處,謹(jǐn)記荡灾。
????跟Map一樣瓤狐,WeakMap也擁有g(shù)et、has批幌、delete方法础锐,用法和用途都一樣。不同地方在于荧缘,WeakMap不支持clear方法皆警,不支持遍歷,也就沒有了keys截粗、values信姓、entries、forEach這4個(gè)方法桐愉,也沒有屬性size财破。
????鍵名中的引用類型是弱引用掰派,你永遠(yuǎn)不知道這個(gè)引用對象什么時(shí)候會被垃圾回收機(jī)制回收了从诲,如果這個(gè)引用類型的值被垃圾機(jī)制回收了,WeakMap實(shí)例中的對應(yīng)鍵值對也會消失靡羡。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末系洛,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子略步,更是在濱河造成了極大的恐慌描扯,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,997評論 6 502
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件趟薄,死亡現(xiàn)場離奇詭異绽诚,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)杭煎,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,603評論 3 392
  • 文/潘曉璐 我一進(jìn)店門恩够,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人羡铲,你說我怎么就攤上這事蜂桶。” “怎么了也切?”我有些...
    開封第一講書人閱讀 163,359評論 0 353
  • 文/不壞的土叔 我叫張陵扑媚,是天一觀的道長腰湾。 經(jīng)常有香客問我,道長疆股,這世上最難降的妖魔是什么费坊? 我笑而不...
    開封第一講書人閱讀 58,309評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮押桃,結(jié)果婚禮上葵萎,老公的妹妹穿的比我還像新娘。我一直安慰自己唱凯,他們只是感情好羡忘,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,346評論 6 390
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著磕昼,像睡著了一般卷雕。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上票从,一...
    開封第一講書人閱讀 51,258評論 1 300
  • 那天漫雕,我揣著相機(jī)與錄音,去河邊找鬼峰鄙。 笑死浸间,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的吟榴。 我是一名探鬼主播魁蒜,決...
    沈念sama閱讀 40,122評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼吩翻!你這毒婦竟也來了兜看?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,970評論 0 275
  • 序言:老撾萬榮一對情侶失蹤狭瞎,失蹤者是張志新(化名)和其女友劉穎细移,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體熊锭,經(jīng)...
    沈念sama閱讀 45,403評論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡弧轧,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,596評論 3 334
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了碗殷。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片精绎。...
    茶點(diǎn)故事閱讀 39,769評論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖亿扁,靈堂內(nèi)的尸體忽然破棺而出捺典,到底是詐尸還是另有隱情,我是刑警寧澤从祝,帶...
    沈念sama閱讀 35,464評論 5 344
  • 正文 年R本政府宣布襟己,位于F島的核電站引谜,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏擎浴。R本人自食惡果不足惜联逻,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,075評論 3 327
  • 文/蒙蒙 一闽铐、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦支子、人聲如沸带膀。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,705評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至唤冈,卻和暖如春峡迷,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背你虹。 一陣腳步聲響...
    開封第一講書人閱讀 32,848評論 1 269
  • 我被黑心中介騙來泰國打工绘搞, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人傅物。 一個(gè)月前我還...
    沈念sama閱讀 47,831評論 2 370
  • 正文 我出身青樓夯辖,卻偏偏與公主長得像,于是被迫代替她去往敵國和親董饰。 傳聞我的和親對象是個(gè)殘疾皇子蒿褂,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,678評論 2 354