一、创建Map对象

Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值

1.构造函数

语法:new Map([iterable])
参数:

        iterable  可以是一个数组或者其他 iterable 对象,其元素或为键值对,或为两个元素的数组;每个键值对都会添加到新的 Map,null 会被当做 undefined


let arr = [1,2,3];
let myMap = new Map(arr.entries());
console.log(myMap.get(0)); // 1

二、Map实例属性

1.myMap.size 可访问属性返回 Map 对象的元素数量

size 属性的值是一个整数,表示 Map 对象有多少个键值对。size 是只读属性,它对应的 set 方法是 undefined,即不能改变它的值


let myMap = new Map();
myMap.set("a", "alpha");
myMap.set("b", "beta");
myMap.set("g", "gamma");
console.log(myMap.size); // 3

三、Map实例方法

1.set()

语法:myMap.set(key, value)

参数:
        key 必填,添加到Map对象的元素的key值
        value 必填,添加到Map对象的元素的value值


let myMap = new Map();
myMap.set("bar", "foo");
myMap.set(1, "foobar");
// 在Map对象中更新一个新元素
myMap.set("bar", "baz");

2.get()

语法:myMap.get(key)

参数:
        key 想要获取的元素的键

返回值:返回一个Map对象中与指定键相关联的值,如果找不到这个键则返回undefined


let myMap = new Map();
myMap.set("bar", "foo");
console.log(myMap.get("bar")); // "foo"
console.log(myMap.get("baz")); // undefined

3.has()

语法:myMap.has(key)

参数:
         key 必填,用来检测是否存在指定元素的键值

返回值:如果指定元素存在于Map中,则返回true。其他情况返回false


let myMap = new Map();
myMap.set("bar", "foo");
console.log(myMap.has("bar")); // returns true
console.log(myMap.has("baz")); // returns false

4.delete() 方法用于移除 Map 对象中指定的元素

语法:myMap.delete(key)

参数:
        key 必须,从 Map 对象中移除的元素的键(key)

返回值:如果 Map 对象中存在该元素,则移除它并返回 true;否则如果该元素不存在则返回 false


let myMap = new Map();
myMap.set("bar", "foo");
myMap.delete("bar"); // 返回 true。成功地移除元素
console.log(myMap.size); // 0

5.clear()方法会移除Map对象中的所有元素

语法:myMap.clear()


let myMap = new Map();
myMap.set("bar","baz");
myMap.set(1,"foo");
console.log(myMap.size); // 2
myMap.clear();

6.entries()

语法:myMap.entries()

返回值:返回一个新的包含[key, value]对的Iterator对象,返回的迭代器的迭代顺序与Map对象的插入顺序相同


let myMap = new Map();
myMap.set("0", "foo");
myMap.set(1, "bar");
myMap.set({}, "baz"); let mapIter = myMap.entries();
console.log(mapIter.next().value); // ["0", "foo"]
console.log(mapIter.next().value); // [1, "bar"]
console.log(mapIter.next().value); // [Object, "baz"]

7.keys() 返回一个新的 Iterator 对象。它包含按照顺序插入Map对象中每个元素的key值

语法:myMap.keys()


let myMap = new Map();
myMap.set("0", "foo");
myMap.set(1, "bar");
myMap.set({}, "baz"); let mapIter = myMap.keys();
console.log(mapIter.next().value); // "0"
console.log(mapIter.next().value); // 1
console.log(mapIter.next().value); // Object

8.values() 方法返回一个新的Iterator对象。它包含按顺序插入Map对象中每个元素的value值

语法:myMap.values()


let myMap = new Map();
myMap.set("0", "foo");
myMap.set(1, "bar");
myMap.set({}, "baz"); let mapIter = myMap.values();
console.log(mapIter.next().value); // "foo"
console.log(mapIter.next().value); // "bar"
console.log(mapIter.next().value); // "baz"

9.forEach()

语法:myMap.forEach(callback[, thisArg])

参数:
        callback 必要,每个元素所要执行的函数
        thisArg 可选,callback 执行时其 this 的值


let myMap = new Map([["foo", 3], ["bar", {}], ["baz", undefined]]);
myMap.forEach((value,key,map) => {
console.log("key =",key,",value =",value); //key = foo ,value = 3
});

原文地址:https://segmentfault.com/a/1190000016724865

