JavaScript中的new map()和new set()使用詳細（new map()和new set()的區別）

喆星高照發表於2024-07-24
JavaScript

簡介：
new Map(): 在JavaScript中，new Map()用於建立一個新的 Map 物件。Map 物件是一種鍵值對的集合，其中的鍵是唯一的，值可以重複。
new Set(): 在JavaScript中， new Set() 是用來建立一個新的 Set 物件的語法。Set 物件是一種集合，其中的值是唯一的，沒有重複的值。 new Set() 可以用來建立一個空的 Set 物件，在建立時傳入一個陣列或類陣列物件，Set 會自動去除重複的值。
new Map()
一、new Map() 基本特性
new Map() 是用來建立一個新的 Map 物件的建構函式。Map 物件儲存鍵值對，並記住鍵的原始插入順序。這意味著你可以迭代 Map 物件，按鍵的插入順序獲取鍵值對。

Map 物件與普通的物件（使用字串作為鍵）不同，因為 Map 可以使用任何型別作為鍵（包括函式、物件或任何原始值），而不僅僅是字串或符號。

二、相關方法
1. set(key, value) : 向 Map 物件中新增一個鍵值對。
2. get(key) : 獲取指定鍵對應的值。
3. has(key) : 判斷 Map 物件中是否存在指定的鍵。
4. delete(key) : 刪除指定鍵及其對應的值。
5. size : 返回 Map 物件中鍵值對的數量。
6. clear() : 清空 Map 物件中的所有鍵值對。
7. keys() : 返回一個包含 Map 物件中所有鍵的迭代器。
8. values() : 返回一個包含 Map 物件中所有值的迭代器。
9. entries() : 返回一個包含 Map 物件中所有鍵值對的迭代器。
三、基本使用

// 建立一個新的Map物件  
let myMap = new Map();  
  
// 1、新增鍵值對  
myMap.set('name', 'Alice');  
myMap.set('age', 25);  
  
// 2、獲取值  
console.log(myMap.get('name')); // 輸出: "Alice"  
  
// 3、檢查鍵是否存在  
console.log(myMap.has('age')); // 輸出: true  
  
// 4、刪除鍵值對  
myMap.delete('name');  
console.log(myMap.has('name')); // 輸出: false  
 
// 5、獲取Map的大小  
console.log(myMap.size); // 輸出: 1  
  
// 6、清空Map  
myMap.clear();  
console.log(myMap.size); // 輸出: 0  
  
// 7、遍歷鍵  
for (let key of myMap.keys()) {  
  console.log(key); // 輸出: "age"  
}  
  
// 8、遍歷值  
for (let value of myMap.values()) {  
  console.log(value); // 輸出: 25  
}  
  
// 9、遍歷鍵值對  
for (let [key, value] of myMap.entries()) {  
  console.log(`Key: ${key}, Value: ${value}`); // 輸出: Key: age, Value: 25  
}


new Set()
一、new Set() 基本特性
唯一性：在 Set 中，每個值只出現一次，可以實現簡單的陣列去重，即使是兩個完全相同的物件，它們在 Set 中也只會被儲存一次。
無序性：Set 中的元素沒有特定的順序。
二、相關方法
add(value): 向 Set 物件中新增一個值。如果值已存在，則不會進行任何操作。
delete(value): 從 Set 物件中刪除一個值。如果值存在，則刪除並返回 true；否則，返回 false。
has(value): 返回一個布林值，表示 Set 物件中是否包含指定的值。
clear(): 清空 Set 物件，移除所有元素。
三、基本使用

let setData = new Set();  
  
// 新增元素  
setData .add(1);  
setData .add(2);  
setData .add(3); 
console.log(setData); // setData { 1, 2 ,3 }  
 
// 刪除元素  
setData.delete(2);  
console.log(setData); // Set { 1, 3 }  
 
  
// 檢查元素是否存在  
console.log(setData.has(1)); // true  
console.log(setData.has(4)); // false  
  
// 遍歷元素  
setData.forEach(value => console.log(value));  
// 輸出:  
// 1  
// 3
 
// 清空集合  
setData.clear();  
console.log(setData.size);    // 輸出: 0，因為集合已被清空
 
 
//在建立 Set 時直接傳入一個可迭代物件（如陣列），來初始化 Set：
let set = new Set([1, 2, 2, 3, 4, 4]);  
//簡單陣列去重
console.log(set); // Set { 1, 2, 3, 4 }



相關文章