如何在 JavaScript 中使用关联数组/哈希表？

我们使用Object和Map类来模拟 JavaScript 中关联数组/哈希表的行为。JavaScript 本身没有内置的关联数组。我们能获得的最接近类似行为的是 JavaScript 中的 Map 类。

让我们逐一看看它们。

JavaScript 中的 Object 类

Object 类允许我们创建具有名称-值对的对象。这类似于哈希表，因为对象知道哪个属性与哪个值相关联。

语法

const obj = {
   name : "Abhishek",
   age : 22
}
var name = obj.name

这将创建一个名为obj的对象，其中包含两个键值对：name 和 age。可以使用点运算符 (.) 访问这些属性，如下一行所示。点运算符前面是对象名称，后面是属性名称。

然而，与其他编程语言提供的传统关联数组相比，Object 类有许多限制。JavaScript不会跟踪对象的大小，因此必须由程序员维护。对于少量属性来说，这很好，但是随着复杂性的增加，跟踪事物变得很困难。

以下是一个示例，展示了对象用作关联数组。

示例 1

在这里，我们将创建一个对象，然后使用键来检索这些属性。让我们看看相应的代码。

<!DOCTYPE html> 
<html> 
<title>Online Javascript Editor</title> 
<head>
</head> 
<body> 
   <h3>associative array/hashing in JavaScript <br></h3> 
   <p> 
      <div id="result"> </div> 
   </p> 
   <script>
      const obj = { name: "Abhishek", age: 22 } 
      var text = ""; 
      
      text += "name : " + obj.name + "<br>";
      text += "age : " + obj.age; 
      
      document.getElementById("result").innerHTML = text; 
   </script> 
</body> 
</html>

在上面的代码中，对象的属性访问方式类似于关联数组。

我们创建的对象继承了 Object 类的属性。但是，Object 类没有限制程序员尝试重新定义或修改这些属性。这与传统关联数组的工作方式形成对比，在传统关联数组中，键对于整个数据结构是唯一的。

例如，我们有toString()函数内置于所有对象原型中。即，如果我们尝试

objectName.toString()

这将返回“[object Object]”作为输出。但是，我们可以在对象定义中覆盖它，使此函数返回其他内容。

以下是如何操作的示例。

示例 2

在这里，我们将创建一个对象并覆盖toString()方法，使其返回与内置响应不同的字符串。

让我们看看相应的代码。

<!DOCTYPE html>
<html>
<body>
   <h3>associative array/hashing in JavaScript <br></h3>
   <p>
      <div id="result"> </div>
   </p>
   <script>
      const obj = {
         name: "Abhishek",
         age: 22,
         toString: function() {
            return "Hello !";
         }
      }
      var text = "";
      text += "name : " + obj.name + "<br>";
      text += "age : " + obj.age + "<br>";
      text += "toString : " + obj.toString() + "<br>";
      document.getElementById("result").innerHTML = text;
   </script>
</body>
</html>

在上面的代码中，toString()函数返回“Hello !”作为输出，而不是“[object Object]”，后者应该是常规响应。

现在让我们看看 JavaScript 中的 Map 类，以模拟关联数组的行为。

JavaScript 中的 Map 类

与 Object 类类似，Map 类允许我们创建键值对。我们使用 Map 类的 set() 和 get() 方法来操作属性。

语法

var mp = new Map();
mp.set("name", "Abhishek")
mp.get("name")

这将创建一个 Map 对象，并在其上设置一个名为“name”的属性，将其值设置为“Abhishek”。可以使用键和get()函数检索相同的属性。

与 Object 类不同，Map 有一个 size 计数器，可用于检索属性。它也不允许覆盖 Map 类继承的属性和方法。

让我们看一个示例来了解此用例。

示例 3

我们将创建一个 map 对象并执行设置和获取 map 中值的的基本操作。

<!DOCTYPE html>
<html>
<body>
   <h3>associative array/hashing in JavaScript <br></h3>
   <p>
      <div id="result"> </div>
   </p>
   <script>
      var coll = new Map();
      coll.set("name", "Abhishek");
      coll.set("age", 22);
      var text = "";
      text += "Number of Key-value pairs: " + coll.size + "<br>";
      text += "name : " + coll.get("name") + "<br>";
      text += "age : " + coll.get("age") + "<br>";
      document.getElementById("result").innerHTML = text;
   </script>
</body>
</html>

在上面的代码中，创建了一个新的 map，并在其中添加了两个键值对，然后使用get(key_name)函数检索它们。

结论

Map 是 JavaScript 中关联数组的一个不错的替代方案。它们提供了几乎所有传统关联数组的功能。

更新于： 2022年11月10日

515 次浏览

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告

© . All rights reserved.