详解JavaScript实现哈希表

详解JavaScript实现哈希表
⽬录
⼀、哈希表原理
⼆、哈希表的概念
三、哈希化冲突问题
1、链地址法
2、开放地址法
四、哈希函数的实现
五、封装哈希表
六、哈希表操作
1、插⼊&修改操作
2、获取操作
3、删除操作
4、判断哈希表是否为空
5、获取哈希表的元素个数
七、哈希表扩容
1、哈希表扩容思想
2、哈希表扩容实现
⼋、完整代码
⼀、哈希表原理
哈希表是⼀种⾮常重要的数据结构，⼏乎所有的编程语⾔都有直接或者间接的应⽤这种数据结构，它通常是基于数组实现的，当时相对于数组，它有更多的优势：
它可以提供⾮常快速的插⼊-删除-查找操作。

哈希表的速度⽐数还要快，基本可以瞬间查找到想要的元素
哈希表相对于数来说编码要容易的多。

但是哈希表相对于数组也有⼀些不⾜：
哈希表中的数组是没有顺序的，所以不能以⼀种固定的⽅式（⽐如从⼩到⼤）来遍历其中的元素。

通常情况下，哈希表中的key是不允许重复的，不能放置相同的key，⽤于保存不同的元素。

那么，哈希表到底是什么呢？
它的结构是数组，但是神奇的地⽅在于对下标值的⼀种变换，这种变换我们可以称之为哈希函数，通过哈希函数可以获得到HashCode。

接下来，我们可以来看⼀个例⼦：
使⽤⼀种数据结构来存储单词信息，⽐如有50000个单词，找到单词后每个单词有⾃⼰的具题应⽤等等。

我们应该怎样操作呢？
或许我们可以尝试将字母转化成合适的下标。

但是怎样才能将⼀个字符转化成数组的下标值呢？有没有⼀种⽅案，可以将单词转化成数组的下标值呢？如果单词转化为数组的下标，以后如果我们要查找某个单词的信息，直接按照下标值⼀步即可访问到想要的元素。

那么怎样将字符串转化为下标值呢？
其实计算机有很多的编码⽅案就是⽤数字代替单词的字符，就是字符编码，当然，我们可以设计⾃⼰的编码系统，⽐如a是1，b是2，c是3等等。

但是有了编码系统以后，⼀个单词如何转化成数字呢？
在这⾥，我们有两种⽅案：
⽅案⼀：数字相加
⼀种转换单词的简便⽅法就是把单词每个字符的编码求和
例如单词cats转成数字：3+1+20+19=43，那么43就作为cats单词下标存在数组中
但是按照这种⽅案有⼀个很明显的问题就是很多单词最终的下标可能都是43
我们知道数组中⼀个下标值位置只能存储⼀个数据，如果存⼊后来的数据，必然会造成数据的覆盖，故⽽，⼀个下标存储这么
多单词显然是不合理的。

⽅案⼆：幂的连乘
其实我们平时⽤的⼤于10的数字，就可以⽤幂的连乘来表⽰其唯⼀性，⽐如：6543 = 6 *10³+5 *10²+4 *10 + 4
我们的单词也可以使⽤这种⽅案来表⽰，⽐如cats = 3 * 27³+1 * 27² + 20 * 27+17 = 60337
这样得到的数字可以基本保证其唯⼀性，不会和别的单词重复。

但是存在⼀个问题，如果⼀个单词是zzzzzzzzzz.那么得到的数字超过7000000000000.数组不⼀定能够表⽰这么⼤的下标值，就算能够创建这么⼤的数组，事实上有很多的⽆效单词，并没有意义。

两种⽅案总结：
第⼀种⽅案（把数字相加求和）产⽣的数组下标太少，第⼆种⽅案（与27的幂相乘求和）产⽣的数组下标⼜太多。

所以现在需要⼀种压缩⽅法，把幂的连乘⽅案系统中得到的巨⼤整数范围压缩到可接收的数组范围中。

有⼀种简单的⽅法就是使⽤取余操作符，他的作⽤是得到⼀个数被另⼀个数整除后的余数。

