• 技术文章 >web前端 >前端问答

    javascript中有hashmap么

    藏色散人藏色散人2021-11-18 11:13:43原创69

    javascript中有hashmap,其实现hashmap的方法是“function HashMap(){this.map = {};}HashMap.prototype = {put : function...}”。

    本文操作环境: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='" + i + ".png' >";
            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='" + i + ".png' >";
            str = str.split(m[i]).join(tpl);
        }
        str=str.replace(/\[|]/g,'');
        console.log(str);

    使用HasMap的好处就是不用担心key的位置了,因为每个key都对应一个val。

    这样就可以完美替换成Emoji图片展示了。

    推荐学习:《javascript基础教程

    以上就是javascript中有hashmap么的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:javascript hashmap
    上一篇:jquery1.9.1 toggle方法怎么用 下一篇:html中id和class有什么区别
    php中文网线上培训班

    相关文章推荐

    • javascript怎么设置元素点击事件• javascript怎么设置元素的宽高• 如何用javascript画圆• java与javascript什么关系• javascript怎么实现红绿灯

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网