字典(Dictionary)
字典(Dictionary)是一種以 鍵-值對(duì) 形式存儲(chǔ)數(shù)據(jù)的數(shù)據(jù)結(jié)構(gòu) 指孤,就如同我們平時(shí)查看通訊錄一樣忿偷,要找一個(gè)電話,首先先找到該號(hào)碼的機(jī)主名字,名字找到了特占,緊接著電話號(hào)碼也就有了理肺。這里的鍵就是你用來(lái)查找的東西摄闸,本例中指代的就是名字,值就是查找得到的結(jié)果妹萨,也就是對(duì)應(yīng)的電話號(hào)碼年枕。
其實(shí),JavaScript 中的 Object 類就是以字典的形式設(shè)計(jì)的乎完,下面我們將會(huì)借助 Object 類的特性熏兄,自主實(shí)現(xiàn)一個(gè) Dictionary 類,讓這種字典類型的對(duì)象使用起來(lái)更加方便囱怕。
字典的實(shí)現(xiàn)
字典(Dictionary)類的基礎(chǔ)是 Array 類霍弹。
同之前的我們所看到的數(shù)據(jù)結(jié)構(gòu)一樣,字典類也應(yīng)該有添加娃弓、刪除典格、清空等操作,于是我們可以先定義一個(gè)字典類的基礎(chǔ)數(shù)據(jù)類型台丛,如下圖耍缴。
有了上述的數(shù)據(jù)類型定義,我們 Dictionary 類構(gòu)造函數(shù)定義也就迎刃而解了
//字典類
function Dictionary () {
this.dataStore = [];
this.add = add; // 添加元素
this.find = find; // 查找元素
this.remove = remove; // 刪除元素
this.count = count; // 字典中元素個(gè)數(shù)
this.showAll = showAll; // 顯示字典元素
this.clear = clear; // 清空字典
}
add:向字典添加一個(gè)元素
上面我們也提到挽霉,字典是以 鍵值對(duì) 的方式存儲(chǔ)數(shù)據(jù)的防嗡,因此,add 方法就需要接受兩個(gè)參數(shù)侠坎,分別是 鍵和值 蚁趁,其中鍵表示其在字典中的索引,實(shí)現(xiàn)如下
//向字典添加元素
function add( key , value ){
this.dataStore[key] = value;
}
沒錯(cuò)实胸,就是這么簡(jiǎn)單他嫡!接著我們來(lái)看看 find 方法
find:查找字典中的元素
我們是以鍵值對(duì)方式存儲(chǔ)的,因此我們只需要傳入需要查找的鍵庐完,就可以順理成章的取到對(duì)應(yīng)的值钢属,這對(duì)應(yīng)于JS中的數(shù)組也是十分簡(jiǎn)單的;
//查找字典中的元素
function find( key ){
return this.dataStore[key];
}
有了添加和查找门躯,接下來(lái)就是刪除了淆党!
remove:刪除字典中的一個(gè)元素
要想刪除字典中的一個(gè)元素,即刪除一個(gè) 鍵值對(duì) , 我們需要借助 JS 提供的一個(gè)內(nèi)置的函數(shù) : delete 染乌,這個(gè)函數(shù)我們并不陌生山孔,它可以同時(shí)刪除鍵和與其對(duì)應(yīng)的值,那么 remove 方法定義就很簡(jiǎn)單了
//刪除一個(gè)元素
function remove( key ){
if( this.dataStore[key] ) delete this.dataStore[key];
else return 'Not Found';
}
除此之外荷憋,我們還想顯示字典中的所有鍵值對(duì)饱须,showAll 方法來(lái)完成。
showAll:顯示字典中所以鍵值對(duì)
//顯示字典元素
function showAll () {
for( var key in this.dataStore ){
console.log( key + '->' + this.dataStore[key] );
}
}
我們已經(jīng)完成了字典的基本操作台谊,現(xiàn)在我們做個(gè)小測(cè)試,
//實(shí)例化字典類
var directory = new Dictionary();
//添加元素
directory.add( 'Jack' , '138****5505' );
directory.add( 'Alice' , '156****6606');
directory.add( 'Tom' , '180****8808');
//顯示字典
directory.showAll(); // Jack->138****5505
// Alice->156****6606
// Tom->180****8808
directory.remove( 'Tom' );
directory.showAll(); // Jack->138****5505
// Alice->156****6606
我們定義的時(shí)候看到了還有兩個(gè)方法沒有實(shí)現(xiàn)呢譬挚,一個(gè)是 count 锅铅, 另一個(gè)是 clear ,下面我們一起來(lái)實(shí)現(xiàn)减宣。
count:查看字典中元素的個(gè)數(shù)
該方法有時(shí)候會(huì)很有用盐须,不過(guò)實(shí)現(xiàn)起來(lái)可能會(huì)跟你想的不太一樣,我們先看看如何實(shí)現(xiàn)的
//查看字典中元素的個(gè)數(shù)
function count(){
var n = 0 ;
for ( var key in this.dataStore ){
++n;
}
return n;
}
怎么樣筒饰,是不是跟想的不太一樣钉汗,為什么不用 length 屬性曙蒸,不是很簡(jiǎn)單么?其實(shí)不然塑径,我們的鍵為字符串的時(shí)候,數(shù)組的 length 屬性就不起作用了填具,請(qǐng)看下面的例子:
var nums = [ 0 , 1 , 2 ] ;
console.log(nums.length) // 3
var directory = [];
directory['Jack'] = '138****5505';
directory['Alice'] = '156****6606';
directory['Tom'] = '180****8808';
console.log(directory.length) // 0
現(xiàn)在是不是又了解了一個(gè)坑统舀!哈哈,我們把最后一個(gè)clear方法實(shí)現(xiàn)一下劳景。
clear:清空字典
//清空字典
function clear(){
for( var key in this.dataStore ){
delete this.dataStore[key];
}
}
至此誉简,字典的功能已基本完成了,我們利用上述的代碼繼續(xù)走下去盟广,測(cè)試測(cè)試
console.log(directory.count()); // 2
directory.clear();
console.log(directory.count()); // 0
字典中我們通常都是用鍵來(lái)取值闷串,所以我們無(wú)須關(guān)心s數(shù)據(jù)在字典中的實(shí)際存儲(chǔ)順序,但我們希望能看到顯示字典內(nèi)容的時(shí)候是有序的筋量,這也很簡(jiǎn)單烹吵,我們只需稍微改造一下我們的 showAll 方法即可。
//改造后的showAll
function showAll(){
var sortKeys = Object.keys(this.dataStore).sort();
for( var key in sortKeys ){
console.log( sortKeys[key] + '->' + this.dataStore[sortKeys[key]] );
}
}
和我們之前的方法唯一的區(qū)別就是毛甲,我們拿到了鍵之后年叮,對(duì)其進(jìn)行了一次 sort 排序,下面我們看看新方法的輸出玻募。
// 重新打印上述字典
directory.showAll(); // Alice->156****6606
// Jack->138****5505
// Tom->180****8808
要注意的是只损,上述 showAll 方法中,進(jìn)行 Object.keys().sort()排序后,返回的是新的一個(gè)數(shù)組跃惫,類似下面的形式叮叹,
//sortKeys
["Alice", "Jack", "Tom"]
此時(shí),數(shù)組的 key 是 0爆存、1蛉顽、2,這樣是不是就清晰很多了呢先较?
至此携冤,我們已基本了解了字典的一些內(nèi)容,并且我們可以用JS自己去實(shí)現(xiàn)一個(gè)字典了闲勺,有木有很棒曾棕!接下來(lái),大家加油~