JS模拟实现哈希表及应用详解


Posted in Javascript onMay 04, 2018

本文实例讲述了JS模拟实现哈希表及应用。分享给大家供大家参考,具体如下:

在算法中,尤其是有关数组的算法中,哈希表的使用可以很好的解决问题,所以这篇文章会记录一些有关js实现哈希表并给出解决实际问题的例子。

说明: 这篇文章所写并不是真正意义的哈希表,只是与哈希表的使用有相似之处。

第一部分:相关知识点

属性的枚举:

var person = {
  name: "zzw",
  sex: "Male",
  age: 21
};
for (var prop in person) {
  console.log(prop + " ",person[prop]);
}

输出:

JS模拟实现哈希表及应用详解

即对于对象而言,我们可以使用for in来枚举对象的属性。

属性的删除:

var person = {
  name: "zzw",
  sex: "Male",
  age: 21
};
var ifRemove = delete person.name;
for (var prop in person) {
  console.log(prop + " ",person[prop]);
}
console.log(ifRemove);

对象的属性可以通过 delete 来删除,并且会有一个返回值。 如下:

JS模拟实现哈希表及应用详解

注意: 一般只有对象的属性才可以删除,而变量是不能删除的,如:

var x = 1;
console.log(delete x);

这时打印台输出false,因为变量是不可被删除的。

检测属性是否存在:

var person = {
  name: "zzw",
  sex: "Male",
  age: 21
};
console.log("age" in person);
console.log("someOther" in person);

前者返回true,后者返回false。 即我们可以使用in来确定一个对象是否含有该属性。

属性的添加:

var person = {
  name: "zzw",
  sex: "Male",
  age: 21
};
person["school"] = "XJTU";
console.log(person);

属性的添加非常简单,如上所示,最终打印出来的对象是包含 school 属性的。

第二部分: 使用js实现哈希表

下面是通过构造函数得到一个哈希表,在使用时只需实例化即可,且下面的功能较为丰富,在实际问题中,我们可以选择性的使用 。

// 创建构造函数HashTable
function HashTable() {
    // 初始化哈希表的记录条数size
    var size = 0;
    // 创建对象用于接受键值对
    var res = {};
    // 添加关键字,无返回值
    this.add = function (key, value) {
      //判断哈希表中是否存在key,若不存在,则size加1,且赋值
      if (!this.containKey(key)) {
        size++;
      }
      // 如果之前不存在,赋值; 如果之前存在,覆盖。
      res[key] = value;
    };
    // 删除关键字, 如果哈希表中包含key,并且delete返回true则删除,并使得size减1
    this.remove = function (key) {
      if (this.containKey(key) && (delete res[key])) {
        size--;
      }
    };
    // 哈希表中是否包含key,返回一个布尔值
    this.containKey = function (key) {
      return (key in res);
    };
    // 哈希表中是否包含value,返回一个布尔值
    this.containValue = function (value) {
      // 遍历对象中的属性值,判断是否和给定value相等
      for (var prop in res) {
        if (res[prop] === value) {
          return true;
        }
      }
      return false;
    };
    // 根据键获取value,如果不存在就返回null
    this.getValue = function (key) {
      return this.containKey(key) ? res[key] : null;
    };
    // 获取哈希表中的所有value, 返回一个数组
    this.getAllValues = function () {
      var values = [];
      for (var prop in res) {
        values.push(res[prop]);
      }
      return values;
    };
    // 根据值获取哈希表中的key,如果不存在就返回null
    this.getKey = function (value) {
      for (var prop in res) {
        if (res[prop] === value) {
          return prop;
        }
      }
      // 遍历结束没有return,就返回null
      return null;
    };
    // 获取哈希表中所有的key,返回一个数组
    this.getAllKeys = function () {
      var keys = [];
      for (var prop in res) {
        keys.push(prop);
      }
      return keys;
    };
    // 获取哈希表中记录的条数,返回一个数值
    this.getSize = function () {
      return size;
    };
    // 清空哈希表,无返回值
    this.clear = function () {
      size = 0;
      res = {};
    };
}

