亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

【金秋打卡】第17天Map的方法與屬性

標簽:
前端工具

一、课程名称:前端工程师2022版

二、课程章节:ES6语法扩展-Set和Map数据结构

三、课程讲师:Alex

四、课程内容

1、Map是什么

(1)认识Map

Map翻译过来是''映射''的意思(但不推荐使用这个翻译,因为翻译有时候会失真),Map与对象类似,Map和对象本质上都是键值对的集合(即聚集在一起)

      const m = new Map();

      // 使用set方法添加键值对

      m.set("name", "alex");

      m.set("age", 18);

      console.log(m);   //Map(2) {'name' => 'alex', 'age' => 18}

(2)Map和对象的区别

1)对象一般是使用字符串当作键,即使传引用类型,也会被转为字符串

 https://img1.sycdn.imooc.com/6369d7380001450504200237.jpg

2)以下类型都可以作为Map的键

①基本数据类型:数字、字符串、布尔值、undefined、null

②引用数据类型:对象([]、{}、函数、Set、Map等)

      const m = new Map();

      m.set("name", "alex");

      m.set(true, "true"); //前面的true没有加引号,是布尔类型,不是字符串

      m.set({}, "object");

      m.set(new Set([1, 2]), "set");

      m.set(undefined, "undefined"); //前面的undefined没有加引号,就是undefined类型

      m.set(null, "null");

      console.log(m);

 

2、Map实例的方法和属性

(1)方法

1)set:可以往Map里面添加成员,键如果已经存在,后添加的键值对覆盖已有的

      const m = new Map();

      m.set("age", 18).set(true, "true").set("age", 20);

      console.log(m); //Map(2) {'age' => 20, true => 'true'}

2)get:可以获取Map中的成员,当get获取不存在的成员时,返回undefined

      console.log(m.get("age")); //20

      console.log(m.get("true")); //undefined

      console.log(m.get(true)); //true

3)has:可以判断是否有某个成员,返回值时布尔值

      console.log(m.has("age")); //true

      console.log(m.has("true")); //false

4)delete:可以删除某个成员,使用delete删除不存在的成员,什么都不会发生,也不会报错

    m.delete('age');

    m.delete('name');

    console.log(m); //Map(1) {true => 'true'}

5)clear:可以清空Map中的全部成员

      m.clear();

      console.log(m); //Map(0) {size: 0}

6)forEach:可以遍历Map,此时参数key不再和value一样了,因为Map中有key

 https://img1.sycdn.imooc.com/6369d72c00018cb804200237.jpg

      m.forEach(function (value, key, map) {

        console.log(value, key, map); //如:20 'age' Map(2) {'age' => 20, true => 'true'}

        console.log(value, key, map === m); //true

        console.log(this);  //#document

      },document);

(2)属性:(只有一个)size,可以用来获取Map中键值对的个数,这是对象没有的功能 console.log(m.size);  //2

五、课程心得

今天初步学习了Map的相关知识,在与Set、对象的对比学习中,知识点还是比较容易掌握的,期待后面的学习容。


點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消