=====================================================================
本文主要介绍了 Set 以及 Map 数据结构,对他们实例方法、遍历、以及类型转换进行了详细的讲解。
=============================================================================
ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构。Set 数据结构我们一般运用在电商网站的搜索历史关键字的存储。
Set 本身是一个构造函数,用来生成 Set 数据结构。
const s = new Set();
Set 函数可以接受一个数组作为参数,用来初始化。
const set = new Set([1, 2, 3, 4, 4]); // {1, 2, 3, 4}
通过示例可以看出,成员的值都是唯一的,没有重复的值。
=========================================================================
-
add(value)
:添加某个值,返回 Set 结构本身。 -
delete(value)
:删除某个值,返回一个布尔值,表示删除是否成功。 -
has(value)
:返回一个布尔值,表示该值是否为 Set 的成员。 -
clear()
:清除所有成员,没有返回值。
const s = new Set();
s.add(1).add(2).add(3); // 向 set 结构中添加值
s.delete(2); // 删除 set 结构中的 2 值,返回一个布尔值,表示删除是否成功。
s.has(1); // 表示 set 结构中是否有 1 这个值 返回布尔值,表示该值是否为 Set 的成员。
s.clear(); // 清除 set 结构中的所有值
// 注意:删除的是元素的值,不是代表的索引。
示例代码:
新建 index.html 文件,代码如下:
显示效果:
=======================================================================
Set 结构的实例与数组一样,也拥有 forEach 方法,用于对每个成员执行某种操作,没有返回值。
s.forEach((value) => console.log(value));
示例代码:
新建 test.js 文件,代码如下:
// 遍历 set 数据结构,从中取值
const s1 = new Set([“a”, “b”, “c”, “A”, “B”]);
s1.forEach((value) => {
console.log(value);
});
显示效果:
=========================================================================
Array
// Array 转 Set
var mySet = new Set([“value1”, “value2”, “value3”]);
// 用…操作符,将 Set 转 Array
var myArray = […mySet];
在终端使用 node 命令运行:
String
// String 转 Set
var mySet = new Set(‘hello’);
// Set(4) {“h”, “e”, “l”, “o”}
copy
Set 中 toString 方法是不能将 Set 转换成 String。
在终端使用 node 命令运行:
=============================================================================
数组去重
var mySet = new Set([1, 2, 3, 4, 4]);
[…mySet];
// [1, 2, 3, 4]
在终端使用 node 命令运行:
并集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var union = new Set([…a, …b]);
// {1, 2, 3, 4}
在终端使用 node 命令运行:
交集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var intersect = new Set([…a].filter(x => b.has(x)));
// {2, 3}
在终端使用 node 命令运行:
差集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var difference = new Set([…a].filter(x => !b.has(x)));
// {1}
在终端使用 node 命令运行:
========================================================================
Map 对象保存键值对,任何值(对象或者原始值) 都可以作为一个键或一个值。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串 — 值”的对应,Map 结构提供了“值 — 值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。
var m = new Map();
var o = { p: “Hello World” };
m.set(o, “content”);
m.get(o); // “content”
自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。
深知大多数前端工程师,想要提升技能,往往是自己摸索成长或者是报班学习,但对于培训机构动则几千的学费,着实压力不小。自己不成体系的自学效果低效又漫长,而且极易碰到天花板技术停滞不前!
因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。
既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化!
由于文件比较大,这里只是将部分目录大纲截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且后续会持续更新
如果你觉得这些内容对你有帮助,可以添加V获取:vip1024c (备注前端)
最后
小编的一位同事在校期间连续三年参加ACM-ICPC竞赛。从参赛开始,原计划每天刷一道算法题,实际上每天有时候不止一题,一年最终完成了 600+:
凭借三年刷题经验,他在校招中很快拿到了各大公司的offer。
入职前,他把他的刷题经验总结成1121页PDF书籍,作为礼物赠送给他的学弟学妹,希望同学们都能在最短时间内掌握校招常见的算法及解题思路。
整本书,我仔细看了一遍,作者非常细心地将常见核心算法题和汇总题拆分为4个章节。
而对于有时间的同学,作者还给出了他结合众多数据结构算法书籍,挑选出的一千多道题的解题思路和方法,以供有需要的同学慢慢研究。
一个人可以走的很快,但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎扫码加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
16241cf00d213.png)
整本书,我仔细看了一遍,作者非常细心地将常见核心算法题和汇总题拆分为4个章节。
而对于有时间的同学,作者还给出了他结合众多数据结构算法书籍,挑选出的一千多道题的解题思路和方法,以供有需要的同学慢慢研究。
一个人可以走的很快,但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎扫码加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
[外链图片转存中…(img-OIJcsokz-1712459176956)]