一个简单的JavaScript Map实例(分享)_javascript技巧

用js写了一个Map,带遍历功能,请大家点评下啦。

//map.js

Array.prototype.remove = function(s) {
  for (var i = 0; i < this.length; i++) {
    if (s == this[i])
      this.splice(i, 1);
  }
} 

/**
 * Simple Map
 *
 *
 * var m = new Map();
 * m.put('key','value');
 * ...
 * var s = "";
 * m.each(function(key,value,index){
 *   s += index+":"+ key+"="+value+"\n";
 * });
 * alert(s);
 *
 * @author dewitt
 * @date 2008-05-24
 */
function Map() {
  /** 存放键的数组(遍历用到) */
  this.keys = new Array();
  /** 存放数据 */
  this.data = new Object(); 

  /**
   * 放入一个键值对
   * @param {String} key
   * @param {Object} value
   */
  this.put = function(key, value) {
    if(this.data[key] == null){
      this.keys.push(key);
    }
    this.data[key] = value;
  }; 

  /**
   * 获取某键对应的值
   * @param {String} key
   * @return {Object} value
   */
  this.get = function(key) {
    return this.data[key];
  }; 

  /**
   * 删除一个键值对
   * @param {String} key
   */
  this.remove = function(key) {
    this.keys.remove(key);
    this.data[key] = null;
  }; 

  /**
   * 遍历Map,执行处理函数
   *
   * @param {Function} 回调函数 function(key,value,index){..}
   */
  this.each = function(fn){
    if(typeof fn != 'function'){
      return;
    }
    var len = this.keys.length;
    for(var i=0;i<len;i++){
      var k = this.keys[i];
      fn(k,this.data[k],i);
    }
  }; 

  /**
   * 获取键值数组(类似Java的entrySet())
   * @return 键值对象{key,value}的数组
   */
  this.entrys = function() {
    var len = this.keys.length;
    var entrys = new Array(len);
    for (var i = 0; i < len; i++) {
      entrys[i] = {
        key : this.keys[i],
        value : this.data[i]
      };
    }
    return entrys;
  }; 

  /**
   * 判断Map是否为空
   */
  this.isEmpty = function() {
    return this.keys.length == 0;
  }; 

  /**
   * 获取键值对数量
   */
  this.size = function(){
    return this.keys.length;
  }; 

  /**
   * 重写toString
   */
  this.toString = function(){
    var s = "{";
    for(var i=0;i<this.keys.length;i++,s+=','){
      var k = this.keys[i];
      s += k+"="+this.data[k];
    }
    s+="}";
    return s;
  };
} 

function testMap(){
  var m = new Map();
  m.put('key1','Comtop');
  m.put('key2','南方电网');
  m.put('key3','景新花园');
  alert("init:"+m); 

  m.put('key1','康拓普');
  alert("set key1:"+m); 

  m.remove("key2");
  alert("remove key2: "+m); 

  var s ="";
  m.each(function(key,value,index){
    s += index+":"+ key+"="+value+"\n";
  });
  alert(s);
}
  //testMap.htm

?
<html>
<head>
<title>Test Map</title>
<script language="javascript" src="map.js">
</script>
</head>
<body>
<input type="button" value="test" onclick="testMap()">
</body>
</html> 

以上这篇一个简单的JavaScript Map实例(分享)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript
map
javascript经典实例、javascript项目实例、javascript实例、javascript实例精通、javascript实例教程,以便于您获取更多的相关知识。

时间: 2024-09-12 16:46:10

一个简单的JavaScript Map实例(分享)_javascript技巧的相关文章

JavaScript简单下拉菜单实例代码_javascript技巧

本文实例讲述了JavaScript简单下拉菜单实例代码.分享给大家供大家参考.具体如下: 这是一款JavaScript实现的下拉菜单演示代码,带渐变效果的CSS+jQuery菜单,向下滑出型的菜单,最高支持两级,网上常见到的一种菜单风格,希望大家喜欢哦. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-simple-xlcd-down-menu-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C/

JavaScript 实现的checkbox经典实例分享_javascript技巧

JavaScript 实现的checkbox经典实例分享 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>邮件删除</title> <style type="text/css"> *{ margin: 0; padding: 0; } table{ width: 400px; margin-left:200px;

使用PHP+JavaScript将HTML页面转换为图片的实例分享_javascript技巧

1,准备要素 1)替换字体的js文件 js代码: function com_stewartspeak_replacement() { /* Dynamic Heading Generator By Stewart Rosenberger http://www.stewartspeak.com/headings/ This script searches through a web page for specific or general elements and replaces them wi

原生js制作日历控件实例分享_javascript技巧

本文实例为大家分享了js实现一个简单的日历控件,供大家参考,具体内容如下 效果图: 具体代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>date</title> <style type="text/css"> *{ margin:0; padding:0;} a{ text-decoration:none

最简单的tab切换实例代码_javascript技巧

JS: $(".con").eq(0).show(); $(".btn span").click(function(){ var num =$(".btn span").index(this); $(".con").hide(); $(".con").eq(num).show().slblings().hide(); }) CSS: body { cursor:default; -webkit-text-s

使用do...while的方法输入一个月中所有的周日(实例代码)_javascript技巧

使用do...while的方法输入一个月中所有的周日(实例代码) do{ var date = Number(prompt('请输入一个月的总天数')); var start = (prompt('请输入一个月的一号是周几')); for(var i=0;i<date;i++){ if((start+1)%7===0){ console.log(i+'号是周日') } } console.log('查询完毕'); }while('yes'===prompt('您还继续查询休息日吗?','yes继

JavaScript闭包实例讲解_javascript技巧

这带来的好处是内部函数可以访问定义它们的外部函数的参数和变量. 首先,我们来构造一个简单的对象. 复制代码 代码如下: var testObj = {    value: 10,    add: function(inc){        this.value += (typeof inc === "number") ? inc : 1;    }}; testObj.add();testObj.value; // 11 testObj.add(2);    testObj.value

JS获取月的最后一天与JS得到一个月份最大天数的实例代码_javascript技巧

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页</title> <script language="javascript"> function getLastDay(year,month) { var new_year = year; //取当前的年份 var new_month = month++;//取下一个月的第一天,方便计

js返回顶部实例分享_javascript技巧

话不多说,请看实例 1.HTML结构 <div class="return_top"></div> 2.css样式 .return_top{ width: 50px; height: 50px; background: url(../images/lanren.gif) no-repeat center #FF8D16; position:fixed; right: 30px; bottom: 30px; display: none; cursor: point