当前位置:首页 > JavaScript

js 实现集合

2026-04-06 22:52:47JavaScript

实现集合的基本方法

在 JavaScript 中,集合(Set)是一种存储唯一值的数据结构。可以使用多种方式实现集合功能。

使用 ES6 的 Set 类是最简单的方式:

const mySet = new Set();
mySet.add(1);
mySet.add(2);
mySet.add(2); // 重复值会被忽略
console.log(mySet.has(1)); // true
mySet.delete(1);

使用对象模拟集合

在 ES6 之前,可以用对象模拟集合:

function Set() {
  this.items = {};
}

Set.prototype.add = function(value) {
  this.items[value] = true;
};

Set.prototype.has = function(value) {
  return this.items.hasOwnProperty(value);
};

Set.prototype.delete = function(value) {
  delete this.items[value];
};

Set.prototype.size = function() {
  return Object.keys(this.items).length;
};

集合操作实现

实现集合的并集、交集和差集:

// 并集
Set.prototype.union = function(otherSet) {
  const unionSet = new Set();
  Object.keys(this.items).forEach(value => unionSet.add(value));
  Object.keys(otherSet.items).forEach(value => unionSet.add(value));
  return unionSet;
};

// 交集
Set.prototype.intersection = function(otherSet) {
  const intersectionSet = new Set();
  Object.keys(this.items).forEach(value => {
    if(otherSet.has(value)) {
      intersectionSet.add(value);
    }
  });
  return intersectionSet;
};

// 差集
Set.prototype.difference = function(otherSet) {
  const differenceSet = new Set();
  Object.keys(this.items).forEach(value => {
    if(!otherSet.has(value)) {
      differenceSet.add(value);
    }
  });
  return differenceSet;
};

使用数组实现集合

另一种实现方式是使用数组:

class ArraySet {
  constructor() {
    this.items = [];
  }

  add(value) {
    if(!this.has(value)) {
      this.items.push(value);
    }
  }

  has(value) {
    return this.items.includes(value);
  }

  delete(value) {
    const index = this.items.indexOf(value);
    if(index !== -1) {
      this.items.splice(index, 1);
    }
  }

  get size() {
    return this.items.length;
  }
}

集合的性能考虑

对于大型集合,基于对象的实现通常比数组实现性能更好,因为对象使用哈希表结构,查找操作的时间复杂度接近 O(1),而数组需要线性查找。

js 实现集合

ES6 的 Set 类已经优化了性能,建议优先使用原生 Set 而不是自定义实现,除非有特殊需求。

标签: js
分享给朋友:

相关文章

js轮播图实现原理

js轮播图实现原理

轮播图的基本原理 轮播图通过动态切换显示的内容(图片、文本等)实现视觉上的滑动效果。核心原理是利用CSS和JavaScript控制元素的显示与隐藏,或通过变换位置实现滑动动画。 实现方法一:…

js 实现分页

js 实现分页

实现分页的基本逻辑 分页功能通常需要后端返回数据总量或总页数,前端根据当前页码和每页条数截取对应数据。以下是一个基于JavaScript的简单分页实现方案: 前端分页实现 假设已有从后端获取的完整数…

js实现祖玛

js实现祖玛

实现祖玛游戏的核心思路 祖玛游戏的核心玩法是发射彩色珠子,形成三个或以上相同颜色的珠子即可消除。以下是使用JavaScript实现的基本框架。 游戏初始化 创建画布并初始化游戏状态: const…

js实现图片

js实现图片

图片加载与显示 在JavaScript中,可以通过Image对象动态加载图片。创建实例后设置src属性触发加载,通过onload回调处理加载完成后的操作: const img = new Ima…

js进度条实现

js进度条实现

使用HTML和CSS创建基础结构 在HTML中创建一个容器元素用于显示进度条,通常使用<div>元素。CSS用于设置进度条的样式,包括宽度、高度、颜色和圆角等属性。 <div cl…

js 实现图片 放大

js 实现图片 放大

使用 CSS transform 实现图片放大 通过 CSS 的 transform: scale() 属性可以实现图片的平滑放大效果。结合 JavaScript 监听鼠标事件控制放大状态: con…