JS中数组如何去重(ES6新增的Set集合类型)+经典two sum面试题

news2025/2/25 18:09:53

现在有这么一个重复数组:

const arr = ['a','a','b','a','b','c']

只推荐简单高效的方法,复杂繁琐的方法不做推荐

方法一:

const res = [...new Set(arr)]

Set类型是什么呢?

Set 是ES6新增的一种新集合类型具体知识点可以看下面附录:

根据上面的知识点,我们可以得到:

console.log(...new Set(arr)) // a b c

所以去重也可以这么实现:

const res = Array.from(new Set(arr)) // Array.from将类数组转换成数组
// or
const res = Array.of(...new Set(arr)) // Array.of根据传入的参数生成数组

方法二:

var arr = ['apple','apps','pear','apple','orange','apps'];  
var newArr = arr.filter(function(item,index){
   return arr.indexOf(item) === index;  // 因为indexOf 只能查找到第一个  
});

方法三:

some + 循环去重

function distinct(list) {
   let result = [list[0]];// 用于承接没有重复的数据,初始时将原始数组的第一个值赋给它。
   for (let i = 1; i < list.length; i++) {
     // 判断结果数组中是否存在一样的值,若果没有的话则将数据存入结果数组中。
     if (!(result.some(val => list[i] === val))) {
       result.push(list[i]);
     }
   }
   return result;
 }

方法四:

如果不能用ES6、5的语法。需要原生方法双重for循环去重:

function noRepeat(arr) {
        for(var i = 0; i < arr.length-1; i++){
            for(var j = i+1; j < arr.length; j++){
                if(arr[i]===arr[j]){
                    arr.splice(j,1);
                    j--;
                }
            }
        }
        return arr;
 }

方法五:

简单数组用includes去重

function noRepeat(arr) {
    let newArr = [];
    for(i=0; i<arr.length; i++){
      if(!newArr.includes(arr[i])){
          newArr.push(arr[i])
       }
      }
     return newArr
}

附录 -Set

使用 new 关键字和 Set 构造函数可以创建一个空集合:

const s = new Set();

如果想在创建的同时初始化实例,则可以给 Set 构造函数传入一个可迭代对象(Array Map Set WeakMap WeakSet)。可迭代对象需要包含插入到新集合实例中的元素(Set 可以包含任何 JavaScript 数据类型作为值)。Set构造函数会迭代传入参数,去重后保存到集合实例中。

特点

  1. Set 是唯一值的集合。

  1. 每个值在 Set 中只能出现一次。

  1. 一个 Set 可以容纳任何数据类型的任何值。

你可以把Set想像成跟数组一样,我们用size来输出Set集合的长度。

const s = new Set(['a','b','c','c']);
s.size; // 3 去重了一个c
const s2 = new Set();
s2.add('a')
s2.add('b')
s2.add('c')
s2.size // 3

与Array的区别

最根本的区别是数组是一个索引集合,这说明数组中的数据值按索引排序。

相比之下,set是一个键的集合。set不使用索引,而是使用键对数据排序(看下面forEach)。set 中的元素按插入顺序是可迭代的,它不能包含任何重复的数据。

对比Array的优势

在运行时间方面上Set占了很大的优势

  • 查看元素:使用indexOf()或includes()检查数组中的项是否存在是比较慢的。

  • 删除元素:在Set中,可以根据每项的的 value 来删除该项。在数组中,等价的方法是使用基于元素的索引的splice()。与前一点一样,依赖于索引的速度很慢。

  • 保存 NaN:不能使用indexOf()或 includes() 来查找值 NaN,而 Set 可以保存此值。

  • 删除重复项:Set对象只存储惟一的值,如果不想有重复项存在,相对于数组的一个显著优势,因为数组需要额外的代码来处理重复。

时间复杂度:
数组用来搜索元素的方法时间复杂度为0(N)。换句话说,运行时间的增长速度与数据大小的增长速度相同。
相比之下,Set用于搜索、删除和插入元素的方法的时间复杂度都只有O(1),这意味着数据的大小实际上与这些方法的运行时间无关。

具体解释与面试题强烈推荐阅读如何使用 Set 来提高JS代码的性能 - 知乎 (zhihu.com)

其他API

has()

查询Set实例是否存在某元素(返回布尔值):

const s = new Set();
s.add(1).add(2).add(3);
s.has(1); // true
delete()

删除某个元素

s.delete(1);
clear()

清空Set实例

s.clear();
Array.from(s); // []

迭代:

for of

for in不输出,因为它不是以下标为索引的集合

