使用JS模拟出Map对象

最新推荐文章于 2024-07-30 22:36:34 发布
最新推荐文章于 2024-07-30 22:36:34 发布
阅读量485 收藏
点赞数
分类专栏： JavaScript/jQuery 文章标签： javascript map

最近要做的一个项目，支持方提供的一个Map方法，用着相当可以，功能稍有欠缺，因此我为之做了扩展，以下是代码：

  1. function Map() {
    this.elements = new Array();

    //获取MAP元素个数
    this.size = function() {
        return this.elements.length;
    };

    //判断MAP是否为空
    this.isEmpty = function() {
        return (this.elements.length < 1);
    };

    //删除MAP所有元素
    this.clear = function() {
        this.elements = new Array();
    };

    //向MAP中增加元素（key, value) 
    this.put = function(_key, _value) {
        this.elements.push( {
            key : _key,
            value : _value
        });
    };

    //删除指定KEY的元素，成功返回True，失败返回False
    this.removeByKey = function(_key) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].key == _key) {
                    this.elements.splice(i, 1);
                    return true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };
    
    //删除指定VALUE的元素，成功返回True，失败返回False
    this.removeByValue = function(_value) {//removeByValueAndKey
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value) {
                    this.elements.splice(i, 1);
                    return true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };
    
    //删除指定VALUE的元素，成功返回True，失败返回False
    this.removeByValueAndKey = function(_key,_value) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value && this.elements[i].key == _key) {
                    this.elements.splice(i, 1);
                    return true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };

    //获取指定KEY的元素值VALUE，失败返回NULL
    this.get = function(_key) {
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].key == _key) {
                    return this.elements[i].value;
                }
            }
        } catch (e) {
            return false;
        }
        return false;
    };

    //获取指定索引的元素（使用element.key，element.value获取KEY和VALUE），失败返回NULL
    this.element = function(_index) {
        if (_index < 0 || _index >= this.elements.length) {
            return null;
        }
        return this.elements[_index];
    };

    //判断MAP中是否含有指定KEY的元素
    this.containsKey = function(_key) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].key == _key) {
                    bln = true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };

    //判断MAP中是否含有指定VALUE的元素
    this.containsValue = function(_value) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value) {
                    bln = true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };
    
    //判断MAP中是否含有指定VALUE的元素
    this.containsObj = function(_key,_value) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value && this.elements[i].key == _key) {
                    bln = true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };

    //获取MAP中所有VALUE的数组（ARRAY）
    this.values = function() {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            arr.push(this.elements[i].value);
        }
        return arr;
    };
    
    //获取MAP中所有VALUE的数组（ARRAY）
    this.valuesByKey = function(_key) {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            if (this.elements[i].key == _key) {
                arr.push(this.elements[i].value);
            }
        }
        return arr;
    };

    //获取MAP中所有KEY的数组（ARRAY）
    this.keys = function() {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            arr.push(this.elements[i].key);
        }
        return arr;
    };
    
    //获取key通过value
    this.keysByValue = function(_value) {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            if(_value == this.elements[i].value){
                arr.push(this.elements[i].key);
            }
        }
        return arr;
    };
    
    //获取MAP中所有KEY的数组（ARRAY）
    this.keysRemoveDuplicate = function() {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            var flag = true;
            for(var j=0;j<arr.length;j++){
                if(arr[j] == this.elements[i].key){
                    flag = false;
                    break;
                } 
            }
            if(flag){
                arr.push(this.elements[i].key);
            }
        }
        return arr;
    };
}


