如何使用 JavaScript/JQuery 创建一个简单的地图 [重复]

关键词：

【中文标题】如何使用 JavaScript/JQuery 创建一个简单的地图 [重复]【英文标题】：How to create a simple map using JavaScript/JQuery [duplicate] 【发布时间】：2011-05-13 22:00:06 【问题描述】：

如何创建此 Java 代码的 JavaScript/JQuery 等效项：

Map map = new HashMap(); //Doesn't not have to be a hash map, any key/value map is fine
map.put(myKey1, myObj1);
map.put(myKey2, myObj2); //Repeat n times

function Object get(k) 
    return map.get(k);

【问题讨论】：

【参考方案1】：

编辑：过时的答案，ECMAScript 2015 (ES6) 标准 javascript 有一个 Map 实现，阅读这里了解更多信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

var map = new Object(); // or var map = ;
map[myKey1] = myObj1;
map[myKey2] = myObj2;

function get(k) 
    return map[k];


//map[myKey1] == get(myKey1);

【讨论】：

更新了我的答案以使用new Object() 而不是new Array()。见this article 这里如何提供根节点？ 我们如何从地图中删除键值付款人？ @Shikha 最有效的方法就是放入 (key, null) 然后检查您的值是否为空。否则，检查如何删除数组中的项目（使用 javascript 函数拼接） 这个答案现在已经过时了，因为 Map 现在确实存在（耶！），请阅读以下内容：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…【参考方案2】：

只使用普通对象：

var map =  key1: "value1", key2: "value2" 
function get(k)
  return map[k];

【讨论】：

键不应指定为字符串，即不带引号【参考方案3】：

var map = 'myKey1':myObj1, 'mykey2':myObj2;
// You don't need any get function, just use
map['mykey1']

【讨论】：

不管什么原因，我们也可以这样做：var myKey = "myKey1" 然后var map = [myKey] : myObj1【参考方案4】：

如果你不局限于 JQuery，你可以使用prototype.js 框架。它有一个名为 Hash 的类：你甚至可以同时使用 JQuery 和 prototype.js。只需输入 jQuery.noConflict();

var h = new Hash();
h.set("key", "value");
h.get("key");
h.keys(); // returns an array of keys
h.values(); // returns an array of values

【讨论】：

【参考方案5】：

function Map() 
    this.keys = new Array();
    this.data = new Object();

    this.put = function (key, value) 
        if (this.data[key] == null) 
            this.keys.push(key);
        
        this.data[key] = value;
    ;

    this.get = function (key) 
        return this.data[key];
    ;

    this.remove = function (key) 
        this.keys.remove(key);
        this.data[key] = null;
    ;

    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);
        
    ;

    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;
    ;

    this.isEmpty = function () 
        return this.keys.length == 0;
    ;

    this.size = function () 
        return this.keys.length;
    ;

【讨论】：

至少，把所有这些方法都放在原型上。 @Adshi: Use of 'prototype' vs. 'this' in Javascript? this.data[key] = null 不会删除该属性；它只是将其值设置为null。你应该改用delete this.data[key]。 在入口函数，你应该这样改变。条目[i] = 键：this.keys[i]，值：this.data[i] ; -> 条目[i] = 键：this.keys[i]，值：this.data[this.keys[i]] ; - @YoYoYonnY：我不知道柯里化与此有什么关系，但原型方法也不会泄漏变量或具有可变范围。他们确实有一个后期绑定的this 上下文，但这是一个功能而不是问题。【参考方案6】：

这是一个老问题，但由于现有的答案可能非常危险，我想把这个答案留给未来可能会在这里绊倒的人......

基于使用 Object 作为 HashMap 的答案已被破坏，如果您使用 String 以外的任何内容作为键，可能会导致极其恶劣的后果。问题是使用 .toString 方法将 Object 属性强制转换为字符串。这可能会导致以下问题：

function MyObject(name) 
  this.name = name;
;
var key1 = new MyObject("one");
var key2 = new MyObject("two");

var map = ;
map[key1] = 1;
map[key2] = 2;

如果您期望 Object 的行为方式与此处的 Java Map 相同，那么您会很生气地发现该 map 仅包含 one 条目和 String 键 [object Object]:

