ECMAScript 2015(ES6)中的 Map 和 Set 数据结构简介
ECMAScript 2015(ES6)是一种JavaScript的一种版本,其中包含了一些新的数据结构,其中就包括了 Map 和 Set。
Map 和 Set 的出现可以提高我们在开发中的效率和代码的可读性,本文将详细介绍这两种数据结构的使用方法。
一、Map
1、Map 简介
Map 是一种数据结构,它是一组键值对的集合,其中每个键值对可能是不同的类型。它可以让我们存储任何类型的数据,通常用于存储对象的键值对,它类似于对象(Object)数据结构,但是对象的键只能是字符串或者 Symbol 类型。
2、Map 用法
使用 Map 可以通过以下几个步骤:
- 创建 Map 对象
const map = new Map();
- 添加键值对
map.set("key1", "value1"); map.set("key2", "value2");
- 查询键值对
map.get("key1");
- 删除键值对
map.delete("key1");
- 查询 Map 中是否存在某个键
map.has("key1");
- 遍历 Map 对象
map.forEach((value, key) => {
console.log(${key}: ${value}
);
});
3、Map 实例
在下面这个例子中,我将使用 Map 存储一些信息。
const myMap = new Map(); const key1 = { name: "Lucy" }; const key2 = { age: 18 };
myMap.set(key1, "Lucy is a girl's name."); myMap.set(key2, "Lucy is not 18 years old.");
console.log(myMap.get(key1)); // Lucy is a girl's name. console.log(myMap.get(key2)); // Lucy is not 18 years old.
4、Map 中的常见方法
- set(key, value): 在 Map 中添加一个键值对。
- get(key): 返回一个键的值。
- delete(key): 从 Map 中删除一个键值对。
- has(key): 返回一个布尔值,表示 Map 中是否存在指定键名的键值对。
- clear(): 清除 Map 中的键和值。
- size: 返回 Map 中存储的键值对数量。
二、Set
1、Set 简介
Set 是一种数据结构,它类似于数组,但是它的成员是唯一的,没有重复的值。Set 不会进行类型转换,也就是说如果加入一个字符串值,即使它与一个数值或其他类型的值相同,它也会被视为一个单独的值。
2、Set 用法
使用 Set 可以通过以下几个步骤:
- 创建 Set 对象
const mySet = new Set();
- 添加元素
mySet.add(1); mySet.add("hello"); mySet.add(1); // 添加重复的元素,但是 Set 中会忽略掉
- 删除元素
mySet.delete(1);
- 查询元素
mySet.has("hello");
- 遍历 Set 对象
mySet.forEach((value) => { console.log(value); });
3、Set 实例
在下面这个例子中,我将使用 Set 存储一些信息。
const mySet = new Set(); mySet.add(1); mySet.add(2); mySet.add(3); mySet.add(2); // 添加重复的元素
console.log(mySet.size); // 3
mySet.delete(2);
console.log(mySet.has(3)); // true
mySet.forEach((value) => { console.log(value); });
4、Set 中的常见方法
- add(value): 在 Set 中添加一个新的值。
- delete(value): 从 Set 中删除一个值。
- has(value): 返回一个布尔值,表示 Set 中是否存在指定值。
- clear(): 清除所有的值。
- size: 返回 Set 中的元素数量。
总结
在ES6中,Map 和 Set 数据结构使我们在开发中更加高效和代码可读性更高。我们可以从ES6中获得其他强大的新特性,以及更好的JavaScript编码能力。我们需要了解它们的使用方法和常见的方法,并在需要的地方进行使用。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64812a8548841e9894095b47