数组去重

let arr = [ 1,2,3,4,5,3,2 ]
// 数组去重
// 方法一
let newArr = [new Set(arr)]
console.log(newArr);
// 方法二
let newArr2 = Array.from(new Set(arr))
console.log(newArr2);

数组对象去重

let obj = [
{id : 1 ,name : 'zs'},
{id : 2 ,name : 'ls'},
{id : 3 ,name : 'ww'},
{id : 2 ,name : 'ls'}
] // 数组对象去重
let newObj = [...new Set(obj.map(el=> JSON.stringify(el)))].map(res=> JSON.parse(res))
console.log(newObj);
// 步骤拆解:
/*
1、判断两个基本数据类型是否相同,比较的是数据的值。判断两个引用类型是否一样,比较的是引用
2、set无法将数组对象去重,set去重的原理主要是判断两者存储的单元位置是否一样,如果一样才能去重。
3、基本类型数据存储在栈,值相同就直接去重。引用数据类型存储在堆,引用类型数据 值 相同 位置不相同也无法去重。参考第一条的解释。
4、只要将引用类型数据转变成基本数据类型,基本数据类型直接比较就可以去重了。去重完成后通过字符串转json对象即可。
*/
/*
[...new Set(obj.map(el=> JSON.stringify(el)))] 这一步 map 将内部的每一条转换成字符串,返回一个新数组,也就是引用类型数据转基本类型数据,下面是转换结果
[
0: "{\"id\":1,\"name\":\"zs\"}" // 字符串
1: "{\"id\":2,\"name\":\"ls\"}" // 字符串
]
.map(res=> JSON.parse(res)) 这一步将去重处理好的值转换为对象 得到最终结果
*/

数组添加

let arr3 = [
{id : 1 ,name : 'zs'},
{id : 2 ,name : 'ls'},
{id : 3 ,name : 'ww'}
] let newArr3 = new Set(arr3)
// 尾部添加
newArr3.add({id : 4,name : 'swk'})
console.log('尾部添加');
console.log(newArr3);

数组删除

let arr4 = [1,2,3,4,5,4,4,4]
let newArr4 = new Set(arr4)
newArr4.delete(2) // 删除成功返回:true 删除失败返回:false
console.log('删除数组中某一项');
console.log(newArr4);

检测数组值是否存在

let arr5 = [1,2,3,4,5,6,7]
let newArr5 = new Set(arr5)
console.log('检测数组中是存在set值');
console.log(newArr5.has(5));// 存在返回true,不存在返回false

清除数组所有的值

let arr6 = [1,2,3,4,5]
let nweArr6 = new Set(arr6)
nweArr6.clear() // 清除数组中所有值,没有返回值
console.log('清除数组中所有值');
console.log(nweArr6);

数组长度

let arr7 = [1,2,3,4,5]
let newArr7 = new Set(arr7)
console.log('获取数组的长度 & size 从1开始');
console.log(newArr7.size);

数组遍历方法


// 这几个与es6的遍历方法一致
Set.prototype.keys() //—— 返回键名的遍历器
Set.prototype.values() // —— 返回键值的遍历器
Set.prototype.entries() // —— 返回键值对的遍历器
Set.prototype.forEach() // —— 使用回调函数遍历元素
// 由于 Set 结构没有键名,只有键值(或者说键名和键值是同一个值),
// 所以 keys 方法和 values 方法的行为完全一致

