JavaScript 数据结构之集合创建(1)

作者:??杨成功???? 时间:2024-04-19 10:14:34 

前言:

集合这个词应该比较耳熟,大多数人没接触代码前就学过了。回想一下你的高一数学课本上是不是出现过这个词,就在第一章,概念如下:

一般地,我们把研究的对象统称为元素,把一些元素组成的总体叫作集合。

你看,集合元素,是不是与今天我们学习的数据结构相通呢?

一、什么是集合

集合是由一组无序且唯一(不能重复)的元素组成。数据结构中的集合,对应的是数学概念当中的有限集合

在数学中,比如要展示一个城市集合,我们是这么写的:

N = {北京, 上海, 深圳, 广州}
复制代码

那对应到 JavaScript 当中,就是一个简单的数组了:

var cities = ['北京', '上海', '深圳', '广州']

数学中还有一个 空集 的概念,用 {} 表示,也就是 JavaScript 中的空数组 []

集合的不同之处在于,我们前面学习的栈,队列,链表,都是有序集合。而集合是比较少见的无序集合的数据结构。

因为集合是唯一且无序的,所以我们不能像有序的数据结构一样,用下标来定位元素。无序集合的唯一标识就是元素本身的值。

JavaScript 在 ES6 中也提供了对标集合的数据类型 Set。Set 允许存储唯一的任意类型的值,其实就是集合的实现。

在数学中,集合也有交集,并集,差集等基本运算,本篇我们也会实现。

下面我们自己动手实现一个 Set。

二、创建集合类

我们依然用 class 语法来创建基本结构:

class Set {
 constructor() {
   this.items = {};
 }
}

与栈,队列的原则一致,用一个对象来存储集合的元素最为合适。再者因为元素的唯一性,对于基本类型元素,我们可以直接以元素的值作为对象 Key 值,而不是 0,1,2...

下面就是我们需要声明的方法:

  • add:向集合添加新元素

  • delete:从集合中删除一个元素

  • has:检测元素是否在集合中

  • clear:清空集合

  • size:返回集合的长度

  • values:返回包含集合中所有元素的数组

1.has 方法

首先实现 has 方法,因为它会被 add,delete 等方法调用。

这个方法用来检测某一个元素是否在集合中,存在则返回 true,否则返回 false

has(item) {
 return item in this.items;
}

我们在开头部分说了,直接用元素本身的值作为对象的 key,因此可以直接用 JavaScript ES6 提供的 in 运算符来检测属性是否在对象当中。

还有一种传统的方式如下,与上面效果一致:

has(item) {
 return Object.prototype.hasOwnProperty.call(this.items, item);
}

2.add 方法

有了 has 方法,add 方法的实现就比较简单:

add(item) {
 if(this.has(item)) {
   return false;
 }
 this.items[item] = item
 return true
}

因为要保持元素唯一性,所以在添加元素前先判断当前元素是否在,存在则不添加,不存在才添加。

3.delete 和 clear 方法

这两个方法都是删除元素,前者删除一个元素,后者删除所有元素。

// 删除
delete(item) {
 if(this.has(item)) {
   delete this.items[item]
   return true
 }
 return false
}
// 清空
clear(item) {
 this.item = {}
}

删除也比较简单,删除或清空对象对属性即可。

4.size 方法

size 方法对作用就是返回集合的长度(有多少个元素),实现这个方法有多种方式。

方式一:和之前的栈,队列,链表的实现方式一样,用一个属性 count 来表示长度,在添加和删除的时候更新这个属性的值。

方式二:直接使用 ES6 的 Object.keys 方法来获取属性的数组,获取数组的长度:

size() {
 return Object.keys(this.items).length
}

还是第二种方法简单,就选这个。

5.values 方法

和上面的 size 方法一样,也可以直接获取对象属性值的数组:

values() {
 return Object.values(this.items)
}

三、使用集合

上面我们手动实现了集合类,这里来使用一下:

var set = new Set()
set.add('北京')
set.add('北京')
set.add('上海')
set.add('上海')
// 打印结果
console.log(set.size()) // 2
console.log(set.values()) // ['北京','上海']

添加的检测没问题,再看删除:

console.log(set.has('上海')); // true
console.log(set.has('成都')); // false
set.delete('上海');
console.log(set.values()); ['北京']
console.log(set.has('上海')); // false

删除也没问题,完美实现!

来源:https://juejin.cn/post/7087231173553815583

标签:JavaScript,数据,结构,集合,创建
0
投稿

猜你喜欢

  • Python的面向对象编程方式学习笔记

    2021-02-02 07:00:30
  • python函数装饰器之带参数的函数和带参数的装饰器用法示例

    2022-02-14 08:43:40
  • Python MOCK SERVER moco模拟接口测试过程解析

    2023-12-15 06:37:00
  • PyTorch与PyTorch Geometric的安装过程

    2021-12-15 05:00:08
  • JavaScript转换与解析JSON方法实例详解

    2024-04-17 10:22:44
  • python解析.pyd文件的详细代码

    2022-08-04 22:16:45
  • vue车牌搜索组件使用方法详解

    2024-04-30 10:30:37
  • sql之IN和BETWEEN条件运算

    2007-09-11 13:35:00
  • 华为2019校招笔试题之处理字符串(python版)

    2023-09-29 19:42:04
  • Go语言调用Shell与可执行文件的实现

    2024-02-06 17:03:44
  • 在前女友婚礼上用python把婚礼现场的WIFI名称改成了

    2023-05-26 15:15:49
  • javascript 操作文件 实现方法小结

    2024-04-22 12:48:27
  • Python使用pyenv实现多环境管理

    2022-10-23 00:18:23
  • python实现静态服务器

    2021-11-24 05:18:13
  • golang一些常用的静态检查工具详解

    2024-04-25 13:16:17
  • python分析apache访问日志脚本分享

    2021-08-12 04:20:09
  • 常用照片尺寸

    2009-03-06 12:56:00
  • oracle表空间表分区详解及oracle表分区查询使用方法

    2024-01-14 19:42:14
  • JS截取与分割字符串常用技巧总结

    2024-02-26 13:48:45
  • 用javascript实现给出的盒子的序列是否可连为一矩型

    2023-09-09 22:34:02
  • asp之家 网络编程 m.aspxhome.com