JavaScript基础对象---Map的更多相关文章

  1. 在TypeScript中扩展JavaScript基础对象的功能

    最近工作中用到,记录一下:假设我们需要一个功能,把一个数字比如10000输出为下面的字符串格式“10,000”,一般是写一个方法,那么我希望更方便一点,直接向Number类型添加一个格式化方法,比如叫 ...

  2. JavaScript基础-对象<2>

    2.浏览器环境提供对象 (1) document对象 doucument对象属性: title:文本标题.doucument.title="Welcome"; lastModifi ...

  3. JavaScript基础-对象<1>

    1.JavaScript内部对象属性和方法 (1)内置String对象 String 对象是JavaScript的核心对象之一. 创建一个sting对象: var a="this defin ...

  4. JavaScript基础对象---Number

    一.创建Number实例对象 /** * new Number(value); * value 被创建对象的数字值 * * Number 对象主要用于: 如果参数无法被转换为数字,则返回 NaN. 在 ...

  5. JavaScript基础对象创建模式之单体/单例模式(Singleton)

    首先,单例模式是对象的创建模式之一,此外还包括工厂模式.单例模式的三个特点: 1,该类只有一个实例 2,该类自行创建该实例(在该类内部创建自身的实例对象) 3,向整个系统公开这个实例接口 Java中大 ...

  6. JavaScript基础对象创建模式之链式调用模式(Chaining Pattern)(029)

    链式调用模式允许一个接一个地调用对象的方法.这种模式不考虑保存函数的返回值,所以整个调用可以在同一行内完成: myobj.method1("hello").method2().me ...

  7. JavaScript基础对象创建模式之对象的常量(028)

    虽然许多编程语言提供了const关键字来支持常量的声明,但JavaScript里没有表示常量的语义.我们可以用全大写的方式来声明变量,表明它实际上是个常量: Math.PI; // 3.1415926 ...

  8. JavaScript基础对象创建模式之静态成员(027)

    在支持“类”的面向对象语言中,静态成员指的是那些所有实例对象共有的类成员.静态成员实际是是“类”的成员,而非“对象”的成员.所以如果 MathUtils类中有个叫 max()的静态成员方法,那么调用这 ...

  9. JavaScript基础对象创建模式之模块模式(Module Pattern)(025)

    模块模式可以提供软件架构,为不断增长的代码提供组织形式.JavaScript没有提供package的语言表示,但我们可以通过模块模式来分解并组织 代码块,这些黑盒的代码块内的功能可以根据不断变化的软件 ...

随机推荐

  1. bzoj 1396: 识别子串 && bzoj 2865: 字符串识别【后缀数组+线段树】

    根据height数组的定义,和当前后缀串i最长的相同串的长度就是max(height[i],height[i+1]),这个后缀贡献的最短不同串长度就是len=max(height[i],height[ ...

  2. bzoj 5015 [Snoi2017]礼物

    题面 https://www.lydsy.com/JudgeOnline/problem.php?id=5015 题解 首先把k=1,k=2,k=3的手推一遍 然后发现一些规律 就是数列可以表示成$a ...

  3. python_11(网络编程)

    第1章 ucp协议 1.1 特性 1.2 缺陷 1.3 UDP协议实时通信 第2章 socket的更多方法 2.1 面向锁的套接字方法 2.1.1 blocking设置非阻塞 2.1.2 Blocki ...

  4. 在虚拟机里安装windows或Linux系统时,安装窗口过大按钮有时点不到解决办法(图文详解)

    不多说,直接上干货! 问题详情 解决办法 很简单快捷的解决办法,就是快捷键ALT+F7,可以拖动窗口的位置. 成功!

  5. gulp插件之gulp-mock-server

    本文讲gulp-mock-server的应用,用于虚拟一个服务器,模拟后台返回json数据给前端,这样可以一定程度上实现前后端分离,约定好接口之后,前后端即可同时开发,从而提高效率. 在gulpfil ...

  6. AJPFX浅谈Java性能优化之finalize 函数

    ★finalize 函数的调用机制 俺经常啰嗦:“了解本质机制的重要性”.所以今天也得先谈谈 finalize 函数的调用机制.在聊之前,先声明一下:Java虚拟机规范,并没有硬性规定垃圾回收该不该搞 ...

  7. calc() 计算CSS属性值

    calc()是css3的一个新增的功能,用来指定元素的长度.比如说,你可以使用calc()给元素的border.margin.pading.font-size和width等属性设置动态值.calc() ...

  8. IDEA下MyBatis错误总结

    1. Pom.xml配置 语法顺序 <properties resource="config.properties"> </properties> < ...

  9. Xilinx HLS

    Xilinx 的高层次综合(High Level Synthesis, HLS)技术是将C/C++/SystemC软件语言转换成Verilog或VHDL硬件描述语言的技术.现已应用在SDAccel,S ...

  10. 洛谷 P1006 传纸条

    题目描述 小渊和小轩是好朋友也是同班同学,他们在一起总有谈不完的话题.一次素质拓展活动中,班上同学安排做成一个m行n列的矩阵,而小渊和小轩被安排在矩阵对角线的两端,因此,他们就无法直接交谈了.幸运的是 ...