ES6的Set详解的更多相关文章

  1. JavaScript ES6 新特性详解

    JavaScript ES6 带来了新的语法和新的强大功能,使您的代码更现代,更易读 const ,  let and var 的区别: const , let 是 ES6 中用于声明变量的新关键字. ...

  2. es6入门4--promise详解

    可以说每个前端开发者都无法避免解决异步问题,尤其是当处理了某个异步调用A后,又要紧接着处理其它逻辑,而最直观的做法就是通过回调函数(当然事件派发也可以)处理,比如: 请求A(function (请求响 ...

  3. Es6 Promise 用法详解

     Promise是什么??    打印出来看看  console.dir(Promise) 这么一看就明白了,Promise是一个构造函数,自己身上有all.reject.resolve这几个眼熟的方 ...

  4. es6的基本数据详解

    一.Set 基本用法:   1)ES6提供了新的数据机构-Set. 它类似于数组,但是成员的值都是唯一的,没有重复的值.Set本身是一个构造函数,用来生成Set数据结构. 先来看一段最简单的代码: 1 ...

  5. es6 Proxy对象详解

    Proxy用于修改某些操作的默认行为,也可以理解为在目标对象之前架设一层拦截,外部所有的访问都必须先通过这层拦截,因此提供了一种机制,可以对外部的访问进行过滤和修改.这个词的原理为代理,在这里可以表示 ...

  6. es6 Reflect对象详解

    Reflect是ES6为操作对象而提供的新API,而这个API设计的目的只要有: 将Object对象的一些属于语言内部的方法放到Reflect对象上,从Reflect上能拿到语言内部的方法.如:Obj ...

  7. es6实现继承详解

    ES6中通过class关键字,定义类 class Parent { constructor(name,age){ this.name = name; this.age = age; } speakSo ...

  8. ES6 中 Promise 详解

    Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果.从语法上说,Promise 是一个对象,从它可以获取异步操作的消息.Promise 提供统一的 API ...

  9. ES6中Promise详解

    Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果.从语法上说,Promise 是一个对象,从它可以获取异步操作的消息. Promise 提供统一的 AP ...

  10. ES6 Promise用法详解

    What is Promise? Promise是一个构造函数,接受一个参数(Function),并且该参数接受两个参数resolve和reject(分别表示异步操作执行成功后的回调函数.执行失败后的 ...

随机推荐

  1. 解决sox报错sox FAIL formats: no handler for given file type `mp3

    sudo apt-get install libsox-fmt-mp3

  2. 【Linux】/proc/stat解析

    一. 概述 1.1 CPU时间 cpu指标 含义user 用户态时间nice 用户态时间(低优先级,nice>0)system 内核态时间idle 空闲时间iowait I/O等待时间irq 硬 ...

  3. 持续发烧,试试Dart语言的异步操作,效率提升500%

    前言 昨天发了篇文章<Dart开发服务端,我是不是发烧(骚)了>,承蒙小编看得起上了首页. 今天持续发烧,再来写写如何使用 Dart 语言的异步操作.说起异步操作,玩 NodeJS 的同学 ...

  4. python模块的含义

    目录 模块简介 模块的本质 python模块的历史 python模块的表现形式 模块的分类 导入模块的两种句式 强调 import句式 import流程推导 练习 from...import...句式 ...

  5. Python函数/动态参数/关键字参数

    1.函数 #函数语法: #函数名规范:小谢字母开头,不同字母下划线隔开(字母数字下划线) #def 函数名(): #函数体:希望函数做的事情 1.1.无参函数 #无参函数 def music(): p ...

  6. uniapp 打包app 引入高德地图

    一.高德地图注册key值 二.项目中添加配置 三.项目中引用 <view class="home-btom-box" > <view class="ho ...

  7. Kagol:2022年最值得推荐的前端开源文章

    大家好,我是 Kagol,Vue DevUI 作者,从2020年开始一直专注于前端开源组件库的建设,在前端开源组件库.开源社区运营方面积累了一些经验,2020年主要的创作也是围绕前端组件库和开源两个主 ...

  8. 含辞未吐,声若幽兰,史上最强免费人工智能AI语音合成TTS服务微软Azure(Python3.10接入)

    所谓文无第一,武无第二,云原生人工智能技术目前呈现三足鼎立的态势,微软,谷歌以及亚马逊三大巨头各擅胜场,不分伯仲,但目前微软Azure平台不仅仅只是一个PaaS平台,相比AWS,以及GAE,它应该是目 ...

  9. [OpenCV实战]23 使用OpenCV获取高动态范围成像HDR

    目录 1 背景 1.1 什么是高动态范围(HDR)成像? 1.2 高动态范围(HDR)成像如何工作? 2 代码 2.1 运行环境配置 2.2 读取图像和曝光时间 2.3 图像对齐 2.4 恢复相机响应 ...

  10. 内网渗透-smb&wmi明文&hash传递

    首先我们要知道,在windows2012以上版本默认会关闭wdigest,那么攻击者就无法从内存中获取明文密码了 windows2012以下的版本如果安装了KB2871997补丁,那么同样也会导致无法 ...