在前一篇文章中，我們介紹瞭如何在JavaScript中實現集合。字典和集合的主要區別就在於，集合中資料是以[值，值]的形式儲存的，我們只關心值本身；而在字典和雜湊表中資料是以[鍵，值]的形式儲存的，鍵不能重複，我們不僅關心鍵，也關心鍵所對應的值。
我們也可以把字典稱之為對映表。由於字典和集合很相似，我們可以在前一篇文章中的集合類Set的基礎上來實現我們的字典類Dictionary。與Set類相似，ES6的原生Map類已經實現了字典的全部功能，稍後我們會介紹它的用法。
下面是我們的Dictionary字典類的實現程式碼：
class Dictionary { constructor () { this.items = {}; } set (key, value) { // 向字典中新增元素 this.items[key] = value; } get (key) { // 通過鍵值查詢字典中的值 return this.items[key]; } delete (key) { // 通過使用鍵值來從字典中刪除對應的元素 if (this.has(key)) { delete this.items[key]; return true; } return false; } has (key) { // 判斷給定的鍵值是否存在於字典中 return this.items.hasOwnProperty(key); } clear() { // 清空字典內容 this.items = {}; } size () { // 返回字典中所有元素的數量 return Object.keys(this.items).length; } keys () { // 返回字典中所有的鍵值 return Object.keys(this.items); } values () { // 返回字典中所有的值 return Object.values(this.items); } getItems () { // 返回字典中的所有元素 return this.items; } }
與Set類很相似，只是把其中value的部分替換成了key。我們來看看一些測試用例：
let Dictionary = require('./dictionary');
let dictionary = new Dictionary();
dictionary.set('Gandalf', 'gandalf@email.com');
dictionary.set('John', 'john@email.com');
dictionary.set('Tyrion', 'tyrion@email.com');
console.log(dictionary.has('Gandalf')); // true
console.log(dictionary.size()); // 3
console.log(dictionary.keys()); // [ 'Gandalf', 'John', 'Tyrion' ]
console.log(dictionary.values()); // [ 'gandalf@email.com', 'john@email.com', 'tyrion@email.com' ]
console.log(dictionary.get('Tyrion')); // tyrion@email.com
dictionary.delete('John');
console.log(dictionary.keys()); // [ 'Gandalf', 'Tyrion' ]
console.log(dictionary.values()); // [ 'gandalf@email.com', 'tyrion@email.com' ]
console.log(dictionary.getItems()); // { Gandalf: 'gandalf@email.com', Tyrion: 'tyrion@email.com' }
相應地，下面是使用ES6的原生Map類的測試結果：
let dictionary = new Map(); dictionary.set('Gandalf', 'gandalf@email.com'); dictionary.set('John', 'john@email.com'); dictionary.set('Tyrion', 'tyrion@email.com'); console.log(dictionary.has('Gandalf')); // true console.log(dictionary.size); // 3 console.log(dictionary.keys()); // [Map Iterator] { 'Gandalf', 'John', 'Tyrion' } console.log(dictionary.values()); // [Map Iterator] { 'gandalf@email.com', 'john@email.com', 'tyrion@email.com' } console.log(dictionary.get('Tyrion')); // tyrion@email.com dictionary.delete('John'); console.log(dictionary.keys()); // [Map Iterator] { 'Gandalf', 'Tyrion' } console.log(dictionary.values()); // [Map Iterator] { 'gandalf@email.com', 'tyrion@email.com' } console.log(dictionary.entries()); // [Map Iterator] { [ Gandalf: 'gandalf@email.com' ], [ Tyrion: 'tyrion@email.com' ] }
和前面我們自定義的Dictionary類稍微有一點不同，values()方法和keys()方法返回的不是一個陣列，而是Iterator迭代器。另一個就是這裡的size是一個屬性而不是方法，然後就是Map類沒有getItems()方法，取而代之的是entries()方法，它返回的也是一個Iterator。有關Map類的詳細詳細介紹可以檢視這裡。
在ES6中，除了原生的Set和Map類外，還有它們的弱化版本，分別是WeakSet和WeakMap，我們在《JavaScript資料結構——棧的實現與應用》一文中已經見過WeakMap的使用了。Map和Set與它們各自的弱化版本之間的主要區別是：
- WeakSet或WeakMap類沒有entries、keys和values等迭代器方法，只能通過get和set方法訪問和設定其中的值。這也是為什麼我們在《JavaScript資料結構——棧的實現與應用》一文中要使用WeakMap類來定義類的私有屬性的原因。
- 只能用對應作為鍵值，或者說其中的內容只能是物件，而不能是數字、字串、布林值等基本資料型別。
弱化的Map和Set類主要是為了提供JavaScript程式碼的效能。
雜湊表
雜湊表（或者叫雜湊表），是一種改進的dictionary，它將key通過一個固定的演算法（雜湊函式或雜湊函式）得出一個數字，然後將dictionary中key所對應的value存放到這個數字所對應的陣列下標所包含的儲存空間中。在原始的dictionary中，如果要查詢某個key所對應的value，我們需要遍歷整個字典。為了提高查詢的效率，我們將key對應的value儲存到陣列裡，只要key不變，使用相同的雜湊函式計算出來的數字就是固定的，於是就可以很快地在陣列中找到你想要查詢的value。下面是雜湊表的資料結構示意圖：
下面是我們雜湊函式loseloseHashCode()的實現程式碼：
loseloseHashCode (key) { let hash = 0; for (let i = 0; i < key.length; i++) { hash += key.charCodeAt(i); } return hash % 37; }
這個雜湊函式的實現很簡單，我們將傳入的key中的每一個字元使用charCodeAt()函式（有關該函式的詳細內容可以檢視這裡）將其轉換成ASCII碼，然後將這些ASCII碼相加，最後用37求餘，得到一個數字，這個數字就是這個key所對應的hash值。接下來要做的就是將value存放到hash值所對應的陣列的儲存空間內。下面是我們的HashTable類的主要實現程式碼：
class HashTable { constructor () { this.table = []; } loseloseHashCode (key) { // 雜湊函式 let hash = 0; for (let i = 0; i < key.length; i++) { hash += key.charCodeAt(i); } return hash % 37; } put (key, value) { // 將鍵值對存放到雜湊表中 let position = this.loseloseHashCode(key); console.log(`${position} - ${key}`); this.table[position] = value; } get (key) { // 通過key查詢雜湊表中的值 return this.table[this.loseloseHashCode(key)]; } remove (key) { // 通過key從雜湊表中刪除對應的值 this.table[this.loseloseHashCode(key)] = undefined; } isEmpty () { // 判斷雜湊表是否為空 return this.size() === 0; } size () { // 返回雜湊表的長度 let count = 0; this.table.forEach(item => { if (item !== undefined) count++; }); return count; } clear () { // 清空雜湊表 this.table = []; } }
測試一下上面的這些方法：
let HashTable = require('./hashtable');
let hash = new HashTable();
hash.put('Gandalf', 'gandalf@email.com'); // 19 - Gandalf
hash.put('John', 'john@email.com'); // 29 - John
hash.put('Tyrion', 'tyrion@email.com'); // 16 - Tyrion
console.log(hash.isEmpty()); // false
console.log(hash.size()); // 3
console.log(hash.get('Gandalf')); // gandalf@email.com
console.log(hash.get('Loiane')); // undefined
hash.remove('Gandalf');
console.log(hash.get('Gandalf')); // undefined
hash.clear();
console.log(hash.size()); // 0
console.log(hash.isEmpty()); // true
為了方便檢視hash值和value的對應關係，我們在put()方法中加入了一行console.log()，用來列印key的hash值和value之間的對應關係。可以看到，測試的結果和前面我們給出的示意圖是一致的。
雜湊集合的實現和雜湊表類似，只不過在雜湊集合中不再使用鍵值對，而是隻有值沒有鍵。這個我們在前面介紹集合和字典的時候已經講過了，這裡不再贅述。
細心的同學可能已經發現了，這裡我們提供的雜湊函式可能過於簡單，以致於我們無法保證通過雜湊函式計算出來的hash值一定是唯一的。換句話說，傳入不同的key值，我們有可能會得到相同的hash值。嘗試一下下面這些keys：
let hash = new HashTable(); hash.put('Gandalf', 'gandalf@email.com'); hash.put('John', 'john@email.com'); hash.put('Tyrion', 'tyrion@email.com'); hash.put('Aaron', 'aaron@email.com'); hash.put('Donnie', 'donnie@email.com'); hash.put('Ana', 'ana@email.com'); hash.put('Jamie', 'jamie@email.com'); hash.put('Sue', 'sue@email.com'); hash.put('Mindy', 'mindy@email.com'); hash.put('Paul', 'paul@email.com'); hash.put('Nathan', 'nathan@email.com');
從結果中可以看到，儘管有些keys不同，但是通過我們提供的雜湊函式居然得到了相同的hash值，這顯然違背了我們的設計原則。在雜湊表中，這個叫做雜湊衝突，為了得到一個可靠的雜湊表，我們必須儘可能地避免雜湊衝突。那如何避免這種衝突呢？這裡介紹兩種解決衝突的方法：分離連結和線性探查。
分離連結
所謂分離連結，就是將原本儲存在雜湊表中的值改成連結串列，這樣在雜湊表的同一個位置上，就可以儲存多個不同的值。連結串列中的每一個元素，同時儲存了key和value。示意圖如下：
這樣，當不同的key通過雜湊函式計算出相同的hash值時，我們只需要找到陣列中對應的位置，然後往其中的連結串列新增新的節點即可，從而有效地避免了雜湊衝突。為了實現這種資料結構，我們需要定義一個新的輔助類ValuePair，它的內容如下：
let ValuePair = function (key, value) { this.key = key; this.value = value; this.toString = function () { // 提供toString()方法以方便我們測試 return `[${this.key} - ${this.value}]`; } };
ValuePair類具有兩個屬性，key和value，用來儲存我們要存入到雜湊表中的元素的鍵值對。toString()方法在這裡不是必須的，該方法是為了後面我們方便測試。
新的採用了分離連結的HashTableSeparateChaining類可以繼承自前面的HashTable類，完整的程式碼如下：
class HashTableSeparateChaining extends HashTable { constructor () { super(); } put (key, value) { let position = this.loseloseHashCode(key); if (this.table[position] === undefined) { this.table[position] = new LinkedList(); // 單向連結串列，需要引入LinkedList類 } this.table[position].append(new ValuePair(key, value)); } get (key) { let position = this.loseloseHashCode(key); if (this.table[position] !== undefined) { let current = this.table[position].getHead(); while (current) { if (current.element.key === key) return current.element.value; current = current.next; } } return undefined; } remove (key) { let position = this.loseloseHashCode(key); let hash = this.table[position]; if (hash !== undefined) { let current = hash.getHead(); while (current) { if (current.element.key === key) { hash.remove(current.element); if (hash.isEmpty()) this.table[position] = undefined; return true; } current = current.next; } } return false; } size () { let count = 0; this.table.forEach(item => { if (item !== undefined) count += item.size(); }); return count; } toString() { let objString = ""; for (let i = 0; i < this.table.length; i++) { let ci = this.table[i]; if (ci === undefined) continue; objString += `${i}: `; let current = ci.getHead(); while (current) { objString += current.element.toString(); current = current.next; if (current) objString += ', '; } objString += '\r\n'; } return objString; } }
其中的LinkedList類為單向連結串列，具體內容可以檢視《JavaScript資料結構——連結串列的實現與應用》。注意，現在hash陣列中的每一個元素都是一個單向連結串列，單向連結串列的所有操作我們可以藉助於LinkedList類來完成。我們重寫了size()方法，因為現在要計算的是陣列中所有連結串列的長度總和。
下面是HashTableSeparateChaining類的測試用例及結果：
let hash = new HashTableSeparateChaining(); hash.put('Gandalf', 'gandalf@email.com'); hash.put('John', 'john@email.com'); hash.put('Tyrion', 'tyrion@email.com'); hash.put('Aaron', 'aaron@email.com'); hash.put('Donnie', 'donnie@email.com'); hash.put('Ana', 'ana@email.com'); hash.put('Jamie', 'jamie@email.com'); hash.put('Sue', 'sue@email.com'); hash.put('Mindy', 'mindy@email.com'); hash.put('Paul', 'paul@email.com'); hash.put('Nathan', 'nathan@email.com'); console.log(hash.toString()); console.log(`size: ${hash.size()}`); console.log(hash.get('John')); console.log(hash.remove('Ana')); console.log(hash.remove('John')); console.log(hash.toString());
可以看到，結果和上面示意圖上給出的是一致的，size()、remove()和get()方法的執行結果也符合預期。
線性探查
避免雜湊衝突的另一種方法是線性探查。當向雜湊陣列中新增某一個新元素時，如果該位置上已經有資料了，就繼續嘗試下一個位置，直到對應的位置上沒有資料時，就在該位置上新增資料。我們將上面的例子改成線性探查的方式，儲存結果如下圖所示：
現在我們不需要單向連結串列LinkedList類了，但是ValuePair類仍然是需要的。同樣的，我們的HashTableLinearProbing類繼承自HashTable類，完整的程式碼如下：
class HashTableLinearProbing extends HashTable { constructor () { super(); } put (key, value) { let position = this.loseloseHashCode(key); if (this.table[position] === undefined) { this.table[position] = new ValuePair(key, value); } else { let index = position + 1; while (this.table[index] !== undefined) { index ++; } this.table[index] = new ValuePair(key, value); } } get (key) { let position = this.loseloseHashCode(key); if (this.table[position] !== undefined) { if (this.table[position].key === key) return this.table[position].value; let index = position + 1; while (this.table[index] !== undefined && this.table[index].key === key) { index ++; } return this.table[index].value; } return undefined; } remove (key) { let position = this.loseloseHashCode(key); if (this.table[position] !== undefined) { if (this.table[position].key === key) { this.table[position] = undefined; return true; } let index = position + 1; while (this.table[index] !== undefined && this.table[index].key !== key) { index ++; } this.table[index] = undefined; return true; } return false; } toString() { let objString = ""; for (let i = 0; i < this.table.length; i++) { let ci = this.table[i]; if (ci === undefined) continue; objString += `${i}: ${ci}\r\n`; } return objString; } }
使用上面和HashTableSeparateChaining類相同的測試用例，我們來看看測試結果：
可以和HashTableSeparateChaining類的測試結果比較一下，多出來的位置6、14、17、33，正是HashTableSeparateChaining類中每一個連結串列的剩餘部分。get()和remove()方法也能正常工作，我們不需要重寫size()方法，和基類HashTable中一樣，hash陣列中每一個位置只儲存了一個元素。另一個要注意的地方是，由於JavaScript中定義陣列時不需要提前給出陣列的長度，因此我們可以很容易地利用JavaScript語言的這一特性來實現線性探查。在某些程式語言中，陣列的定義是必須明確給出長度的，這時我們就需要重新考慮我們的HashLinearProbing類的實現了。
loseloseHashCode()雜湊函式並不是一個表現良好的雜湊函式，正如你所看到的，它會很輕易地產生雜湊衝突。一個表現良好的雜湊函式必須能夠儘可能低地減少雜湊衝突，並提高效能。我們可以在網上找一些不同的雜湊函式的實現方法，下面是一個比loseloseHashCode()更好的雜湊函式djb2HashCode()：
djb2HashCode (key) { let hash = 5381; for (let i = 0; i < key.length; i++) { hash = hash * 33 + key.charCodeAt(i); } return hash % 1013; }
我們用相同的測試用例來測試dj2HashCode()，下面是測試結果：
這次沒有衝突！然而這並不是最好的雜湊函式，但它是社群最推崇的雜湊函式之一。
下一章我們將介紹如何用JavaScript來實現樹。