首頁  >  文章  >  web前端  >  javascript中有hashmap麼

javascript中有hashmap麼

藏色散人
藏色散人原創
2021-11-18 11:13:433667瀏覽

javascript中有hashmap,實現hashmap的方法是「function HashMap(){this.map = {};}HashMap.prototype = {put : function...}」。

javascript中有hashmap麼

本文操作環境:windows7系統、javascript1.8.5版、DELL G3電腦

javascript中有hashmap麼?

JavaScript中HashMap的實作

什麼是HashMap?

基於哈希表的 Map 介面的實作。此實作提供所有可選的映射操作,並允許使用 null 值和 null 鍵。 (除了非同步且允許使用 null 之外,HashMap 類別與 Hashtable 大致相同。)此類不保證映射的順序,特別是它不保證該順序恆久不變。此實作假定雜湊函數將元素適當地分佈在各桶之間,可為基本操作(get 和 put)提供穩定的效能。迭代 collection 視圖所需的時間與 HashMap 實例的「容量」(桶的數量)及其大小(鍵-值映射關係數)成比例。
所以,如果迭代效能很重要,請勿將初始容量設定得太高(或將載入因子設定得太低)。

JavaScript中HashMap的實作
    var emojMap = ["[笑脸]", "[微笑]", "[喜欢]", "[飞吻]", "[尖叫]"
        , "[大哭]", "[哭笑不得]", "[墨镜]", "[饿了]", "[发呆]",
        "[沉思]", "[不屑]", "[鬼脸]", "[得意]", "[发怒]",
        "[眨眼]", "[汗]", "[舒服]", "[糟糕]", "[张嘴]",
        "[口罩]", "[没有嘴]", "[恶魔]", "[睡觉]", "[困乏]",
        "[难受]", "[调皮]", "[倔强]", "[困惑]", "[天使]",
        "[不看]", "[不听]", "[不说]", "[祈祷]", "[剪刀手]",
        "[拳头]", "[楼上]", "[好的]", "[赞]", "[鄙视]",
        "[鼓掌]", "[星星]", "[心]", "[心碎]", "[满分]",
        "[钱袋]", "[便便]", "[鬼魂]", "[眼睛]", "[鼻子]",
        "[耳朵]", "[嘴巴]", "[舌头]", "[猪]", "[狗]",
        "[猴子]", "[小马]", "[熊猫]", "[熊]", "[外星人]"
    ];

這個數組裝的我們開發過程中約定的Emoji識別資料,發送給Server端的資料

eg:我是HelloWord![微笑]格式

我們需要解析以"[XX]"這樣格式的資料來匹配相對應的圖片

HashMap的常用方法

鑑於HashMap的操作我們需要封裝常用操作方法

    function HashMap(){
        this.map = {};
    }
    HashMap.prototype = {
        put : function(key , value){// 向Map中增加元素(key, value) 
            this.map[key] = value;
        },
        get : function(key){ //获取指定Key的元素值Value,失败返回Null 
            if(this.map.hasOwnProperty(key)){
                return this.map[key];
            }
            return null;
        },
        remove : function(key){ // 删除指定Key的元素,成功返回True,失败返回False
            if(this.map.hasOwnProperty(key)){
                return delete this.map[key];
            }
            return false;
        },
        removeAll : function(){  //清空HashMap所有元素
            this.map = {};
        },
        keySet : function(){ //获取Map中所有KEY的数组(Array) 
            var _keys = [];
            for(var i in this.map){
                _keys.push(i);
            }
            return _keys;
        }
    };
    HashMap.prototype.constructor = HashMap;

以上就是我們封裝的HashMap操作方法。

利用HashMap開發Emoji表情庫

最開始我想過幾種方案,就像emojiMap陣列一樣,如果對方發訊息過來

eg:我是HelloWord![微笑]格式

    var r = /\[(.+?)\]/g;
    var str = "[笑脸][喜欢]emoji表情";
    var txt,url,tpl;
    for (var i in str.match(r)) {
        tpl = "<img src=&#39;" + i + ".png&#39; >";
        str = str.replace(str.match(r)[i],tpl);
    }
    console.log(str);

我最開始的想法是利用split分割成數組,然後用replace替換相對應的圖片,後來發現這種方案表情發多了會出現問題,無法替換.
而且需要指定數組下標的index位置
後來我改成以下方法:

    var hashMap = new HashMap();
    //先向hashMap中存入元素
    for(var i in emojMap){
        hashMap.put(emojMap[i] ,(parseInt(i))+'.png');
    }
    var r = /([^\[\]]+)(?=\])/g;
    var str = "[笑脸][喜欢]emoji表情";
    var txt,url,tpl;
    for (var i in str.match(r)) {
        //获取hashMap中对应的Value
        txt = hashMap.get(str.match(r)[i])
        tpl = "<img src=&#39;" + i + ".png&#39; >";
        str = str.split(m[i]).join(tpl);
    }
    str=str.replace(/\[|]/g,'');
    console.log(str);

使用HasMap的好處就是不用擔心key的位置了,因為每個key都對應一個val。

這樣就可以完美地替換成Emoji圖片展示了。

推薦學習:《javascript基礎教學

以上是javascript中有hashmap麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn