JavaScript实现Map数据结构及数组去重技巧
作者:函数茶馆时间:2026-10-28 22:06:08浏览:297
本文介绍如何在JavaScript中模拟Map数据结构,通过对象属性存储键值对并实现put、get、size等方法。同时利用JS对象Key不重复的特性,将数组转换为对象再还原为数组,从而高效去除数组中的重复项。
JavaScript模拟Map与去重概述
本文详细解析了如何在JavaScript中模拟Map结构的输出逻辑,并提供了去除数组重复项的具体实现方案,供开发者参考使用。
模拟Map数据结构输出
首先介绍JavaScript中Map结构的模拟输出方式。
function Map(){
// private
var obj = {} ;// 空的对象容器,承装键值对
// put 方法
this.put = function(key , value){
obj[key] = value ;// 把键值对绑定到obj对象上
}
// size 方法 获得map容器的个数
this.size = function(){
var count = 0 ;
for(var attr in obj){
count++;
}
return count ;
}
// get 方法 根据key 取得value
this.get = function(key){
if(obj[key] || obj[key] === 0 || obj[key] === false){
return obj[key];
} else {
return null;
}
}
//remove 删除方法
this.remove = function(key){
if(obj[key] || obj[key] === 0 || obj[key] === false){
delete obj[key];
}
}
// eachMap 变量map容器的方法
this.eachMap = function(fn){
for(var attr in obj){
fn(attr, obj[attr]);
}
}
}
//模拟java里的Map
var m = new Map();
m.put('01' , 'abc');
m.put('02' , false) ;
m.put('03' , true);
m.put('04' , new Date());
//alert(m.size());
//alert(m.get('02'));
//m.remove('03');
//alert(m.get('03'));
m.eachMap(function(key , value){
alert(key +" :"+ value);
});
利用对象特性去除重复项
接着探讨如何去除Map或数组中的重复数据项。
var arr = [2,1,2,10,2,3,5,5,1,10,13];//object
//js对象的特性:在js对象中key是永远不会重复的
/*
var obj = new Object();
obj.name = 'z3';
obj.age = 20 ;
//alert(obj.name);
obj.name = 'w5';
alert(obj.name);
*/
// 1 把数组转成一个js的对象
// 2 把数组中的值,变成js对象当中的key
// 3 把这个对象 再还原成数组
// 把数组转成对象
function toObject(arr){
var obj = {} ; // 私有的对象
var j ;
for(var i=0 , j= arr.length ; i<j; i++){
obj[arr[i]] = true ;
}
return obj ;
}
// 把这个对象转成数组
function keys(obj){
var arr = [] ; // 私有对象
for(var attr in obj){
if(obj.hasOwnProperty(attr)){//YUI底层代码
arr.push(attr);
}
}
return arr ;
}
//综合的方法 去掉数组中的重复项
function uniq(newarr){
return keys(toObject(newarr));
}
alert(uniq(arr));
希望上述内容对您的JavaScript编程实践有所帮助。
作者最新文章
JS大数值转字符串出现科学计数法怎么办
2026-11-05 17:09:21
JS split切割后出现空字符串怎么过滤
2026-11-05 16:00:30
在 React 或 Vue 项目中封装使用 JS 节流防抖
2026-11-05 15:27:29
JavaScript中怎么将带小数的字符串转为整数?
2026-11-05 14:32:38
怎么用JavaScript策略模式重构电商促销计算逻辑?
2026-11-05 14:01:09
