前言：

集合這個詞應該比較耳熟，大多數(shù)人沒接觸代碼前就學過了?；叵胍幌履愕母咭粩?shù)學課本上是不是出現(xiàn)過這個詞，就在第一章，概念如下：

一般地，我們把研究的對象統(tǒng)稱為元素，把一些元素組成的總體叫作集合。

你看，集合，元素，是不是與今天我們學習的數(shù)據結構相通呢？

一、什么是集合

集合是由一組無序且唯一（不能重復）的元素組成。數(shù)據結構中的集合，對應的是數(shù)學概念當中的有限集合。

在數(shù)學中，比如要展示一個城市集合，我們是這么寫的：

N = {北京, 上海, 深圳, 廣州}
復制代碼

那對應到 JavaScript 當中，就是一個簡單的數(shù)組了：

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

數(shù)學中還有一個 空集 的概念，用 {} 表示，也就是 JavaScript 中的空數(shù)組 []。

集合的不同之處在于，我們前面學習的棧，隊列，鏈表，都是有序集合。而集合是比較少見的無序集合的數(shù)據結構。

因為集合是唯一且無序的，所以我們不能像有序的數(shù)據結構一樣，用下標來定位元素。無序集合的唯一標識就是元素本身的值。

JavaScript 在 ES6 中也提供了對標集合的數(shù)據類型 Set。Set 允許存儲唯一的任意類型的值，其實就是集合的實現(xiàn)。

在數(shù)學中，集合也有交集，并集，差集等基本運算，本篇我們也會實現(xiàn)。

下面我們自己動手實現(xiàn)一個 Set。

二、創(chuàng)建集合類

我們依然用 class 語法來創(chuàng)建基本結構：

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

與棧，隊列的原則一致，用一個對象來存儲集合的元素最為合適。再者因為元素的唯一性，對于基本類型元素，我們可以直接以元素的值作為對象 Key 值，而不是 0,1,2...。

下面就是我們需要聲明的方法：

• add：向集合添加新元素
• delete：從集合中刪除一個元素
• has：檢測元素是否在集合中
• clear：清空集合
• size：返回集合的長度
• values：返回包含集合中所有元素的數(shù)組

1.has 方法

首先實現(xiàn) has 方法，因為它會被 add，delete 等方法調用。

這個方法用來檢測某一個元素是否在集合中，存在則返回 true，否則返回 false。

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

我們在開頭部分說了，直接用元素本身的值作為對象的 key，因此可以直接用 JavaScript ES6 提供的 in 運算符來檢測屬性是否在對象當中。

還有一種傳統(tǒng)的方式如下，與上面效果一致：

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

2.add 方法

有了 has 方法，add 方法的實現(xiàn)就比較簡單：

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 方法對作用就是返回集合的長度（有多少個元素），實現(xiàn)這個方法有多種方式。

方式一：和之前的棧，隊列，鏈表的實現(xiàn)方式一樣，用一個屬性 count 來表示長度，在添加和刪除的時候更新這個屬性的值。

方式二：直接使用 ES6 的 Object.keys 方法來獲取屬性的數(shù)組，獲取數(shù)組的長度：

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

還是第二種方法簡單，就選這個。

5.values 方法

和上面的 size 方法一樣，也可以直接獲取對象屬性值的數(shù)組：

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

三、使用集合

上面我們手動實現(xiàn)了集合類，這里來使用一下：

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

刪除也沒問題，完美實現(xiàn)！

總結

本篇我們手動實現(xiàn)了集合的基本功能，下一節(jié)我們在此基礎上，實現(xiàn)集合的基本運算

到此這篇關于JavaScript 數(shù)據結構 之集合創(chuàng)建的文章就介紹到這了,更多相關JavaScript 集合內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

最新評論