取余操作的实现：（0-199之间的数字）
假设把从0-199的数字,(large)，压缩为0-9的数字(small)
下标的结果index = large % small
当⼀个数被10整除时，余数⼀定在0-9之间
例如16%10 = 6,23%10 = 3
这中间还是会有重复，不过重复的数量明显⼩了，⽐如说在0-199中间取5个数字，放在⼀个长度为10的数组，也会重复，但是重复的概率⾮常⼩。

⼆、哈希表的概念
了解了哈希化的原理，我们就可以来看⼏个概念：
哈希化：将⼤数字转化为数组范围内下标的过程，就称之为哈希化
哈希函数：例如将单词转化为⼤数字，⼤数字在进⾏哈希化的代码实现放在⼀个函数中，这个函数就是哈希函数。

哈希表：最终将数据插⼊到这个数组，对整个结构的封装，就可以称之为⼀个哈希表。

三、哈希化冲突问题
前⾯提到了，通过哈希化的下标值依然可能会重复，就会导致冲突，⽐如说我们将0-199的数字选取5个放在长度为10的单元格⾥，如果我们随机选出来的是33，45，27，86，92，那么最终他们的位置会是3-5-7-6-2，没有发⽣冲突，但是其中如果还有⼀个86，⼀个66呢？此时就会发⽣冲突。

该如何解决这个问题呢？
常⽤的解决⽅案有两种：
1、链地址法
链地址法是⼀种⽐较常见的解决冲突的⽅案（也称拉链法）
如下图所⽰：
创建了⼀个内存为10的数组，现在，需要将⼀些数字存到数组内部，这些数字哈希化后可能会重复，将下标值相同的数通过链表或者数组链接起来的⽅法叫做链地址法。

当我们要查找某值的时候，就可以先根据其下标找到对应的链表或者数组再在其内部寻找。

从图⽚中，我们可以看出，链地址法解决冲突的办法是每个数组单元中存储的不再是单个数据⽽是⼀个链条，这个链条常⽤的结构是数组或者链条。

那在具体应⽤中应该采⽤哪⼀种⽅式呢？其实这两种⽅法都可以，效率上也差不多，当然在某些实现中，会将新插⼊的数据放在数组或者链表的最前⾯，这种情况最好⽤链表。

因为数组再⾸位插⼊数据是需要所有其他项后移的的，⽽链表就没有这样的问题。

2、开放地址法
开放地址法的主要⼯作⽅式是寻找空⽩的单元格来添加重复的数据。

如下图所⽰：
如果有⼀个数字32，现在要将其插⼊到数组中，我们的解决⽅案为：
新插⼊的32本来应该插⼊到52的位置，但是该位置已经包含数据，
可以发现3、5、9的位置是没有任何内容的
这个时候就可以寻找对应的空⽩位置来放这个数据
但是探索这个位置的⽅式不同，有三种⽅式：
1、线性探索
即线性的查找空⽩单元
插⼊32
经过哈希化得到的index=2，但是在插⼊的时候，发现该位置已经有52
此时就从index+1的位置开始⼀点点查找合适的位置来放置32
探测到的第⼀个空的位置就是该值插⼊的位置
查询32
⾸先经过哈希化得到index= 2，⽐较2的位置结果和查询的数值是否相同，相同则直接返回
不相同则线性查找，从index位置+1查找和32⼀样的。

需要注意的是：如果32的位置之前没有插⼊，并不需要将整个哈希表查询⼀遍来确定该值是否存在，⽽是如果查询到空位置，就停⽌。

因为32之前不可能跳过空位置去其他的位置。

线性探测也有⼀个问题就是：如果之前插⼊的数据是连续插⼊的，则新插⼊的数据就需要很长的探测距离。

2、⼆次探索
⼆次探索就在线性探索的基础上进⾏了优化。

线性探测，我们可以看做是步长为1的探测，⽐如从下标值x开始，从x+1,x+2,x+3依次探测。

⼆次探测对步长做了优化，⽐如从下标值x开始,x+1²,x+2²,x+3²依次探测。