> JSON.stringify(map);
"[object Object]": 2

这显然 不是 Java 的 HashMap 的替代品。奇怪的是，考虑到它的时代，Javascript 目前还没有通用的地图对象。不过，希望就在眼前：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map 尽管浏览浏览器兼容性表会发现它还没有准备好用于通用 Web 应用程序。

与此同时，您能做的最好的事情是：

故意使用字符串作为键。 IE。使用显式字符串作为键，而不是依赖于您使用的键的隐式 .toString-ing。 确保您用作键的对象具有明确定义的 .toString() 方法，该方法适合您对这些对象唯一性的理解。 如果您不能/不想更改关键对象的 .toString，则在存储和检索条目时，将对象转换为代表您对唯一性理解的字符串。例如。 map[toUniqueString(key1)] = 1

但有时，这是不可能的。如果您想基于例如 File 对象映射数据，则没有可靠的方法来执行此操作，因为 File 对象公开的属性不足以确保其唯一性。 （你可能有两个 File 对象代表磁盘上的不同文件，但是在浏览器的 JS 中没有办法区分它们）。不幸的是，在这些情况下，您所能做的就是重构您的代码，以消除将这些存储在可能的情况下的需要；也许，通过使用数组来代替它们并通过索引专门引用它们。

【讨论】：

如何使用 javascript/jquery 在时间字符串中添加一秒

】如何使用javascript/jquery在时间字符串中添加一秒【英文标题】：Howtoaddonesecondtoatimestringwithjavascript/jquery【发布时间】：2012-10-0918:21:12【问题描述】：我正在尝试使用Javascript创建一个计时器，但我不知道如何在时间字符串中添加... 查看详情

使用 javascript/jquery 动态创建 div

】使用javascript/jquery动态创建div【英文标题】：dynamicallycreatingdivusingjavascript/jquery【发布时间】：2013-09-2908:05:57【问题描述】：我在html中有两个名为“answerdiv1”和“answerdiv2”的div。现在我想给/创建唯一的divid，比如“answerdiv3”... 查看详情

如何使用javascript验证动态生成的输入框值

】如何使用javascript验证动态生成的输入框值【英文标题】：Howtovalidatedynamicgeneratedinputboxvalueusingjavascript【发布时间】：2016-09-1520:11:10【问题描述】：我正在动态创建多个文本框，我想在表单提交时进行文本框验证（文本框不应... 查看详情

如何使用 jquery/javascript 将文本插入 json [重复]

】如何使用jquery/javascript将文本插入json[重复]【英文标题】：howtoinserttextintojsonusingjquery/javascript[duplicate]【发布时间】：2013-05-3002:03:43【问题描述】：如何使用jquery/javascript将文本插入json数组。假设我有数据文本文件格式123、456... 查看详情

如何使用 JavaScript/jQuery 滚动到页面顶部？

】如何使用JavaScript/jQuery滚动到页面顶部？【英文标题】：HowtoscrolltotopofpagewithJavaScript/jQuery?【发布时间】：2011-05-1118:44:38【问题描述】：有没有办法用JavaScript/jQuery控制浏览器滚动？当我将页面向下滚动一半，然后触发重新加载... 查看详情

如何使用 Javascript/jQuery 确定图像是不是已加载？

】如何使用Javascript/jQuery确定图像是不是已加载？【英文标题】：HowcanIdetermineifanimagehasloaded,usingJavascript/jQuery?如何使用Javascript/jQuery确定图像是否已加载？【发布时间】：2010-09-2018:32:19【问题描述】：我正在编写一些Javascript来调... 查看详情

如何使用 Javascript/jQuery 确定图像是不是已加载？

】如何使用Javascript/jQuery确定图像是不是已加载？【英文标题】：HowcanIdetermineifanimagehasloaded,usingJavascript/jQuery?如何使用Javascript/jQuery确定图像是否已加载？【发布时间】：2010-09-2018:32:19【问题描述】：我正在编写一些Javascript来调... 查看详情

使用 Javascript、jQuery 和/或 php 创建带有基于坐标的标记的地图

