Phương thức Map trong JavaScript
phương thức new Map()
Có thể truyền một mảng cho new Map()
ký hiệu tạo Map:
thực thể
// Tạo Map const fruits = new Map([ ["apples", 500], ["bananas", 300], ["oranges", 200] ]);
Map.get()
Bạn có thể sử dụng get()
Phương thức lấy giá trị của khóa trong Map:
thực thể
fruits.get("apples");
Map.set()
Bạn có thể sử dụng set()
Phương thức thêm phần tử vào Map:
thực thể
// Tạo Map const fruits = new Map(); // Đặt giá trị Map fruits.set("apples", 500); fruits.set("bananas", 300); fruits.set("oranges", 200);
set()
Phương thức cũng có thể được sử dụng để thay đổi giá trị hiện tại của Map:
thực thể
fruits.set("apples", 500);
Map.size
size
Thuộc tính trả về số lượng phần tử trong Map:
thực thể
fruits.size;
Map.delete()
delete()
Phương thức gỡ bỏ một phần tử trong Map:
thực thể
fruits.delete("apples");
Map.clear()
clear()
Phương thức gỡ bỏ tất cả các phần tử trong Map:
thực thể
fruits.clear();
Map.has()
Nếu có một khóa nào đó trong Map:has()
Phương thức trả về true:
thực thể
fruits.has("apples");
Thử mã sau:
fruits.delete("apples"); fruits.has("apples");
Map.forEach()
forEach()
Phương thức gọi hàm hồi quy cho mỗi cặp khóa-giá trị trong Map:
thực thể
// Liệt kê tất cả các mục let text = ""; fruits.forEach(function(value, key) { text += key + ' = ' + value; });
Map.entries()
entries()
Phương thức trả về một đối tượng chứa các phần tử [key, value] Đối tượng iterator đúng:
thực thể
// Liệt kê tất cả các mục let text = ""; for (const x of fruits.entries()) { text += x; }
Map.keys()
keys()
Phương thức trả về một đối tượng iterator chứa các khóa của Map:
thực thể
// Liệt kê tất cả các khóa let text = ""; for (const x of fruits.keys()) { text += x; }
Map.values()}
values()
phương thức trả về một đối tượng iterator chứa các giá trị trong Map:
thực thể
// Liệt kê tất cả giá trị let text = ""; for (const x of fruits.values()) { text += x; }
Bạn có thể sử dụng values()
phương thức tính tổng các giá trị trong Map:
thực thể
// Tính tổng tất cả giá trị let total = 0; for (const x of fruits.values()) { total += x; }
Đối tượng làm chìa khóa
Hướng dẫn:Sử dụng đối tượng làm chìa khóa là một tính năng quan trọng của Map.
thực thể
// Tạo đối tượng const apples = {name: 'Apples'}; const bananas = {name: 'Bananas'}; const oranges = {name: 'Oranges'}; // Tạo Map const fruits = new Map(); // Thêm phần tử mới vào Map fruits.set(apples, 500); fruits.set(bananas, 300); fruits.set(oranges, 200);
Lưu ý:Chìa khóa là đối tượng (apples),而不是 chuỗi ("apples"):
thực thể
fruits.get("apples"); // Trả về undefined
JavaScript Map.groupBy()
ES2024 đã thêm vào JavaScript Map.groupBy()
phương thức.
Map.groupBy()
phương thức nhóm các phần tử của đối tượng dựa trên giá trị chuỗi trả về bởi hàm đệm.
Map.groupBy()
phương thức sẽ không thay đổi đối tượng gốc.
thực thể
// Tạo một mảng const fruits = [ {name: "apples", quantity: 300}, {name: "bananas", quantity: 500}, {name: "oranges", quantity: 200}, {name: "kiwi", quantity: 150} ]; // Là hàm đệm để nhóm function myCallback({ quantity }) { return quantity > 200 ? "ok" : "low"; } // ĐgroupBy theo số lượng const result = Map.groupBy(fruits, myCallback);
Hỗ trợ trình duyệt
Map.groupBy()
Là tính năng của ES2024.
Từ tháng 3 năm 2024, tất cả các trình duyệt mới đều hỗ trợ tính năng này:
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome 117 | Edge 117 | Firefox 119 | Safari 17.4 | Opera 103 |
Tháng 9 năm 2023 | Tháng 9 năm 2023 | Tháng 10 năm 2023 | Tháng 10 năm 2024 | Tháng 5 năm 2023 |
Cảnh báo:
Tính năng ES2024 tương đối mới.
Trình duyệt phiên bản cũ có thể cần mã thay thế (Polyfill).
Sự khác biệt giữa Object.groupBy() và Map.groupBy()
Object.groupBy()
và Map.groupBy()
Sự khác biệt giữa:
Object.groupBy()
Nhóm các phần tử vào đối tượng JavaScript.
Map.groupBy()
Nhóm các phần tử vào đối tượng Map.
Tài liệu tham khảo đầy đủ Map
Để có tài liệu tham khảo đầy đủ, vui lòng truy cập:Tài liệu tham khảo JavaScript Map.
Tài liệu này bao gồm mô tả và ví dụ về tất cả các thuộc tính và phương thức của Map.