資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝學
法學Javascript Map 與 Object — 何時使用哪個？
JavaScript 的Map是一種資料結構，它幫助我們以鍵值對的形式儲存資料。每一對由一個唯一的鍵和對映到該鍵的值組成。它有助於防止重複。
JavaScript 的Object也遵循與 Map 相同的概念，即使用鍵值對儲存資料。但有一些細微的差別，使得 Map 在某些情況下效能更好。
讓我們在本文中進一步瞭解Map和 Object 之間的這些差異。
Map vs Object
以下是 Map 和 Object 之間的主要區別：
實體型別
在 Object 中，鍵欄位的資料型別限制為整數、字串和符號。而在 Map 中，鍵屬性可以是任何資料型別（整數、陣列和物件）。
元素的值
在 Map 中，元素的原始順序得以保留，而 Object 中則並非如此。
例項
示例
Map 是 Object 的例項，但 Object 不是 Map 的例項。在下面的示例中，我們正在檢查instanceof條件。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Instanceof</title>
</head>
<body>
<p>Map is the instanceof the object: true</p>
<p>Object is the instanceof Map: false</p>
<script>
var map = new Map([
[2, 3],
[8, 9],
]);
document.write(map instanceof Object, “<br>”); // true
var obj = new Object();
document.write(obj instanceof Map); //false
</script>
</body>
</html>
宣告
示例
在 JavaScript 中，建立 Object 有多種方法。在下面的示例中，我們嘗試透過向字面量傳遞值來直接建立 Object 和 Map。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Instanceof</title>
</head>
<body>
<script>
//Creating an object by passing literals
var obj = {1:"name of object", 2:"demo"}
document.write(JSON.stringify(obj), "<br>");
//Using constructor Object
var obj = new Object(12575);
document.write(JSON.stringify(obj), "<br>");
//Using the create method
function user(){
this.name = "tutorialspoint";
}
function aman(){
user.call(this);
}
aman.prototype = Object.create(user.prototype);
const use = new aman();
document.write(use.name);
</script>
</body>
</html>
示例
而 Map 只有一種建立方式。以下是一個例子：
<!DOCTYPE html>
<html lang="en">
<head> </head>
<body>
<script>
var map1 = new Map(); //empty Map
var map2 = new Map([
[1, "Aman"],
[2, "Akash"],
]);
map2.forEach (function(value, key) {
document.write(""+ key+":"+value,"<br>");
})
</script>
</body>
</html>
訪問元素
Map 使用其內建的 get() 方法訪問其元素。
Map.get(1);
Object 只需使用帶點運算子的鍵名稱即可訪問其元素。
Obj.id; Obj[id];
檢查鍵是否存在
Map 使用其內建函式has()來實現這一點。
map.has(1); // return true or false
Object 使用 '===' 運算子來執行。
var exist = obj.1 === undefined; //returns Boolean value.
新增新元素
Map 使用set()方法新增新元素。
Map.set(1,2);
Object 直接進行。
Obj["Demo"] = "object value";
獲取大小
Map 自動更新其大小，獲取方式最簡單。
console.log(map.size);
在 Object 中，需要藉助…手動計算大小。
Object.keys() Console.log(object.keys(obj).length);
因此，我們可以看到 Map 具有更好的效能和更簡潔的程式碼結構，這使其優於 Object。
更新於：2022-12-19
299 次瀏覽
廣告