一個簡單的JavaScript Map實例(分享)
更新時間：2016年08月03日 09:32:52 投稿：jingxian
下面小編就為大家?guī)硪黄粋€簡單的JavaScript Map實例(分享)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
用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() {
/** 存放鍵的數(shù)組(遍歷用到) */
this.keys = new Array();
/** 存放數(shù)據(jù) */
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,執(zhí)行處理函數(shù)
*
* @param {Function} 回調函數(shù) 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);
}
};
/**
* 獲取鍵值數(shù)組(類似Java的entrySet())
* @return 鍵值對象{key,value}的數(shù)組
*/
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;
};
/**
* 獲取鍵值對數(shù)量
*/
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','南方電網(wǎng)');
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實例(分享)就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
在網(wǎng)上去搜判斷鼠標移入div移入移出的方法大同小異，下面小編給大家分享一篇文章關于js判斷鼠標進入div方向的代碼，感興趣的朋友一起看看吧2016-11-11
JS組件庫AlloyTouch實現(xiàn)圖片輪播過程解析
這篇文章主要介紹了JS組件庫AlloyTouch實現(xiàn)圖片輪播組件過程解析,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-05-05
antd-mobile ListView長列表的數(shù)據(jù)更新遇到的坑
這篇文章主要介紹了antd-mobile ListView長列表的數(shù)據(jù)更新遇到的坑，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-04-04
本文給大家分享一段簡單的代碼基于js實現(xiàn)限時搶購倒計時間表功能，非常不錯，代碼簡單易懂，需要的的朋友參考下吧2017-05-05
在開發(fā)過程中,可能會遇到需要將一維數(shù)組轉換為多維數(shù)組的情況,以滿足特定數(shù)據(jù)結構的需求,文章介紹了如何將后端返回的一維列表數(shù)據(jù)通過編程方法轉換成三維數(shù)組結構,以適應特定的UI展示需求,通過循環(huán)遍歷和數(shù)據(jù)重組的方式,可以有效地實現(xiàn)數(shù)組結構的轉換2024-09-09
這篇文章主要介紹了CORS與預檢請求，CORS是一套規(guī)范，指導瀏覽器和服務器之間如何進行跨域資源共享，當發(fā)送跨域請求時，瀏覽器會先發(fā)送一個OPTIONS方法的預檢請求。文中介紹的非常詳細，需要的同學可以參考一下2023-04-04
這篇文章主要介紹了利用原生JS實現(xiàn)歡樂水果機小游戲,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-04-04
這篇文章我們給大家總結了關于js中Array的方法及技巧，有需要的朋友們可以學習參考下。2018-09-09
用javascript getComputedStyle獲取和設置style的原理
這兩天用了baidu 百度空間中的彈出窗口js，感覺不錯，很強大，很好很簡單的解決了好幾個問題，界面友好度以及美化也好多了，以前都是硬邦邦window.open();2008-10-10
JavaScript中實現(xiàn)在光標位置插入內容的幾種方法
本文主要介紹了在網(wǎng)頁開發(fā)中,如何使用JavaScript在文本輸入框或富文本編輯器的光標位置插入內容的實踐,包括獲取光標位置的方法,創(chuàng)建文本節(jié)點,操作Selection對象,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-10-10