但是⼆次探测依然存在问题：⽐如我们连续插⼊的是32-112-82-42-52，那么他们依次累加的时候步长是相同的，也就是这种情况下会造成步长不⼀的⼀种聚集，还是会影响效率，怎样解决这个问题呢？来看看再哈希法。

3、再哈希法
再哈希法的做法就是：把关键字⽤另⼀个哈希函数在做⼀次哈希化，⽤这次哈希化的结果作为步长，对于指定的关键字，步长在整个探测中是不变的，不同的关键字使⽤不同的步长。

第⼆次哈希化需要具备以下特点：
和第⼀个哈希函数不同
不能输出为0（否则，将没有步长，每次叹词都是原地踏步，算法进⼊死循环）
⽽计算机专家已经设计好了⼀种⼯作很好的哈希函数。

stepSize = constant - (key % constant)
其中constant是质数，且⼩于数组的容量，key是第⼀次哈希化得到的值。

例如：stepSize = 5-(key%5),满⾜需求，并且结果不可能为0。

四、哈希函数的实现
哈希表的主要优点在于它的速度，提⾼速度的⼀个⽅法就是让哈希函数中有尽量少的乘法和除法，设计好的哈希函数需要具备以下优点：
（1）快速的计算
（2）均匀的分布
来具体实现⼀下：
⾸先我们所实现的哈希函数最主要的操作是：将字符创转化为⽐较⼤的数字和将⼤的数字压缩到数组范围之内。

如下所⽰：
function hashFunc(str,size){
//定义hashCode变量
var hashCode = 0;
//根据霍纳算法，计算hashCode的值
//先将字符串转化为数字编码
for(var i =0;i<str.length;i++){
hashCode = 37*hashCode + str.charCodeAt(i)
}
//取余操作
var index = hashCode % size;
return index;
}
代码测试：
console.log( hashFunc('abc',7));
console.log( hashFunc('cba',7));
console.log( hashFunc('nba',7));
console.log( hashFunc('rgt',7));
测试结果为：
可以发现我们得到的字符串对应的下标值分布还是很均匀的。