第三部分: 应用实例

问题:给定一个整型的数组(无序),找出其中的两个数使得其和为某个指定的值,并返回这两个数的下标(数组下标从0开始),假设数组元素的值各不相同。

实现如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>哈希表的使用</title>
</head>
<body>
  <script>
  function queryIndex(arr, result) {
    var hashTable = new HashTable();
    var arrLength = arr.length;
    var sub = [];
    for (var i = 0; i < arrLength; i++) {
      // 扫描一遍,存储下标和值
      hashTable.add(i, arr[i]);
    }
    for (var j = 0; j < arrLength; j++) {
      if (hashTable.containValue(result - arr[j]) && result !== 2*arr[j]) {
        // 获取两个下标,跳出循环
        sub.push(j);
        var antherIndex = Number(hashTable.getKey(result - arr[j]));
        sub.push(antherIndex);
        break;
      }
    }
    if (sub.length !== 0) {
      return sub;
    } else {
      return -1;
    }
  }
  console.log(queryIndex([1,5,7,3,8], 15)); // 2, 4
  console.log(queryIndex([8,18,28,12,29,17], 46)); // 2, 4
  console.log(queryIndex([8,18,28,12,29,17], 2)); // -1
   // 创建构造函数HashTable
  function HashTable() {
    // 初始化哈希表的记录条数size
    var size = 0;
    // 创建对象用于接受键值对
    var res = {};
    // 添加关键字,无返回值
    this.add = function (key, value) {
      //判断哈希表中是否存在key,若不存在,则size加1,且赋值
      if (!this.containKey(key)) {
        size++;
      }
      // 如果之前不存在,赋值; 如果之前存在,覆盖。
      res[key] = value;
    };
    // 删除关键字, 如果哈希表中包含key,并且delete返回true则删除,并使得size减1
    this.remove = function (key) {
      if (this.containKey(key) && (delete res[key])) {
        size--;
      }
    };
    // 哈希表中是否包含key,返回一个布尔值
    this.containKey = function (key) {
      return (key in res);
    };
    // 哈希表中是否包含value,返回一个布尔值
    this.containValue = function (value) {
      // 遍历对象中的属性值,判断是否和给定value相等
      for (var prop in res) {
        if (res[prop] === value) {
          return true;
        }
      }
      return false;
    };
    // 根据键获取value,如果不存在就返回null
    this.getValue = function (key) {
      return this.containKey(key) ? res[key] : null;
    };
    // 获取哈希表中的所有value, 返回一个数组
    this.getAllValues = function () {
      var values = [];
      for (var prop in res) {
        values.push(res[prop]);
      }
      return values;
    };
    // 根据值获取哈希表中的key,如果不存在就返回null
    this.getKey = function (value) {
      for (var prop in res) {
        if (res[prop] === value) {
          return prop;
        }
      }
      // 遍历结束没有return,就返回null
      return null;
    };
    // 获取哈希表中所有的key,返回一个数组
    this.getAllKeys = function () {
      var keys = [];
      for (var prop in res) {
        keys.push(prop);
      }
      return keys;
    };
    // 获取哈希表中记录的条数,返回一个数值
    this.getSize = function () {
      return size;
    };
    // 清空哈希表,无返回值
    this.clear = function () {
      size = 0;
      res = {};
    };
  }
  </script>
</body>
</html>

在实际的使用过程中,我们可以先写出主要的功能,然后有需要再添加。

