JavaScript实现Map类的两种方案:数组闭包与原型扩展

作者:拾光时间:2026-10-30 09:17:29浏览:587

本文详解JavaScript中模拟Map类的两种实现方式。第一种利用数组存储数据并结合闭包封装私有方法;第二种通过JSON对象存储数据,利用原型链扩展put、get、remove等方法。文章提供完整代码示例,帮助开发者理解如何在JS中构建键值对集合。

JavaScript实现Map类的两种方案:数组闭包与原型扩展

本文介绍一种在JavaScript中模拟Map类的具体实现方案,供开发者参考学习。

该实现参考Java中Map接口的特性,旨在完成键(key)与值(value)的存储与管理。

基于数组与闭包的实现

第一种方案采用数组来存储数据,并通过闭包机制来封装内部逻辑。


function Map() {
  var struct = function (key, value) {
    this.key = key;
    this.value = value;
  }
  var put = function (key, value) {
    for (var i = 0; i < this.arr.length; i++) {
      if (this.arr[i].key === key) {
        this.arr[i].value = value;
        return;
      }
    }
    this.arr[this.arr.length] = new struct(key, value);
  }
  var get = function (key) {
    for (var i = 0; i < this.arr.length; i++) {
      if (this.arr[i].key === key) {
        return this.arr[i].value;
      }
    }
    return null;
  }
  var remove = function (key) {
    var v;
    for (var i = 0; i < this.arr.length; i++) {
      v = this.arr.pop();
      if (v.key === key) {
        continue;
      }
      this.arr.unshift(v);
    }
  }
  var size = function () {
    return this.arr.length;
  }
  var isEmpty = function () {
    return this.arr.length <= 0;
  }
  this.arr = new Array();
  this.get = get;
  this.put = put;
  this.remove = remove;
  this.size = size;
  this.isEmpty = isEmpty;
}

基于JSON与原型链的实现

第二种方案利用JSON对象存储数据,并通过原型方式扩展相关方法。


function Map() {
  this.obj = {};
  this.count = 0;
}
Map.prototype.put = function (key, value) {
  var oldValue = this.obj[key];
  if (oldValue == undefined) {
    this.count++;
  }
  this.obj[key] = value;
}
Map.prototype.get = function (key) {
  return this.obj[key];
}
Map.prototype.remove = function (key) {
  var oldValue = this.obj[key];
  if (oldValue != undefined) {
    this.count--;
    delete this.obj[key];
  }
}
Map.prototype.size = function () {
  return this.count;
}
var map = new Map();
map.put("key","map");
map.put("key","map1");
alert(map.get("key"));//map1
map.remove("key");
alert(map.get("key"));//undefined

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

作者最新文章