当前位置: 首页 > news >正文

ES6——数组扩展之Set数组

在ES6(ECMAScript 2015)中,JavaScript的Set对象提供了一种存储任何值唯一性的方式,类似于数组但又不需要索引访问。这对于需要确保元素唯一性的场景非常有用。Set对象本身并不直接提供数组那样的方法来操作数据(例如mapfilterreduce等),但是可以通过将Set转换成数组来实现这些操作。下面是一些常用的数组方法及其在Set上的应用方式:

方法描述

Set

Set转换成数组

map()

Set中的每个元素应用一个函数,可以将Set转换为数组后使用map()方法。

filter()

使用filter()方法可以筛选出满足条件的元素。

reduce()

reduce()方法可以用来将Set中的元素组合起来,例如求和。

find() 、 findIndex()

虽然原生Set没有直接提供这些方法,但可以通过转换为数组来使用。

some() 、 every()

这些方法可以用来检查Set中的元素是否满足特定条件。

使用场景和示例代码: 

1. 将Set转换为数组

const set = new Set([1, 2, 3, 4]);// 使用扩展运算符
const array1 = [...set];// 使用Array.from()
const array2 = Array.from(set);

2. map() 方法

const set = new Set([1, 2, 3, 4]);
const mappedArray = Array.from(set).map(x => x * 2);
console.log(mappedArray); // [2, 4, 6, 8]

3. filter() 方法

const set = new Set([1, 2, 3, 4, 5]);
const filteredArray = Array.from(set).filter(x => x > 3);
console.log(filteredArray); // [4, 5]

4. reduce() 方法

const set = new Set([1, 2, 3, 4]);
const sum = Array.from(set).reduce((acc, current) => acc + current, 0);
console.log(sum); // 10

5. find() 和 findIndex() 方法

const set = new Set(['apple', 'banana', 'cherry']);
const foundItem = Array.from(set).find(item => item === 'banana');
console.log(foundItem); // 'banana'

6. some() 和 every() 方法

const set = new Set([1, 2, 3, 4]);
const hasEven = Array.from(set).some(x => x % 2 === 0); // 检查是否有偶数
console.log(hasEven); // true

补充

数组去重:
var arr = [1,1,2,2,3,3,1,4,4];
[...new Set(arr)]; // [1, 2, 3, 4]
Array.from(new Set(arr)); // [1, 2, 3, 4]
[...new Set('abababcd')].join(''); // "abcd" 可以字符串去重
new Set('Hello world'); //["Hello","world"]

数组交集:

var a = new Set([1, 2, 3, 4]);
var b = new Set([4, 3, 2, 5]);
var intersect = new Set([...a].filter(x => b.has(x))); // {2, 3, 4}

数组并集:

var a = new Set([1, 2, 3, 4]);
var b = new Set([4, 3, 2, 5]);
var union = new Set([...a, ...b]); // {1, 2, 3, 4, 5}

数组差集:

var a = new Set([1, 2, 3, 4]);
var b = new Set([4, 3, 2, 5]);
var difference = new Set([...a].filter(x => !b.has(x))); // {1, 5}

 

小结:

[...new Set()]‌ 是一种在JavaScript中用于去重和展开集合的操作。具体来说,new Set() 创建一个新的 Set 对象,该对象存储的元素是唯一的,不会出现重复的值。通过使用扩展运算符(...),可以将 Set 对象中的元素展开成数组形式。

http://www.lqws.cn/news/170173.html

相关文章:

  • onSaveInstanceState() 和 ViewModel 在数据保存能力差异
  • ES6——对象扩展之Set对象
  • 详细介绍uni-app中Composition API和Options API的使用方法
  • uniapp Vue2 获取电量的独家方法:绕过官方插件限制
  • uniapp 集成腾讯云 IM 富媒体消息(地理位置/文件)
  • 深度学习环境配置指南:基于Anaconda与PyCharm的全流程操作
  • 前端面试题之ES6保姆级教程
  • Vue3 + UniApp 蓝牙连接与数据发送(稳定版)
  • 【Python 算法零基础 4.排序 ⑪ 十大排序算法总结】
  • 学习笔记(26):线性代数-张量的降维求和,简单示例
  • uniapp+vue2解构赋值和直接赋值的优缺点
  • 如何利用 Redis 实现跨多个无状态服务实例的会话共享?
  • 传统业务对接AI-AI编程框架-Rasa的业务应用实战(4)--Rasa成型可用 针对业务配置rasa并训练和部署
  • AI代码助手需求说明书架构
  • 408第一季 - 数据结构 - 数组和特殊矩阵
  • 贝叶斯网络_TomatoSCI分析日记
  • 探索 Java 垃圾收集:对象存活判定、回收流程与内存策略
  • 如何理解OSI七层模型和TCP/IP四层模型?HTTP作为如何保存用户状态?多服务器节点下 Session方案怎么做
  • Docker部署Hive大数据组件
  • JAVA学习 DAY2 java程序运行、注意事项、转义字符
  • 数据库:索引
  • JS设计模式(4):观察者模式
  • 发版前后的调试对照实践:用 WebDebugX 与多工具构建上线验证闭环
  • Spring Boot 实现流式响应(兼容 2.7.x)
  • 23套橙色系精选各行业PPT模版分享
  • windows上的visual studio2022的项目使用jenkins自动打包
  • 极速互联·智控未来——SG-Can(FD)Hub-600 六通道CANFD集线器
  • 【Go语言基础【9】】字符串格式化与输入处理
  • Docker配置SRS服务器 ,ffmpeg使用rtmp协议推流+vlc拉流
  • 8K样本在DeepSeek-R1-7B模型上的复现效果