JavaScript的ES6新增数据类型Map与Set

最新推荐文章于 2024-09-25 00:00:00 发布

《 L 》

最新推荐文章于 2024-09-25 00:00:00 发布

阅读量1.1k

点赞数

文章标签： javascript es6 前端

本文链接：https://blog.csdn.net/qq_52273362/article/details/126658865

版权

本文介绍了ES6中新增的Set和Map数据类型，Set用于存储唯一值集合，Map则类似对象但键值对可重复。通过实例演示了它们的创建、操作方法以及特点，如Set的add、delete和forEach，Map的size、set和get等。

摘要由CSDN通过智能技术生成

Map和Set是ES6新增的两个数据类型，都是属于内置构造函数，使用new的方式来实例化使用

一、Set:是一个数据集合，可以在new的时候直接向内部添加数据

1. 实例化后输出：const s = new Set(); console.log(s)

2. 实例化添加数据时必须以数组的形式添加数据：

const s = new Set([1,2,3,{},function(){},true,'hello']);

console.log(s)

3. 不能把Set当做数组的数据结构来使用，他只是单独的Set数据结构

4. Set常用方法和属性：

以下用到的s为自定义的变量名

（1）size属性：用来获取该数据结构中有多少数据，类似于数组中的数组长度,语法：s.size

（2）add方法：用来向该数据类型中追加数据，类似于数组中的push()方法,语法：s.add('hello')

（3）delete方法：用来删除数据结构中的某一个数据，语法：s.delete(索引号)

（4）clear方法：用来清空数据结构中的所有数据，语法：s.clear()

（5）forEach方法：用来遍历Set数据结构的方法，语法：s.forEach(function(item){ console.log(item)}),这个方法将会输出所有的Let数据

（6）获取Set结构里面的数据需要借助展开运算符（...），语法：

const str = new Set([10, 20, 13])
        const arr = [...str]
        console.log('arr', arr);// [10, 20, 13]
        console.log(arr[0]);//10
        console.log([...str][0]);//10

（7）Set数据类型的特点：不允许存储重复的数据，当添加重复的数据或者数据结构中存在重复数据时，只会显示一个，自动过滤重复数据：

示例：

<script>
        var newArr = [12, 23, 45, 6, 12, 6, 23]
        const n = new Set(newArr)
        console.log(n);//{12, 23, 45, 6}
</script>

二、Map是一个数据集合，是一个类似于对象的数据集合

1. 语法：

const m = new Map()

console.log(m)

2. 常用方法和属性

（1）size:用来获取数据的个数，和Set的使用类似，语法：s.size

（2）delete: 用来删除数据集中的某一个数据，语法：s.delete(要删除的数据)

（3）set：用来向该数据集中添加数据使用，语法：s.set(要添加的数据)

（4）get：用来获取数据集中的某一个数据，语法：s.get(需要获取的数据)

（5）has：用来判断数据集合中是否存在某一个数据，语法：s.has(判断是否存在的数据)

示例：