JavaScript?數(shù)據(jù)結(jié)構(gòu)之集合創(chuàng)建(1)
前言:
集合這個詞應(yīng)該比較耳熟,大多數(shù)人沒接觸代碼前就學(xué)過了?;叵胍幌履愕母咭粩?shù)學(xué)課本上是不是出現(xiàn)過這個詞,就在第一章,概念如下:
一般地,我們把研究的對象統(tǒng)稱為元素,把一些元素組成的總體叫作集合。
你看,集合,元素,是不是與今天我們學(xué)習(xí)的數(shù)據(jù)結(jié)構(gòu)相通呢?
一、什么是集合
集合是由一組無序且唯一(不能重復(fù))的元素組成。數(shù)據(jù)結(jié)構(gòu)中的集合,對應(yīng)的是數(shù)學(xué)概念當(dāng)中的有限集合。
在數(shù)學(xué)中,比如要展示一個城市集合,我們是這么寫的:
N = {北京, 上海, 深圳, 廣州}
復(fù)制代碼那對應(yīng)到 JavaScript 當(dāng)中,就是一個簡單的數(shù)組了:
var cities = ['北京', '上海', '深圳', '廣州']
數(shù)學(xué)中還有一個 空集 的概念,用 {} 表示,也就是 JavaScript 中的空數(shù)組 []。
集合的不同之處在于,我們前面學(xué)習(xí)的棧,隊(duì)列,鏈表,都是有序集合。而集合是比較少見的無序集合的數(shù)據(jù)結(jié)構(gòu)。
因?yàn)榧鲜俏ㄒ磺覠o序的,所以我們不能像有序的數(shù)據(jù)結(jié)構(gòu)一樣,用下標(biāo)來定位元素。無序集合的唯一標(biāo)識就是元素本身的值。
JavaScript 在 ES6 中也提供了對標(biāo)集合的數(shù)據(jù)類型 Set。Set 允許存儲唯一的任意類型的值,其實(shí)就是集合的實(shí)現(xiàn)。
在數(shù)學(xué)中,集合也有交集,并集,差集等基本運(yùn)算,本篇我們也會實(shí)現(xiàn)。
下面我們自己動手實(shí)現(xiàn)一個 Set。
二、創(chuàng)建集合類
我們依然用 class 語法來創(chuàng)建基本結(jié)構(gòu):
class Set {
constructor() {
this.items = {};
}
}與棧,隊(duì)列的原則一致,用一個對象來存儲集合的元素最為合適。再者因?yàn)樵氐奈ㄒ恍?,對于基本類型元素,我們可以直接以元素的值作為對?Key 值,而不是 0,1,2...。
下面就是我們需要聲明的方法:
add:向集合添加新元素delete:從集合中刪除一個元素has:檢測元素是否在集合中clear:清空集合size:返回集合的長度values:返回包含集合中所有元素的數(shù)組
1.has 方法
首先實(shí)現(xiàn) has 方法,因?yàn)樗鼤?nbsp;add,delete 等方法調(diào)用。
這個方法用來檢測某一個元素是否在集合中,存在則返回 true,否則返回 false。
has(item) {
return item in this.items;
}我們在開頭部分說了,直接用元素本身的值作為對象的 key,因此可以直接用 JavaScript ES6 提供的 in 運(yùn)算符來檢測屬性是否在對象當(dāng)中。
還有一種傳統(tǒng)的方式如下,與上面效果一致:
has(item) {
return Object.prototype.hasOwnProperty.call(this.items, item);
}2.add 方法
有了 has 方法,add 方法的實(shí)現(xiàn)就比較簡單:
add(item) {
if(this.has(item)) {
return false;
}
this.items[item] = item
return true
}因?yàn)橐3衷匚ㄒ恍?,所以在添加元素前先判斷?dāng)前元素是否在,存在則不添加,不存在才添加。
3.delete 和 clear 方法
這兩個方法都是刪除元素,前者刪除一個元素,后者刪除所有元素。
// 刪除
delete(item) {
if(this.has(item)) {
delete this.items[item]
return true
}
return false
}
// 清空
clear(item) {
this.item = {}
}刪除也比較簡單,刪除或清空對象對屬性即可。
4.size 方法
size 方法對作用就是返回集合的長度(有多少個元素),實(shí)現(xiàn)這個方法有多種方式。
方式一:和之前的棧,隊(duì)列,鏈表的實(shí)現(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)
}三、使用集合
上面我們手動實(shí)現(xiàn)了集合類,這里來使用一下:
var set = new Set()
set.add('北京')
set.add('北京')
set.add('上海')
set.add('上海')
// 打印結(jié)果
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刪除也沒問題,完美實(shí)現(xiàn)!
總結(jié)
本篇我們手動實(shí)現(xiàn)了集合的基本功能,下一節(jié)我們在此基礎(chǔ)上,實(shí)現(xiàn)集合的基本運(yùn)算
到此這篇關(guān)于JavaScript 數(shù)據(jù)結(jié)構(gòu) 之集合創(chuàng)建的文章就介紹到這了,更多相關(guān)JavaScript 集合內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- JavaScript樹形數(shù)據(jù)結(jié)構(gòu)處理
- JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解
- JavaScript數(shù)據(jù)結(jié)構(gòu)與算法
- JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之棧詳解
- Javascript數(shù)據(jù)結(jié)構(gòu)之棧和隊(duì)列詳解
- ?JavaScript?數(shù)據(jù)結(jié)構(gòu)之散列表的創(chuàng)建(2)
- JavaScript?數(shù)據(jù)結(jié)構(gòu)之字典方法
- JavaScript?數(shù)據(jù)結(jié)構(gòu)之集合創(chuàng)建(2)
- JavaScript數(shù)據(jù)結(jié)構(gòu)常見面試問題整理
相關(guān)文章
詳細(xì)分析Javascript中創(chuàng)建對象的四種方式
這篇文章詳細(xì)介紹了Javascript中創(chuàng)建對象的幾種方式與每種方式的優(yōu)缺點(diǎn),其中包括工廠模式、構(gòu)造函數(shù)模式、原型模式和組合使用構(gòu)造函數(shù)模式和原型模式,有需要的小伙伴們一起來學(xué)習(xí)學(xué)習(xí)吧。2016-08-08
JavaScript中的淺拷貝和深拷貝原理與實(shí)現(xiàn)淺析
這篇文章主要介紹了JavaScript中的淺拷貝和深拷貝原理與實(shí)現(xiàn),JavaScript 中的淺拷貝和深拷貝指的是在復(fù)制對象(包括對象、數(shù)組等)時,是否只復(fù)制對象的引用地址或者在復(fù)制時創(chuàng)建一個新的對象2023-04-04
javascript event在FF和IE的兼容傳參心得(絕對好用)
event在IE和FF不兼,下面為大家分享的是javascript event在FF和IE的兼容傳參心得,需要的朋友可以參考下2014-07-07
JavaScript高級程序設(shè)計 DOM學(xué)習(xí)筆記
DOM是針對XML和HTML文檔的一個API:即規(guī)定了實(shí)現(xiàn)文本節(jié)點(diǎn)操控的屬性、方法,具體實(shí)現(xiàn)由各自瀏覽器實(shí)現(xiàn)。2011-09-09
setinterval()與clearInterval()JS函數(shù)的調(diào)用方法
這篇文章主要介紹了setinterval()與clearInterval()JS函數(shù)的調(diào)用方法,實(shí)例分析了setinterval()與clearInterval()的語法結(jié)構(gòu)及使用技巧,需要的朋友可以參考下2015-01-01
基于Unit PNG Fix.js有時候在ie6下不正常的解決辦法
本篇文章是對Unit PNG Fix.js有時候在ie6下不正常的解決辦法進(jìn)行了詳細(xì)的分析介紹,需要的朋友參考下2013-06-06