function Map() {
    this.elements = new Array();

    //获取MAP元素个数
    this.size = function() {
        return this.elements.length;
    };

    //判断MAP是否为空
    this.isEmpty = function() {
        return (this.elements.length < 1);
    };

    //删除MAP所有元素
    this.clear = function() {
        this.elements = new Array();
    };

    //向MAP中增加元素（key, value) 
    this.put = function(_key, _value) {
        this.elements.push( {
            key : _key,
            value : _value
        });
    };

    //删除指定KEY的元素，成功返回True，失败返回False
    this.removeByKey = function(_key) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].key == _key) {
                    this.elements.splice(i, 1);
                    return true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };
    
    //删除指定VALUE的元素，成功返回True，失败返回False
    this.removeByValue = function(_value) {//removeByValueAndKey
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value) {
                    this.elements.splice(i, 1);
                    return true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };
    
    //删除指定VALUE的元素，成功返回True，失败返回False
    this.removeByValueAndKey = function(_key,_value) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value && this.elements[i].key == _key) {
                    this.elements.splice(i, 1);
                    return true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };

    //获取指定KEY的元素值VALUE，失败返回NULL
    this.get = function(_key) {
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].key == _key) {
                    return this.elements[i].value;
                }
            }
        } catch (e) {
            return false;
        }
        return false;
    };

    //获取指定索引的元素（使用element.key，element.value获取KEY和VALUE），失败返回NULL
    this.element = function(_index) {
        if (_index < 0 || _index >= this.elements.length) {
            return null;
        }
        return this.elements[_index];
    };

    //判断MAP中是否含有指定KEY的元素
    this.containsKey = function(_key) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].key == _key) {
                    bln = true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };

    //判断MAP中是否含有指定VALUE的元素
    this.containsValue = function(_value) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value) {
                    bln = true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };
    
    //判断MAP中是否含有指定VALUE的元素
    this.containsObj = function(_key,_value) {
        var bln = false;
        try {
            for (i = 0; i < this.elements.length; i++) {
                if (this.elements[i].value == _value && this.elements[i].key == _key) {
                    bln = true;
                }
            }
        } catch (e) {
            bln = false;
        }
        return bln;
    };

    //获取MAP中所有VALUE的数组（ARRAY）
    this.values = function() {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            arr.push(this.elements[i].value);
        }
        return arr;
    };
    
    //获取MAP中所有VALUE的数组（ARRAY）
    this.valuesByKey = function(_key) {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            if (this.elements[i].key == _key) {
                arr.push(this.elements[i].value);
            }
        }
        return arr;
    };

    //获取MAP中所有KEY的数组（ARRAY）
    this.keys = function() {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            arr.push(this.elements[i].key);
        }
        return arr;
    };
    
    //获取key通过value
    this.keysByValue = function(_value) {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            if(_value == this.elements[i].value){
                arr.push(this.elements[i].key);
            }
        }
        return arr;
    };
    
    //获取MAP中所有KEY的数组（ARRAY）
    this.keysRemoveDuplicate = function() {
        var arr = new Array();
        for (i = 0; i < this.elements.length; i++) {
            var flag = true;
            for(var j=0;j<arr.length;j++){
                if(arr[j] == this.elements[i].key){
                    flag = false;
                    break;
                } 
            }
            if(flag){
                arr.push(this.elements[i].key);
            }
        }
        return arr;
    };
}

已经具备的功能：

/* size()     获取MAP元素个数
* isEmpty()    判断MAP是否为空
* clear()     删除MAP所有元素
* put(key, value)   向MAP中增加元素（key, value)
* remove(key)    删除指定KEY的元素，成功返回True，失败返回False
* get(key)    获取指定KEY的元素值VALUE，失败返回NULL
* element(index)   获取指定索引的元素（使用element.key，element.value获取KEY和VALUE），失败返回NULL
* containsKey(key)  判断MAP中是否含有指定KEY的元素
* containsValue(value) 判断MAP中是否含有指定VALUE的元素
* values()    获取MAP中所有VALUE的数组（ARRAY）
* keys()     获取MAP中所有KEY的数组（ARRAY）

*/

相对于java的Map来说，这个JS的Map功能或许尚有不足，尤其是put方法，居然不能够自动排重，也就是如果key存在重复，就一直存在着，也就说key有可能不唯一，不会进行value的覆盖，这显然与我们所认识的Map有所区别，为此，做一个扩展：

var myMap = {  
   getMapInstance:function(){  
       var map = new Map();  
       /** 
        * 如果key已存在,覆盖value 
        */  
       map.putNoRepeat = function(_key,_value){  
           if(this.containsKey(_key)){  
               for (i = 0; i < this.elements.length; i++) {  
                     if (this.elements[i].key == _key) {  
                         this.elements[i].value = _value;  
                         break;  
                     }  
                }  
            }else{  
                this.put(_key, _value);  
            }  
        }  
        return map;  
    }     
          
};


        

var myMap = {
	getMapInstance:function(){
		var map = new Map();
		/**
		 * 如果key已存在,覆盖value
		 */
		map.putNoRepeat = function(_key,_value){
			if(this.containsKey(_key)){
				for (i = 0; i < this.elements.length; i++) {
					 if (this.elements[i].key == _key) {
						 this.elements[i].value = _value;
						 break;
			         }
		        }
			}else{
				this.put(_key, _value);
			}
		}
		return map;
	}	
		
};
这样的话，即继承了上面的Map，有了putNoRepeat这样的排重方法，使用的时候只需要：

 

var map = myMap.getMapInstance();


 

