重载toString实现JS HashMap分析


Posted in Javascript onMarch 13, 2011

不过请仔细对比一下,你会发现其中差别还是很大的。Java HashMap的key是Object类型,所以可以任何类型的参数,而JS的key只能是字符串或是数字。 你也许会说,obj={};map[obj]=1;这段代码传入了既不是数字也不是字符的key,但也没发生错误啊。那是因为解释器将obj对象通过内置的toString方法转换成“[object Object]”这段字符了,你可以用for each下map看看。而java之所以能够接受任何类型的key,是因为其Object实现了HashCode方法,而每个类都继承或重写了Object的HashCode,所以任何变量都有一个哈希值。我们也可以用JS来尝试一下。

前面提到了toString方法,用于任何类型转成字符;和它类似的还有另一个方法:valueOf,用于转型成数字。因为数字比较容易索引,我们先尝试valueOf:

Object.prototype.valueOf = function() 
{ 
alert("Hello~") 
}; var map = []; 
var obj = {}; 
map[obj] = 1;

结果很失望,对话框并没有跳出来,说明JS引擎没有尝试将obj对象转成数字。下面再尝试修改成toString方法:
Object.prototype.toString = function() 
{ 
alert("Hello~") 
}; var map = {}; 
var obj = {}; 
map[obj] = 1;

这时对话框跳出来了。当然我们没有返回数据,这个1就被保存在了map["undefined"]里面。但若我们返回一个数值,并且能保证每个变量唯一的数值,那么就可以用最原始的map[key]的方式索引任何类型了。我们重载Object的toString方法:
var HASH_ID = 0; Object.prototype.toString = function() 
{ 
if(this._HASH == null) 
this._HASH = HASH_ID++; 
return "Obj:" + this._HASH; 
};

下面来测试一下:
var HashMap = {}; 
var obj1 = {}; 
var obj2 = {}; 
HashMap[obj1] = "Foo1"; 
HashMap[obj2] = "Foo2"; 
alert(HashMap[obj1] + " & " + HashMap[obj2]); 
HashMap[obj1] = "Bar1"; 
HashMap[obj2] = "Bar2"; 
alert(HashMap[obj1] + " & " + HashMap[obj2]);

分别输出:Foo1 & Foo2 和 Bar1 & Bar2,这说明了obj1,obj2始终对应着同个索引。

当然,如果object自身重写了toString方法就不一定了,它也许每次返回都不一样的值。所以运用的时候,要根据实际情况做相应的调整。(2011/3/12)

Javascript 相关文章推荐
Google韩国首页图标动画效果
Aug 26 Javascript
javascript判断用户浏览器插件安装情况的代码
Jan 01 Javascript
在多个页面使用同一个HTML片段的代码
Mar 04 Javascript
详解js中构造流程图的核心技术JsPlumb
Dec 08 Javascript
HTML5游戏引擎LTweenLite实现的超帅动画效果(附demo源码下载)
Jan 26 Javascript
关于javascript获取内联样式与嵌入式样式的实例
Jun 01 Javascript
JavaScript编写的网页小游戏,很给力
Aug 18 Javascript
利用jQuery实现简单的拖曳效果实例代码
Oct 20 jQuery
vue自定义指令之面板拖拽的实现
Apr 14 Javascript
前端js中的事件循环eventloop机制详解
May 15 Javascript
Vue中插槽slot的使用方法与应用场景详析
Jun 08 Vue.js
Moment的feature导致线上bug解决分析
Sep 23 Javascript
JavaScript获取页面上某个元素的代码
Mar 13 #Javascript
jQuery hover 延时器实现代码
Mar 12 #Javascript
js中if语句的几种优化代码写法
Mar 12 #Javascript
鼠标事件延时切换插件
Mar 12 #Javascript
autoIMG 基于jquery的图片自适应插件代码
Mar 12 #Javascript
再谈javascript图片预加载技术(详细演示)
Mar 12 #Javascript
在jQuery1.5中使用deferred对象 着放大镜看Promise
Mar 12 #Javascript
You might like
让Nginx支持ThinkPHP的URL重写和PATHINFO的方法分享
2011/08/08 PHP
PHP魔术方法__GET、__SET使用实例
2014/11/25 PHP
Smarty环境配置与使用入门教程
2016/05/11 PHP
PHP有序表查找之二分查找(折半查找)算法示例
2018/02/09 PHP
javascript 日期时间函数(经典+完善+实用)
2009/05/27 Javascript
关于jquery.validate1.9.0前台验证的使用介绍
2013/04/26 Javascript
JQUERY实现左侧TIPS滑进滑出效果示例
2013/06/27 Javascript
jquery.cookie() 方法的使用(读取、写入、删除)
2013/12/05 Javascript
实例详解jQuery表单验证插件validate
2016/01/18 Javascript
JS随机洗牌算法之数组随机排序
2016/03/23 Javascript
JS onkeypress兼容性写法详解
2016/04/27 Javascript
AngularJS过滤器详解及示例代码
2016/08/16 Javascript
利用jquery禁止外层滚动条的滚动
2017/01/05 Javascript
Vue 短信验证码组件开发详解
2017/02/14 Javascript
微信小程序 自动登陆PHP源码实例(源码下载)
2017/05/08 Javascript
vue-cli如何引入bootstrap工具的方法
2017/10/19 Javascript
代码整洁之道(重构)
2018/10/25 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
2019/02/21 Javascript
Vue项目打包编译优化方案
2020/09/16 Javascript
[28:48]《真视界》- 2017年国际邀请赛
2017/09/27 DOTA
wxPython 入门教程
2008/10/07 Python
为Python程序添加图形化界面的教程
2015/04/29 Python
python绘制直线的方法
2018/06/30 Python
Python 通过微信控制实现app定位发送到个人服务器再转发微信服务器接收位置信息
2019/08/05 Python
Python生成器generator原理及用法解析
2020/07/20 Python
HTML5新特性之语义化标签
2017/10/31 HTML / CSS
美国快时尚彩妆品牌:Winky Lux(透明花瓣润唇膏)
2018/11/06 全球购物
德国自行车商店:Tretwerk
2019/06/21 全球购物
飞利浦法国官网:Philips法国
2019/07/10 全球购物
Java程序员面试题
2013/07/15 面试题
教师辞职报告范文
2014/01/20 职场文书
计算机专业自荐信
2014/05/24 职场文书
经营场所使用证明
2015/06/19 职场文书
2016年优秀共青团员事迹材料
2016/02/25 职场文书
Python 制作自动化翻译工具
2021/04/25 Python
MySQL 四种连接和多表查询详解
2021/07/16 MySQL