五、封装哈希表
这⾥我将采⽤链地址法来实现哈希表：
其中定义了三个属性：
storage:作为数组，存放相关元素
count：记录当前已存放的数据量
-limit:标记数组中⼀共可以存放多少数据
实现的哈希表（基于storage的数组）每个index对应的是⼀个数组（bucket），bucket⾥⾯存放的是（key和value),最终哈希表的数据格式是：[[[k,v],[k,v],[k,v],[[k,v],[k,v]],[k,v]]
如下图所⽰：
代码如下：
function HashTable(){
// 定义属性
this.storage = [];
this.count = 0;
this.limit = 8;
}
在将我们前⾯封装好的哈希函数通过原型添加进去：
function HashTable(){
// 定义属性
this.storage = [];
this.count = 0;
this.limit = 8;
HashTable.prototype.hashFunc = function(str,size){
//定义hashCode变量
var hashCode = 0;
//先将字符串转化为数字编码
for(var i =0;i<str.length;i++){
hashCode = 37*hashCode + str.charCodeAt(i)
}
//取余操作
var index = hashCode % size;
return index;
}
}
六、哈希表操作
1、插⼊&修改操作
哈希表的插⼊和修改操作是同⼀个函数，因为当使⽤者传⼊⼀个<key,value>时，如果原来不存在该key，那么就是插⼊操作，如果已经存在该key,对应的就是修改操作。

具体实现思路为：先根据传⼊的key获取对应的hashCode，即数组的index,接着从哈希表的Index位置中取出另⼀个数组（bucket）,查看上⼀步的bucket是否为空，如果为空的话，表⽰之前在该位置没有放置过任何的内容，则新建⼀个数组[]；再查看是否之前已经放置过key对应的value,如果放置过，那么就是依次替换操作，⽽不是插⼊新的数据，如果不是修改操作的话，那么插⼊新的数据，并且让数据项加1。

实现代码为：
//插⼊和修改操作
HashTable.prototype.put = function(key,value){
//根据key获取对应的index
var index = this.hashFunc(str,this.limit);
//根据index取出对应的bucket
var bucket = this.storage[index];
//如果值为空，给bucket赋值⼀个数组
if(bucket === null){
bucket = [];
this.storage[index] = bucket;
}
//判断是否是修改数据
for(let i =0;i<bucket.length;i++){
var tuple = bucket[i];
if(tuple[0] === key){
tuple[1] = value;
return;
}
}
//进⾏添加操作
bucket.push([key,value]);
this.count += 1;
}
测试代码：
ht.put('a',12)
ht.put('b',67)
ht.put('c',88)
ht.put('d',66)
console.log('ht',ht);
打印结果为：
测试成功
2、获取操作
⾸先根据key获取对应的index,在根据对应的index获取对应的bucket;判断bucket是否为空，如果为空，返回null,否则，线性查找bucket中的key和传⼊的key是否相等，如果相等，直接返回对应的value值，否则，直接返回null。

实现代码为：
HashTable.prototype.get = function(key){
//根据key获取对应的index
var index = this.hashFunc(key,this.limit);
//根据index获取对应的bucket
var bucket = this.storage[index];
//判断是否为空
if(bucket == null){
return null;
}
//线性查找
for(let i = 0;i<bucket.length;i++){
var tuple = bucket[i];
if(tuple[0] === key){
return tuple[1];
}
}
return null;
}
测试代码：⽐如回去key为d的元素的值
console.log("ht.get('d'):"+ht.get('d'));
3、删除操作
⽅法和获取操作的⽅法相似，⾸先根据key获取对应的index,在根据对应的index获取对应的bucket;判断bucket是否为空，如果为空，返回null,否则，线性查找bucket中的key和传⼊的key是否相等，如果相等，则进⾏删除，否则，直接返回null。

HashTable.prototype.remove = function(key){
//根据key获取对应的index
var index = this.hashFunc(key,this.limit);
//根据index获取对应的bucket
var bucket = this.storage[index];
//判断是否为空
if(bucket == null){
return null;
}
//线性查找并通过splice()删除
for(let i =0;i<bucket.length;i++){
var tuple = bucket[i];
if(tuple[0] === key){
bucket.splice(i,1);
this.count -= 1;
return tuole[1];
}
}
return null;
}
测试代码：删除key为b的元素
console.log("ht.remove('b'):"+ht.remove('b'));
4、判断哈希表是否为空
HashTable.prototype.isEmpty = function(){
return this.count === 0;
}
代码测试：
console.log("是否为空:"+ht.isEmpty());
结果：
5、获取哈希表的元素个数
HashTable.prototype.size = function(){
return this.count;
}
代码测试：
console.log("哈希表元素个数:"+ht.size());
结果：
七、哈希表扩容
1、哈希表扩容思想
上述代码的封装中，我们是将所有的数据项放在长度为5的数组中，因为我们使⽤的是链地址法，所以哈希表当前的数据量和总长度的⽐值可以⼤于1，这个哈希表可以⽆限制的插⼊新数据。

但是，随着数据量的增多，每⼀个index对应的bucket会越来越长，也会造成效率的降低，所以，在合适的情况下对数组进⾏扩容是很有必要的。

那应该如何进⾏扩容呢？扩容可以简单的将容量增⼤两倍，但是在这种情况下，所有的数据项⼀定要同时进⾏修改（重新调⽤哈希函数，获取到不同的位置）什么情况下扩容呢？⽐较常见的是：当哈希表当前的数据量和总长度的⽐值可以⼤于0.75的时候就可以进⾏扩容。

2、哈希表扩容实现
实现思路：⾸先，保存旧的数组内容，然后重置所有的属性，遍历保存的旧数组的内容，判断bucket是否为空，为空的话，进⾏跳过，否则，取出数据，重新插⼊，实现代码为：
HashTable.prototype.resize = function(newLimit){
//保存旧数组的内容
var oldStorge = this.storage;
//重置所有属性
this.storage = [];
this.count = 0;
this.limit = newLimit;
//遍历旧数组的内容
for(var i =0;i<oldStorge.length;i++){
//取出对应的bucket
var bucket = oldStorge[i];
//判断backet是否为空
if(bucket == null){
continue;
}
//取出数据重新插⼊
for(var j =0;j<bucket.length;j++){
var tuple = bucket[j];
this.put(tuple[0],tuple[1]);
}
}
}
封装完成后，每添加⼀个数据项的时候，就进⾏是否扩容判断，需要的话，在进⾏扩容，代码为：
if(this.count > this.limit*0.75){
this.resize(this.limit*2);
}
那么，有对应的扩⼤容量，就有对应的缩⼩容量，当我们删除数据项的时候，如果剩余的数据项很⼩，我们就可以进⾏缩⼩容量，代码如下：
if(this.limit > 5 && this.count < this.limit/2){
this.resize(Math.floor(this.limit/2))
}
⼋、完整代码
function HashTable(){
// 定义属性
this.storage = [];
this.count = 0;
this.limit = 5;
HashTable.prototype.hashFunc = function(str,size){
//定义hashCode变量
var hashCode = 0;
//根据霍纳算法，计算hashCode的值
//先将字符串转化为数字编码
for(var i =0;i<str.length;i++){
hashCode = 37*hashCode + str.charCodeAt(i)
}
//取余操作
var index = hashCode % size;
return index;
}
//插⼊和修改操作
HashTable.prototype.put = function(key,value){
//根据key获取对应的index
var index = this.hashFunc(key,this.limit);
//根据index取出对应的bucket
var bucket = this.storage[index];
//如果值为空，给bucket赋值⼀个数组
if(bucket == null){
bucket = [];
this.storage[index] = bucket;
}
//判断是否是修改数据
for(let i =0;i<bucket.length;i++){
var tuple = bucket[i];
if(tuple[0] === key){
tuple[1] = value;
return;
}
}
//进⾏添加操作
bucket.push([key,value]);
this.count += 1;
//进⾏扩容判断
if(this.count > this.limit*0.75){
this.resize(this.limit*2);
}
}
//获取操作
HashTable.prototype.get = function(key){
//根据key获取对应的index
var index = this.hashFunc(key,this.limit);
//根据index获取对应的bucket
var bucket = this.storage[index];
//判断是否为空
if(bucket == null){
return null;
}
//线性查找
for(let i = 0;i<bucket.length;i++){
var tuple = bucket[i];
if(tuple[0] === key){
return tuple[1];
}
}
return null;
}
//删除操作
HashTable.prototype.remove = function(key){
//根据key获取对应的index
var index = this.hashFunc(key,this.limit);
//根据index获取对应的bucket
var bucket = this.storage[index];
//判断是否为空
if(bucket == null){
return null;
}
//线性查找并通过splice()删除
for(let i =0;i<bucket.length;i++){
var tuple = bucket[i];
if(tuple[0] === key){
bucket.splice(i,1);
this.count -= 1;
return tuple[1];
//缩⼩容量
if(this.limit > 5 && this.count < this.limit/2){ this.resize(Math.floor(this.limit/2))
}
}
}
return null;
}
//扩容
HashTable.prototype.resize = function(newLimit){ //保存旧数组的内容
var oldStorge = this.storage;
//重置所有属性
this.storage = [];
this.count = 0;
this.limit = newLimit;
//遍历旧数组的内容
for(var i =0;i<oldStorge.length;i++){
//取出对应的bucket
var bucket = oldStorge[i];
//判断backet是否为空
if(bucket == null){
continue;
}
//取出数据重新插⼊
for(var j =0;j<bucket.length;j++){
var tuple = bucket[j];
this.put(tuple[0],tuple[1]);
}
}
}
HashTable.prototype.isEmpty = function(){
return this.count === 0;
}
HashTable.prototype.size = function(){
return this.count;
}
}
到此这篇关于详解JavaScript实现哈希表的⽂章就介绍到这了,更多相关JavaScript哈希表内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！。