这样既能使用扩展的方法，又能节省不必要内存开销。
freellf
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript模拟map输出与去除重复项的方法
10-24
以下是一个简单的JavaScript模拟Map的示例： ```javascript function Map() { var obj = {}; // 存储键值对的私有对象 this.put = function(key, value) { obj[key] = value; // 将键值对添加到对象中 }; ...
javascript实现Java中的Map对象功能的实例详解
10-19
在JavaScript中，没有内置的Map对象，但可以通过自定义对象的方式来模拟实现类似Java中的Map功能。这个自定义的Map对象可以存储键值对，并提供类似于Java Map接口的方法，如put、get、remove、clear、contains以及...
js中遍历Map对象的方法
12-12
js中遍历Map对象的方法 console.log(jsonData);//火狐控制台打印输出： Object { fileNumber="文件编号", fileName="文件名称"} for(var key in jsonData) console.log("属性：" + key + ",值："+ jsonData[key]); } 打印输出： 属性：fileNumber, 值：文件编号 属性：fileName, 值：文件名称 以上这篇js中遍历Map对象的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持软件开发网。
Vue中引入高德地图标记选点--小白详细
Active的博客
10-16 5891
1、首先在高德开发者申请开发者账号申请key 2、安装vue-amap npm install vue-amap --save 3、配置VueAMap --main.js importVueAMapfrom'vue-amap'; Vue.use(VueAMap); VueAMap.initAMapApiLoader({ //高德的keye key:'你...
python面向对象(1) —— 封装
weixin_48445640的博客
09-26 497
类与对象 class Gun(): def __init__(self,width): gun.length = 100 gun.width = width def shoot(self): print('bang') print(self) wuzi = Gun(3) print(wuzi) wuzi.blood_loss = 30 关系：用类实例化成一个对象，实例化也就是创造的意思，一个类可以创建多个对象 如上述的Gun即为一个类，wuzi即为实例化的对象 实例化对象 = 类(
使用JS模拟Map容器
Raypod的博客
02-22 987
使用js语法简单模拟java的Map容器
frida中使用gson打印map对象
技术博客记录
10-22 519
【代码】frida中使用gson打印map对象。
Javascript遍历map集合以及map对象
热门推荐
semial的专栏
07-03 3万+
js中map对象简单实例 es6提供一个对象Map， 其功能类似于java中的Map, 下面是java中的Map和js中的Map的简单对比： js中的Map.set()相当于java中的Map.put(), js中的Map.size相当于java中的Map.size()；//在js中size是属性，在Map中size()是方法。 遍历map对象 var map = [{ ...
JavaScript中Map和WeakMap的区别及使用场景
官方推荐
07-18 1万+
JavaScript中Map和WeakMap的区别及使用场景
javascript模拟实现Map
指尖残雪
09-16 749
使用javascript模拟实现Map，实现添加、删除、得到长度、得到数据，遍历 Untitled Document function Map(){ // private var obj = {} ;// 空的对象容器,承装键值对 // put 方法 this.put = f
javascript：用object对象模拟java的map集合
liqiancao的专栏
12-11 1178
<script type=text/javascript charset=utf-8> /***************模拟java里的map集合***************/ function Map(){ var obj = {};//空对象，存放键值对 //put方法，存值
js遍历map javaScript遍历map的简单实现
11-26
在JavaScript中，遍历Map对象通常有两种主要的方法：使用`for...of`循环和使用`Map.prototype.forEach()`方法。 首先，让我们来看看在给定的描述中展示的简单实现： ```javascript var map = { "name": "华仔", ...
如何用JS模拟实现数组的map方法
11-19
这段代码会打印出与原生`map`方法相同的结果，证明我们的模拟实现是成功的。 ### 注意事项与优化 虽然这个实现已经可以满足基本功能，但还有一些细节需要注意： 1. **类型检查**：在实际开发中，应确保调用`new...
js中数组map方法的使用和实现
AIROU_ao的博客
09-24 819
js中数组map方法的使用和实现
VUE3自定义指令防止重复点击多次提交
MadSnail00的博客
07-30 269
vue3连续点击按钮重复提交，vue3自定义指令防止重复提交
Vue3中的pinia的使用及组合写法与普通写法的区别
m0_62626838的博客
07-30 206
1、首先pinia可以自己后面按需安装，也可在项目创建时去勾选安装（这里我使用的是项目创建时自动安装的，吃了点亏，忘记这里是组合写法了）按照这个写法是不需要添加pinia核心（state、actions、getters），但需要return！store文件夹中的counter.ts （名字任起）在组件中直接使用即可，如下图。2、自定义安装pinia。3、在组件中使用，如下图。
【分享】前端程序员-技术网站推荐
一位前行者的博客
07-30 868
对于前端开发人员来说，以下是一些推荐的技术网站，这些网站提供了丰富的资源和知识，可以帮助你提升前端开发技能：收集一些 、、 的网站 vite 官方中文文档 element-plus 官方中文文档 pinia 官方中文文档 vue-router 官方中文文档 Tailwind CSS 官方文档 vitest 官方中文文档 es6 中文文档 axios 官方中文文档 vxetable 官方中文文档 lodash 中文文档 echarts 官方中文文档 animat
【Vue3】自定义组件
最新发布
又言又语
07-30 426
本文介绍 Vue3 中如何自定义组件。页面组件：用于构建独立页面，通常存放在src/pages或src/views目录下。功能组件：将页面中一些独立的功能封装成独立组件，譬如：分页组件、日期时间组件等。功能组件通常存放在目录下。本文主要说明如何自定义功能组件。
js对象的map（）方法
07-27
JavaScript中的对象（Object）没有内置的`map()`方法，但是可以使用`Object.entries()`和`Object.fromEntries()`方法来模拟实现类似于数组的`map()`操作。 首先，使用`Object.entries()`方法将对象转换为一个键值对...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值