当前位置:首页 > JavaScript

js实现set

2026-04-06 05:00:35JavaScript

使用原生 JavaScript 实现 Set 功能

JavaScript 的 Set 是一种集合数据结构,用于存储唯一值。以下是一个简单的原生 JavaScript 实现:

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

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

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

  delete(element) {
    if (this.has(element)) {
      delete this.items[element];
      return true;
    }
    return false;
  }

  clear() {
    this.items = {};
  }

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

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

使用对象存储集合元素

上述实现使用对象来存储集合元素,利用对象的键唯一性来保证集合元素的唯一性。has 方法检查元素是否存在,add 方法添加新元素,delete 方法移除元素。

js实现set

处理不同类型的值

JavaScript 的对象键会自动转换为字符串,这可能导致一些问题。例如,数字 1 和字符串 '1' 会被视为相同的键。为了解决这个问题,可以改进实现:

js实现set

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

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

  add(element) {
    if (!this.has(element)) {
      this.items.push(element);
      return true;
    }
    return false;
  }

  delete(element) {
    if (this.has(element)) {
      this.items.splice(this.items.indexOf(element), 1);
      return true;
    }
    return false;
  }

  clear() {
    this.items = [];
  }

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

  values() {
    return [...this.items];
  }
}

实现集合运算

集合常见的运算包括并集、交集、差集和子集。以下是这些运算的实现:

union(otherSet) {
  const unionSet = new MySet();
  this.values().forEach(value => unionSet.add(value));
  otherSet.values().forEach(value => unionSet.add(value));
  return unionSet;
}

intersection(otherSet) {
  const intersectionSet = new MySet();
  this.values().forEach(value => {
    if (otherSet.has(value)) {
      intersectionSet.add(value);
    }
  });
  return intersectionSet;
}

difference(otherSet) {
  const differenceSet = new MySet();
  this.values().forEach(value => {
    if (!otherSet.has(value)) {
      differenceSet.add(value);
    }
  });
  return differenceSet;
}

isSubsetOf(otherSet) {
  return this.values().every(value => otherSet.has(value));
}

使用 ES6 的 Set

现代 JavaScript 已经内置了 Set 类,可以直接使用:

const set = new Set();
set.add(1);
set.add(2);
set.add(1); // 不会重复添加
console.log(set.size); // 2
console.log(set.has(1)); // true
set.delete(1);
console.log(set.has(1)); // false

性能考虑

原生实现的 Set 性能可能不如内置的 Set,特别是在处理大量数据时。内置 Set 经过优化,通常具有更好的性能。

标签: jsset
分享给朋友:

相关文章

js实现图片轮播

js实现图片轮播

实现基础图片轮播 使用HTML、CSS和JavaScript创建一个简单的图片轮播。HTML部分定义轮播容器和图片,CSS设置样式和动画效果,JavaScript处理轮播逻辑。 <div cl…

js实现全屏

js实现全屏

实现全屏的基本方法 使用JavaScript实现全屏功能主要依赖Element.requestFullscreen()方法。现代浏览器均支持此API,但不同浏览器可能需要添加前缀。 // 触发全屏…

js实现日历

js实现日历

实现日历的基本思路 使用JavaScript实现日历的核心是动态生成日期表格,并处理月份切换逻辑。需要计算当前月的天数、起始星期几,并动态渲染到页面上。 获取当前日期信息 通过Date对象获取当前年…

js 实现继承

js 实现继承

原型链继承 通过让子类的原型对象指向父类的实例来实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Par…

js 进度条的实现

js 进度条的实现

使用 HTML 和 CSS 创建基础进度条 HTML 结构可以简单使用一个 div 元素作为容器,内部嵌套另一个 div 表示进度: <div class="progress-containe…

js实现选项卡

js实现选项卡

实现选项卡的基本思路 选项卡通常由一组标签和对应的内容面板组成。点击标签时,显示对应的内容面板,隐藏其他面板。实现这一效果需要结合HTML结构、CSS样式和JavaScript交互逻辑。 HTML结…