ES6中的Map
今天小编和大家一起探讨一下引用类型中的map,在其中会有一些map与数组联合应用,还有和map类似的weakmap类型的说明,这篇文章同时也增加了一些操作数组的办法和实际应用。大家也可以关注我的微信公众号,蜗牛全栈。
一、map的声明
let s = new Set([1,2,3])
console.log(s) // Set(3){1,2,3}
// map中的数据不会出现重复的情况,如果重复,会将重复的元素去掉。可以应用这一特性,对数组进行去重等处理
let s = new Set([1,2,3,1])
console.log(s) // Set(3){1,2,3}
二、向map中添加元素:使用add方法
let s = new Set([1,2,3])
s.add("school")
console.log(s) // Set(4){1,2,3,"school"}
// 可以通过链式添加,将元素添加到map中
let s = new Set([1,2,3])
s.add("school").add("bus")
console.log(s) // Set(5){1,2,3,"school","bus"}
三、删除map中的元素:使用delete方法
let s = new Set([1,2,3])
s.delete(2)
console.log(s) // Set(2){1,3}
四、清空map内的全部元素:调用clear方法
let s = new Set([1,2,3])
s.clear()
console.log(s) // Set(0){}
五、判断map中是否含有某个元素:调用has方法
let s = new Set([1,2,3])
console.log(s.has(2)) // true
六、获取map中元素个数:调用size
let s = new Set([1,2,3])
console.log(s.size) // 3
七、map的遍历
let s = new Set([1,2,3])
s.forEach(item => console.log(item)) // 1 2 3 for(let item of s){
console.log(item) // 1 2 3
} for(let item of s.keys()){
console.log(item) // 1 2 3
} for(let item of s.values()){
console.log(item) // 1 2 3
} // 对于map,key和value是一样的
for(let item of s.entries()){
console.log(item) // [1,1] [2,2] [3,3]
}
八、实际应用
1、数组去重
let arr = [1,2,3,3,3,2,1]
let s = new Set(arr)
console.log(s) // Set(3){1,2,3}
console.log([...s]) // [1,2,3]
console.log(Array.from(s)) // [1,2,3]
2、数组合并后去重
let arr1 = [1,2,3,4]
let arr2 = [2,3,4,5,6]
let s = new Set([...arr1,...arr2])
console.log(s) // Set(6){1,2,3,4,5,6}
console.log([...s]) // [1,2,3,4,5,6]
console.log(Array.from(s)) // [1,2,3,4,5,6]
3、求两个数组的交集
let arr1 = [1,2,3,4]
let arr2 = [2,3,4,5,6]
let s1 = new Set(arr1)
let s2 = new Set(arr2)
let result = new Set(arr1.filter((item) => s2.has(item)))
console.log(result) // Set(3){2,3,4}
4、求两个数组差集
let arr1 = [1,2,3,4]
let arr2 = [2,3,4,5,6]
let s1 = new Set(arr1)
let s2 = new Set(arr2)
let s3 = new Set(arr1.filter((item) => !s2.has(item)))
let s4 = new Set(arr2.filter((item) => !s1.has(item)))
console.log(s3) // Map(1){1}
console.log(s4) // Map(1){5,6}
console.log([...s3,...s4]) // [1,5,6]
九、WeakMap:里面只能存放Object,不能存放其他数据类型
let ws = new WeakSet()
// ws.add(1) // 报错:因为1不是Object类型,不能添加到WeakMap中
ws.add({
name:"lilei"
})
ws.add({
age:12
})
console.log(ws) // WeakSet{{...},{...}}
1、删除对象
let ws = new WeakSet()
// ws.add(1) // 报错:Invalid value used in weak set
ws.add({
name:"lilei"
})
ws.add({
age:12
})
ws.delete({
name:"lilei"
})
console.log(ws) // WeakSet{{...},{...}} 删除之后没有生效,因为对象是引用数据类型,添加对象的地址和删除元素的地址不一致,导致不能删除
let ws = new WeakSet()
const obj1 = {name:"lilei"}
const obj2 = {age:12}
ws.add(obj1)
ws.add(obj2)
console.log(ws) // WeakSet{{...},{...}} ws.delete(obj1)
console.log(ws) // WeakSet{{...}} // 已经删除了{name:"lilei"}内容,主要就是因为对象属于引用类型,直接在delete写对象与前一个对象在堆内存中指向的不是同一个地址
console.log(ws.has(obj2)) // true 判断内部是否含有obj2对象,与map相同,使用has函数
2、循环遍历:js中不能对WeakMap类型数据进行循环遍历,这个与垃圾回收(GC)有关,具体机制小编还不是很清楚,在今后的文章中会补上这一课。
let ws = new WeakSet()
const obj1 = {name:"lilei"}
const obj2 = {age:12}
ws.add(obj1)
ws.add(obj2)
ws.forEach(item => console.log(item)) // 报错:ws.forEach is not a function
ES6中的Map的更多相关文章
- ES6 中的 Map和Set
集合的概念以及和数组的区别 其实数组也是集合, 只不过数组的索引是数值类型.当想用非数值类型作为索引时, 数组就无法满足需要了. 而 Map 集合可以保存多个键-值对(key-value), Set ...
- ES6中的Map集合(与java里类似)
Set类型可以用来处理列表中的值,但是不适用于处理键值对这样的信息结构.ES6也添加了Map集合来解决类似的问题 一.Map集合 JS的对象(Object),本质上是键值对的集合(Hash结构),但是 ...
- 彻底弄懂ES6中的Map和Set
Map Map对象保存键值对.任何值(对象或者原始值) 都可以作为一个键或一个值.构造函数Map可以接受一个数组作为参数. Map和Object的区别 一个Object 的键只能是字符串或者 Symb ...
- ES6中的Set和Map集合
前面的话 在ES6标准制定以前,由于可选的集合类型有限,数组使用的又是数值型索引,因而经常被用于创建队列和栈.如果需要使用非数值型索引,就会用非数组对象创建所需的数据结构,而这就是Set集合与Map集 ...
- ES6中map数据结构学习
在项目中遇到一个很恶心的需求,然后发现ES6中的map可以解决,所以简单学习了一下map. Javascript的Object本身就是键值对的数据结构,但实际上属性和值构成的是“字符串-值”对,属性只 ...
- ES6 Set 和 Map
ES5 模拟Set 与 Map 集合 Set 常用于检查对象中是否存在某个键名 Map集合常被用于获取已存的信息 所有对象的属性名必须是字符串,那么必须确保每个键名都是字符串类型且在对象中是唯一的 数 ...
- ES6新特性:Javascript中的Map和WeakMap对象
Map对象 Map对象是一种有对应 键/值 对的对象, JS的Object也是 键/值 对的对象 : ES6中Map相对于Object对象有几个区别: 1:Object对象有原型, 也就是说他有默认的 ...
- ES6中的Set、Map数据结构
Map.Set都是ES6新的数据结构,他们都是新的内置构造函数.也就是说typeof的结果,多了两个. 他们是什么: Set是不能重复的数组. Map是可以任何东西当做键的对象: ES6 提供 ...
- ES6中Set 和 Map用法
JS中Set与Map用法 一.Set 1.基本用法 ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. ...
随机推荐
- php 获取某数组中出现次数最多的值(重复最多的值)与出现的次数
1.$arr = array(7,7,8,9,10,10,10); $arr = array_count_values($arr); // 统计数组中所有值出现的次数 arsort($arr); ...
- $ git push -u origin master 报错
输入$ git push -u origin master报permission denied(publickey) 如下: 原因是没有与gitee上的账号成功建立密钥对,所以需要配对密钥 解决方法( ...
- 关于调试器中int3断点引发异常的思考
INT3断点 INT3断点是利用0Xcc指令实现的,cpu在执行0xcc指令时会引发断点异常调试器会捕捉这个异常. INT3断点引发的异常属于陷阱型异常,在执行完0xcc指令后eip指向下一条指令.但 ...
- linux跨文件复制粘贴
跨文件是这样的: 复制a.txt的第20行至第30行到b.txt中vi a.txt:2010yy:e b.txtp
- BUAAOO第四单元总结与学期回顾
第四单元架构设计 第四单元要完成的是对给定UML元素的建模/统计/分析,考虑到UML元素的组织是树状的,很容易想到基于树状的数据结构完成 由于UML元素已经由官方接口给出,因此结点类采用wrapper ...
- 关于Annotation注解的理解
在编Java程序的时候,我们经常会碰到annotation.比如:@Override 我们在子类继承父类的时候,会经常用到这个annotation.它告诉编译器这个方法是override父类的方法的. ...
- SpringBoot整合shiro系列-SpingBoot是如何将shiroFilter注册到servlet容器中的
一.先从配置类入手,主要是@Bean了一个ShiroFilterFactoryBean: @Data @Configuration @Slf4j @EnableConfigurationPropert ...
- [bug] vscode output 输出乱码
参考 https://blog.csdn.net/qq_34192032/article/details/105077173 https://blog.csdn.net/a19990412/artic ...
- [Java] 类库例题
例1 字符串操作 定义一个StringBuffer类对象,然后通过append()方法向对象中添加26个小写字母,每次只添加一次,共添加26次,然后按逆序方式输出,并且可以删除前5个字符 面向过程实现 ...
- ssh判断免密登陆
ssh判断免密登陆 [root@jenkins ~]# vi /opt/release_code.sh #!/bin/bash . /etc/init.d/functions #echo $WORKS ...