】使用Javascript、jQuery和/或php创建带有基于坐标的标记的地图【英文标题】：Createamapwithcoordinates-basedmarkerusingJavascript,jQueryand/orphp【发布时间】：2013-09-0313:53:06【问题描述】：我正在开发一个客户端-服务器应用程序，我需要创建... 查看详情

Rails如何检测是不是使用javascript / jQuery插入了部分

】Rails如何检测是不是使用javascript/jQuery插入了部分【英文标题】：Railshowtodetectifapartialwasinsertedusingjavascript/jQueryRails如何检测是否使用javascript/jQuery插入了部分【发布时间】：2012-10-0722:04:49【问题描述】：如何在javascript中检测当... 查看详情

如何使用javascript（或jquery）将youtube视频添加到iframe（基于web的rte）

我想创建一个带有javascript（jQuery）和HTML的富文本编辑器，其工作方式类似于“Blogger”。我希望编辑的用户能够添加格式化文本（粗体，不同大小的字体等），添加图像和从YouTube添加视频。我的搜索结果显示所有基于Web的RTE都... 查看详情

如何使用 PHP 或 JavaScript/jQuery 禁用地址栏？

】如何使用PHP或JavaScript/jQuery禁用地址栏？【英文标题】：HowtodisableaddressbarusingPHPorJavaScript/jQuery?【发布时间】：2014-06-2906:59:38【问题描述】：如何禁用PHP或JavaScript/jQuery中的地址栏/url文本框？这可能吗？【问题讨论】：一般不... 查看详情

如何使用 Javascript/jQuery 使用新对象制作其他表单？

】如何使用Javascript/jQuery使用新对象制作其他表单？【英文标题】：HowtomakeadditionalformswithwithnewobjectsusingJavascript/jQuery?【发布时间】：2019-05-0200:11:48【问题描述】：在初始页面加载时，将收集当前用户的所有亮点并将每个亮点放... 查看详情

如何使用 javascript / jQuery 获取数据 ajax api 数组？

】如何使用javascript/jQuery获取数据ajaxapi数组？【英文标题】：howgetdataajaxapiarrayusingjavascript/jQuery?【发布时间】：2021-10-1421:36:03【问题描述】：如何使用javascript从列表api获取数据？我有列表使用json数据的api..但是当我从列表一中... 查看详情

如何使用 javascript/jquery 设置用户输入的样式

】如何使用javascript/jquery设置用户输入的样式【英文标题】：Howtolive-styleanuserinputusingjavascript/jquery【发布时间】：2012-02-1617:49:30【问题描述】：我正在寻找在javascript/jquery中制作实时样式器的库或建议。这个想法是我的用户有一... 查看详情

如何找出使用 javascript/jquery 调用函数的次数？

】如何找出使用javascript/jquery调用函数的次数？【英文标题】：HowdoIfindouthowmanytimesafunctioniscalledwithjavascript/jquery?【发布时间】：2022-01-2210:57:54【问题描述】：也许是一个奇怪的问题，但它是这样的：我有一个定期调用的函数，在... 查看详情

如何使用 javascript/jquery 编写 onshow 事件？

】如何使用javascript/jquery编写onshow事件？【英文标题】：Howtowriteonshoweventusingjavascript/jquery?【发布时间】：2010-11-2818:16:14【问题描述】：我的页面上有一个锚标记，我想要一个附加到它的事件，该事件将在此元素的显示发生变化... 查看详情

如何使用 Javascript (jQuery) 判断图像是不是具有特定的宽度/高度？ [复制]

】如何使用Javascript(jQuery)判断图像是不是具有特定的宽度/高度？[复制]【英文标题】：Howtotellifanimagehasbeengivenaspecificwidth/heightwithJavascript(jQuery)?[duplicate]如何使用Javascript(jQuery)判断图像是否具有特定的宽度/高度？[复制]【发布时... 查看详情

如何使用 Javascript/JQuery 在移动浏览器中限制点运算符（'.'）

】如何使用Javascript/JQuery在移动浏览器中限制点运算符（\\\'.\\\'）【英文标题】：Howtorestrictdotoperator(\'.\')inmobilebrowserusingJavascript/JQuery如何使用Javascript/JQuery在移动浏览器中限制点运算符（\'.\'）【发布时间】：2017-02-2212:14:18【问... 查看详情