概念
Map 是 JavaScript 中的一种数据结构,它允许你存储键值对,并且可以通过键来访问对应的值。在本教程中,我们将学习如何声明、添加、删除、获取和遍历 Map 集合。
ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合。但是 “键” 的范围不限于字符串,各种类型的值(包括对象)都可以当作键。Map 也实现了 iterator 接口,所以可以使用『扩展运算符』和「for…of…』进行遍历。Map 的属性和方法。
Map_6">声明 Map
首先,我们需要声明一个 Map 对象。在 JavaScript 中,你可以使用 new Map()
来创建一个新的 Map 实例。
let m = new Map();
Map_14">Map的属性和方法:
- size:返回Map的元素个数。
- set(key, value):增加一个新元素,返回当前Map。
- get(key):返回键名对象的键值。
- has(key):检测Map中是否包含某个元素,返回boolean值。
- clear():清空集合,返回undefined。
添加元素
你可以使用 set
方法向 Map 中添加元素。set
方法接受两个参数:键和值。
m.set('name', '星达网络');
m.set('change', function() {console.log("我们可以改变你!!");
});
let key = {school: 'xkadmin'
};
m.set(key, ['北京', '上海', '深圳']);
获取元素数量
你可以使用 size
属性来获取 Map 中元素的数量。
console.log(m.size);
删除元素
你可以使用 delete
方法从 Map 中删除指定的键值对。
m.delete('name');
获取元素
你可以使用 get
方法获取 Map 中指定键的值。
console.log(m.get('change'));
console.log(m.get(key));
Map_62">清空 Map
你可以使用 clear
方法清空 Map 中的所有元素。
m.clear();
Map_70">遍历 Map
你可以使用 for...of
循环来遍历 Map 中的所有键值对。
for(let v of m) {console.log(v);
}
完整代码示例
下面是一个完整的代码示例,展示了如何使用 Map 集合。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Map</title>
</head>
<body><script>//声明 Maplet m = new Map();//添加元素m.set('name', '星达网络');m.set('change', function() {console.log("我们可以改变你!!");});let key = {school: 'xkadmin'};m.set(key, ['北京', '上海', '深圳']);//sizeconsole.log(m.size);//删除m.delete('name');//获取console.log(m.get('change'));console.log(m.get(key));//清空// m.clear();//遍历for(let v of m) {console.log(v);}// console.log(m);</script>
</body>
</html>