Javascript 相关文章推荐
BOM与DOM的区别分析
Oct 26 Javascript
javascript unicode与GBK2312(中文)编码转换方法
Nov 14 Javascript
使用JavaScript脚本无法直接改变Asp.net中Checkbox控件的Enable属性的解决方法
Sep 16 Javascript
Bootstrap实现提示框和弹出框效果
Jan 11 Javascript
详解Angular.js数据绑定时自动转义html标签及内容
Mar 30 Javascript
vue中实现滚动加载更多的示例
Nov 08 Javascript
前端MVVM框架解析之双向绑定
Jan 24 Javascript
Element-ui table中过滤条件变更表格内容的方法
Mar 02 Javascript
JS和Canvas实现图片的预览压缩和上传功能
Mar 30 Javascript
自定义javascript验证框架示例【附源码下载】
May 31 Javascript
vue使用screenfull插件实现全屏功能
Sep 17 Javascript
Canvas跟随鼠标炫彩小球的实现
Apr 11 Javascript
vue地区选择组件教程详解
May 04 #Javascript
Vue 按键修饰符处理事件的方法
May 04 #Javascript
vue mint-ui tabbar变组件使用
May 04 #Javascript
Vue结合Video.js播放m3u8视频流的方法示例
May 04 #Javascript
原生javascript AJAX 三级联动的实现代码
May 04 #Javascript
Vue在页面右上角实现可悬浮/隐藏的系统菜单
May 04 #Javascript
vue裁切预览组件功能的实现步骤
May 04 #Javascript
You might like
php中使用Akismet防止垃圾评论的代码
2011/06/10 PHP
PHP语法自动检查的Vim插件
2014/08/11 PHP
php内嵌函数用法实例
2015/03/20 PHP
Yii2分页的使用及其扩展方法详解
2016/05/23 PHP
php分页查询mysql结果的base64处理方法示例
2017/05/18 PHP
PHP生成二维码与识别二维码的方法详解【附源码下载】
2019/03/07 PHP
一文掌握PHP Xdebug 本地与远程调试(小结)
2019/04/23 PHP
javascript 数组的方法集合
2008/06/05 Javascript
javascript 时间比较实现代码
2009/10/28 Javascript
简略的前端架构心得&amp;&amp;基于editor为例子的编码小技巧
2010/11/25 Javascript
javascript高级学习笔记整理
2011/08/14 Javascript
ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能
2012/02/03 Javascript
妙用Jquery的val()方法
2012/06/27 Javascript
Js实现滚动变色的文字效果
2014/06/16 Javascript
JS控制弹出新页面窗口位置和大小的方法
2015/03/02 Javascript
jQuery插件pagewalkthrough实现引导页效果
2015/07/05 Javascript
js数组去重的方法汇总
2015/07/29 Javascript
jQuery实现仿QQ空间装扮预览图片的鼠标提示效果代码
2015/10/30 Javascript
js精准的倒计时函数分享
2016/06/29 Javascript
JS实现简单的tab切换选项卡效果
2016/09/21 Javascript
jq checkbox 的全选并ajax传参的实例
2017/04/01 Javascript
利用Node.js检测端口是否被占用的方法
2017/12/07 Javascript
vue中当图片地址无效的时候,显示默认图片的方法
2018/09/18 Javascript
vue 组件内获取actions的response方式
2019/11/08 Javascript
Vue双向数据绑定(MVVM)的原理
2020/10/03 Javascript
用pywin32实现windows模拟鼠标及键盘动作
2014/04/22 Python
win10系统中安装scrapy-1.1
2016/07/03 Python
python 批量修改 labelImg 生成的xml文件的方法
2019/09/09 Python
如何利用python进行时间序列分析
2020/08/04 Python
枚举与#define宏的区别
2014/04/30 面试题
中学教师实习自我鉴定
2013/09/28 职场文书
文秘自荐信
2013/10/20 职场文书
公司会议策划方案
2014/05/17 职场文书
教师考核评语大全
2014/12/31 职场文书
浅谈Python从全局与局部变量到装饰器的相关知识
2021/06/21 Python
ubuntu端向日葵键盘输入卡顿问题及解决
2022/12/24 Servers