视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
JavaScript中Map对象的解析(附示例)
2020-11-27 19:29:45 责编:小采
文档


本篇文章给大家带来的内容是关于JavaScript中Map对象的解析(附示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

一、创建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实例属性

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
});

下载本文
显示全文
专题