const s = new Set(['a','b','c','c']);
for (var n of s) {console.log(n)}
// a
// b
// c
forEach
s.forEach((t,i)=>console.log(t,i))
// a a
// b b
// c c
// 输出了键值对的结构
原生属性

可以看见Set实例的三个属性返回了枚举的类数组。

直接用Array.form转换

Array.from(s.keys())
// ['a', 'b', 'c']
Array.from(s.entries())
// [['a', 'a'],['b', 'b'],['c', 'c']]
Array.from(s.values())
// ['a', 'b', 'c']

附录-面试题

题目:

给定一个整数无序数组和变量 sum,如果存在数组中任意两项和使等于 sum 的值,则返回true。否则,返回false。例如,数组[3,5,1,4]和 sum = 9,函数应该返回true,因为4 + 5 = 9。

解题思路:

本题其实是为了找数组元素与sum的差值是否在数组里重复出现。

const s = new Set()
arr.some(t=> {
    if (s.has(t)) {return true}
    s.add(sum-t);return fasle
})

简洁点写:

const findSum = (arr, sum) =>
  arr.some((set => n => set.has(n) || !set.add(sum - n))(new Set));

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/361765.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

ES6中Set类型的基本使用

在ES6之前&#xff0c;存储数据的结构主要有两种&#xff1a;数组、对象。 在ES6中新增了另外两种数据结构&#xff08;存放数据的方式&#xff09;&#xff1a;Set、Map&#xff0c;以及他们的另外形式WeakSet、WeakMap。 Set的基本使用 Set是一个新增的数据结构&#xff0c…

广东望京卡牌科技有限公司,2023年团建活动圆满举行

玉兔初临&#xff0c;春天相随&#xff0c;抖擞精神&#xff0c;好运连连。春天是一个万物复苏的季节&#xff0c;来自广东的望京卡牌科技有限公司&#xff0c;也迎来了新年第一次团建活动。在“乘风破浪、追逐梦想”的口号声中&#xff0c;2023望京卡牌目标启动会团结活动正式…

Day896.MySql的kill命令 -MySQL实战

MySql的kill命令 Hi&#xff0c;我是阿昌&#xff0c;今天学习记录的是关于MySql的kill命令的内容。 在 MySQL 中有两个 kill 命令&#xff1a; 一个是 kill query 线程 id&#xff0c;表示终止这个线程中正在执行的语句&#xff1b;一个是 kill connection 线程 id&#…

【数据宝应用场景】多场景,多接口,哪些数据可以用在文旅平台上?

随着云计算、物联网、互联网和移动智能终端等技术的飞速发展以及迎合游客不断升级的文旅消费需求&#xff0c;智慧旅游成为文旅行业信息建设的主要方向。 在信息化时代&#xff0c;游客对于文旅体验和文旅信息服务的要求在逐步提高。以现代科技为主要手段的智慧文旅&#xff0…

linux rsync服务端安装和windows客户端备份

安装&#xff1a;yum install -y rsync 密码内容&#xff1a;zhangsan:123456 配置文件&#xff1a;/etc/rsyncd.conf内容 # /etc/rsyncd: configuration file for rsync daemon mode # See rsyncd.conf man page for more options. # configuration example: uid root gi…

从0开始的ios自动化测试

最近由于工作内容调整&#xff0c;需要开始弄ios自动化了。网上信息有点杂乱&#xff0c;这边我就按我的实际情况&#xff0c;顺便记录下来&#xff0c;看是否能帮到有需要的人。 环境准备 安装tidevice pip3 install -U “tidevice[openssl]” 它的作用是&#xff0c;帮你绕…

JavaScript从零开始 学习记录(一)

前言 选择视频课程之前&#xff0c;不仅查阅了资料&#xff0c;还询问了网友&#xff0c;最终敲定了学习黑马前端的视频教程&#xff0c;学了5小节&#xff0c;发现挺对自己口味的且从反响来看&#xff0c;还是相当不错的&#xff0c;便打算利用这个寒假学完 笔记范围 从这节…

领航智能汽车信息安全新征程 | 云驰未来乔迁新址

2月20日&#xff0c;在北京朝阳百子湾东朝时代创意园&#xff0c;云驰未来迎来乔迁之喜&#xff0c;智能汽车和自动驾驶领域的行业领导、合作伙伴与客户、投资人及媒体嘉宾齐聚现场&#xff0c;共同见证云驰未来迈上新的发展征程。 作为中国智能网联汽车和自动驾驶信息安全行业…

图床(Typora + uPic/PicGo +七牛云)

图床&#xff08;Typora uPic/PicGo 七牛云&#xff09; 笔者平时使用 Typora 编写 markdown 文档&#xff0c;文档中常常会放置图片&#xff0c;如果文档不需要分享的话&#xff0c;其实讲图片存放在本地就可以了。由于我有在多台机器编写 markdown 笔记&#xff0c;还有将…

维度建模基本流程总结

一、维度建模基本流程图数据RD进行业务调研和数据现状调研&#xff0c;产出符合相关模版规范的业务知识文档和数据现状文档。数据PM也会调研相关业务产出需求设计文档&#xff0c;三方参与需求评审&#xff0c;评审通过后基建数据RD进行需求拆解&#xff0c;产出技术方案&#…

redhawk:GSC file与STA file

1.GSC file redhawk做lowpower分析时需要GSC&#xff08;Global Switching Configuration&#xff09;file指导block/instance/power domain的开关状态。 Syntax&#xff08;in GSR file&#xff09;: GSC_FILES <gsc_FilePathName> Syntax&#xff08;in GSC file&a…

django项目实战八(django+bootstrap实现增删改查)进阶验证码

目录 一、安装第三方 1、pillow 2、第三方字体文件 二、实现生成验证码 1、创建code.py 2、url 3、修改auth.py 4、修改account.py 5、修改login.html 三、验证码校验 1、验证码写入到session 2、修改form下的LoginForm类新增code字段 3、修改login.html 4、修改acco…

Jasperreort使用

准备工作 下载Jaspersoft Studio 下载地址 下载后一直下一步安装 Studio基本使用 新建项目 新建模板 具体制作教程可前往B站搜索视频教程 添加中文字体 如果不添加&#xff0c;后面打印出PDF的时候中文显示不出来 电脑自带的字体一般在C:\Windows\Fonts 但该目…

6——JVM调优工具详解及调优实战

Jmap、Jstack、Jinfo命令详解 Jmap 此命令可以用来查看内存信息&#xff0c;实例个数&#xff0c;以及占用内存大小 生成dump文件 把dump文件装入Jvisvalvm进行分析 Jstack Jstack加进程id查找死锁 Jstack找出占CPU最高的线程堆栈信息 top -p 进程号&#xff1a;显示进程…

文件系统概念

1.文件逻辑结构 (1)有结构文件和无结构文件 ①定长记录 ②可变长记录 (2)顺序文件 (3)索引文件 (4)索引顺序文件 (5)多级索引顺序文件 2.文件目录 (1)文件控制块 (2)目录结构 (3)索引节点 3.文件的物理结构 (1)文件块&#xff0c;磁盘块 (2)文件分配方式 ①连续分配 ②链接…

跑步戴哪种耳机好,最适合运动跑步的蓝牙耳机

经常跑步使用的耳机&#xff0c;还是要选择佩戴着舒适以及牢固的运动耳机最为合适&#xff0c;在运动当中会遇到耳机掉落或者长时间佩戴耳道感到难受的现象发生&#xff0c;那么什么蓝牙耳机是最适合运动当中佩戴呢&#xff1f;下面这些耳机分享希望能够帮助大家。 1、南卡Run…

人工智能基础部分13-LSTM网络:预测上证指数走势

大家好&#xff0c;我是微学AI&#xff0c;今天给大家介绍一下LSTM网络&#xff0c;主要运用于解决序列问题。 一、LSTM网络简单介绍 LSTM又称为&#xff1a;长短期记忆网络&#xff0c;它是一种特殊的 RNN。LSTM网络主要是为了解决长序列训练过程中的梯度消失和梯度爆炸问题…

CATCTF wife原型链污染

CATCTF wife原型链污染 原型链污染原理&#xff1a;https://drun1baby.github.io/2022/12/29/JavaScript-%E5%8E%9F%E5%9E%8B%E9%93%BE%E6%B1%A1%E6%9F%93/ 如下代码&#xff0c;prototype是newClass类的一个属性。newClass 实例化的对象 newObj 的 .__proto__ 指向 newClass…

数字证书不仅有SSL证书,数字证书类型科普大全

数字证书不仅有SSL证书&#xff0c;数字证书类型科普大全证书不单单有SSL证书&#xff0c;还有SSL证书、代码签名证书以及客户端证书等。具体分类跟着陕西CA一起来看看吧。SSL证书&#xff1a;单域名SSL证书、多域名SSL证书、通配符SSL证书代码签名证书&#xff1a;单位代码签名…

管理系统权限分析以及白屏处理

菜单权限的业务分析 超级管理员&#xff1a;首页、权限模块、商品模块 不同角色能看到的菜单是不一样的。 如何实现菜单的权限 登录时向服务器发请求&#xff0c;服务器会把用户相应的菜单的权限信息&#xff0c;返回给前端&#xff0c;可以根据服务器返回的数据&#xff0…