ES6 - Bộ sưu tập
ES6 giới thiệu hai cấu trúc dữ liệu mới: Bản đồ và Bộ.
Maps - Cấu trúc dữ liệu này cho phép ánh xạ một khóa đến một giá trị.
Sets- Tập hợp tương tự như mảng. Tuy nhiên, bộ không khuyến khích trùng lặp.
Bản đồ
Đối tượng Bản đồ là một cặp khóa / giá trị đơn giản. Các khóa và giá trị trong bản đồ có thể là nguyên thủy hoặc đối tượng.
Sau đây là cú pháp cho tương tự.
new Map([iterable])Tham số có thể lặp lại đại diện cho bất kỳ đối tượng có thể lặp lại nào có các phần tử bao gồm một cặp khóa / giá trị. Các bản đồ được sắp xếp theo thứ tự, tức là chúng đi ngang qua các phần tử theo thứ tự chèn của chúng.
Thuộc tính bản đồ
| Sr.No | Kê khai tài sản |
|---|---|
| 1 |
Map.prototype.size
Thuộc tính này trả về số lượng cặp khóa / giá trị trong đối tượng Bản đồ. |
Hiểu các thao tác bản đồ cơ bản
Hàm set () đặt giá trị cho khóa trong đối tượng Bản đồ. Hàm set () nhận hai tham số là khóa và giá trị của nó. Hàm này trả về đối tượng Bản đồ.
Hàm has () trả về một giá trị boolean cho biết liệu khóa được chỉ định có được tìm thấy trong đối tượng Bản đồ hay không. Hàm này nhận một khóa làm tham số.
var map = new Map();
map.set('name','Tutorial Point');
map.get('name'); // Tutorial pointVí dụ trên tạo một đối tượng bản đồ. Bản đồ chỉ có một phần tử. Khóa phần tử được ký hiệu làname. Khóa được ánh xạ tới một giá trịTutorial point.
Note- Bản đồ phân biệt giữa các giá trị tương tự nhưng mang các kiểu dữ liệu khác nhau. Nói cách khác, mộtinteger key 1 được coi là khác với một string key “1”. Hãy xem xét ví dụ sau để hiểu rõ hơn về khái niệm này
var map = new Map();
map.set(1,true);
console.log(map.has("1")); //false
map.set("1",true);
console.log(map.has("1")); //trueĐầu ra
false
trueCác set()phương pháp cũng có thể thay thế. Hãy xem xét ví dụ sau.
var roles = new Map();
roles.set('r1', 'User')
.set('r2', 'Guest')
.set('r3', 'Admin');
console.log(roles.has('r1'))Đầu ra
TrueVí dụ trên, xác định một đối tượng bản đồ. Ví dụ chuỗi hàm set () để xác định cặp khóa / giá trị.
Các get() hàm được sử dụng để truy xuất giá trị tương ứng với khóa được chỉ định.
Phương thức tạo bản đồ cũng có thể được truyền vào một mảng. Hơn nữa, bản đồ cũng hỗ trợ việc sử dụng toán tử spread để biểu diễn một mảng.
Thí dụ
var roles = new Map([
['r1', 'User'],
['r2', 'Guest'],
['r3', 'Admin'],
]);
console.log(roles.get('r2'))Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
GuestNote - Hàm get () trả về không xác định nếu khóa được chỉ định không tồn tại trong bản đồ.
Tập hợp () thay thế giá trị cho khóa, nếu nó đã tồn tại trong bản đồ. Hãy xem xét ví dụ sau.
var roles = new Map([
['r1', 'User'],
['r2', 'Guest'],
['r3', 'Admin'],
]);
console.log(`value of key r1 before set(): ${roles.get('r1')}`)
roles.set('r1','superUser')
console.log(`value of key r1 after set(): ${roles.get('r1')}`)Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
value of key r1 before set(): User
value of key r1 after set(): superUserPhương pháp bản đồ
| Sr.No | Phương pháp & Mô tả |
|---|---|
| 1 |
Map.prototype.clear ()
Xóa tất cả các cặp khóa / giá trị khỏi đối tượng Bản đồ. |
| 2 |
Map.prototype.delete (khóa)
Loại bỏ bất kỳ giá trị nào được liên kết với khóa và trả về giá trị mà Map.prototype.has (khóa) đã trả về trước đó. Map.prototype.has (key) sẽ trả về false sau đó. |
| 3 |
Map.prototype.entries ()
Trả về một đối tượng Iterator mới có chứa an array of [khóa, giá trị] cho mỗi phần tử trong đối tượng Bản đồ theo thứ tự chèn. |
| 4 |
Map.prototype.forEach (callbackFn [, thisArg])
Cuộc gọi callbackFnmột lần cho mỗi cặp khóa-giá trị có trong đối tượng Bản đồ, theo thứ tự chèn. Nếu một tham số thisArg được cung cấp cho forEach, thì nó sẽ được sử dụng làm giá trị 'this' cho mỗi lần gọi lại. |
| 5 |
Map.prototype.keys ()
Trả về một đối tượng Iterator mới có chứa keys cho mỗi phần tử trong đối tượng Bản đồ theo thứ tự chèn. |
| 6 |
Map.prototype.values ()
Trả về một đối tượng Iterator mới có chứa an array of [khóa, giá trị] cho mỗi phần tử trong đối tượng Bản đồ theo thứ tự chèn. |
Vòng lặp for… of
Ví dụ sau minh họa việc duyệt bản đồ bằng vòng lặp for… of.
'use strict'
var roles = new Map([
['r1', 'User'],
['r2', 'Guest'],
['r3', 'Admin'],
]);
for(let r of roles.entries())
console.log(`${r[0]}: ${r[1]}`);Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
r1: User
r2: Guest
r3: AdminBản đồ yếu
Một bản đồ yếu giống với một bản đồ với các ngoại lệ sau:
Các khóa của nó phải là các đối tượng.
Chìa khóa trong một bản đồ yếu có thể được thu thập Rác. Garbage collection là một quá trình xóa bộ nhớ bị chiếm bởi các đối tượng không tham chiếu trong một chương trình.
Một bản đồ yếu không thể được lặp lại hoặc xóa.
Ví dụ: Bản đồ yếu
'use strict'
let weakMap = new WeakMap();
let obj = {};
console.log(weakMap.set(obj,"hello"));
console.log(weakMap.has(obj));// trueKết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
WeakMap {}
trueBộ
Một tập hợp là một cấu trúc dữ liệu ES6. Nó tương tự như một mảng với một ngoại lệ là nó không thể chứa các bản sao. Nói cách khác, nó cho phép bạn lưu trữ các giá trị duy nhất. Bộ hỗ trợ cả giá trị nguyên thủy và tham chiếu đối tượng.
Cũng giống như bản đồ, các tập hợp cũng có thứ tự, tức là các phần tử được lặp lại theo thứ tự chèn của chúng. Một tập hợp có thể được khởi tạo bằng cú pháp sau.
Đặt thuộc tính
| Sr.No | Kê khai tài sản |
|---|---|
| 1 |
Set.prototype.size
Trả về số lượng giá trị trong đối tượng Đặt. |
Đặt phương pháp
| Sr.No | Phương pháp & Mô tả |
|---|---|
| 1 |
Set.prototype.add (giá trị)
Thêm một phần tử mới với giá trị đã cho vào đối tượng Set. Trả về đối tượng Set. |
| 2 |
Set.prototype.clear ()
Loại bỏ tất cả các phần tử khỏi đối tượng Set. |
| 3 |
Set.prototype.delete (giá trị)
Loại bỏ phần tử được liên kết với giá trị. |
| 4 |
Set.prototype.entries ()
Trả về một đối tượng Iterator mới có chứa an array of[giá trị, giá trị] cho mỗi phần tử trong đối tượng Đặt, theo thứ tự chèn. Điều này được giữ tương tự như đối tượng Bản đồ, để mỗi mục nhập có cùng giá trị cho khóa và giá trị của nó ở đây. |
| 5 |
Set.prototype.forEach (callbackFn [, thisArg])
Cuộc gọi callbackFnmột lần cho mỗi giá trị có trong đối tượng Đặt, theo thứ tự chèn. NếuathisArg được cung cấp cho forEach, nó sẽ được sử dụng làm giá trị 'this' cho mỗi lần gọi lại. |
| 6 |
Set.prototype.has (giá trị)
Trả về một boolean xác nhận liệu một phần tử có hiện diện với giá trị đã cho trong đối tượng Set hay không. |
| 7 |
Set.prototype.values ()
Trả về một đối tượng Iterator mới có chứa values cho mỗi phần tử trong đối tượng Đặt theo thứ tự chèn. |
Bộ yếu
Tập hợp yếu chỉ có thể chứa các đối tượng và các đối tượng mà chúng chứa có thể được thu gom rác. Giống như các bản đồ yếu, các bộ yếu không thể được lặp lại.
Ví dụ: Sử dụng Bộ Yếu
'use strict'
let weakSet = new WeakSet();
let obj = {msg:"hello"};
weakSet.add(obj);
console.log(weakSet.has(obj));
weakSet.delete(obj);
console.log(weakSet.has(obj));Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
true
falseTrình lặp lại
Iterator là một đối tượng cho phép truy cập một tập hợp các đối tượng tại một thời điểm. Cả set và map đều có các phương thức trả về một trình lặp.
Trình lặp là các đối tượng có next()phương pháp. Khi phương thức next () được gọi, nó trả về một đối tượng có'value' và 'done'tính chất . 'done' là boolean, điều này sẽ trả về true sau khi đọc tất cả các mục trong bộ sưu tập
Ví dụ 1: Đặt và Trình lặp lại
var set = new Set(['a','b','c','d','e']);
var iterator = set.entries();
console.log(iterator.next())Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
{ value: [ 'a', 'a' ], done: false }Vì, tập hợp không lưu trữ khóa / giá trị, mảng giá trị chứa khóa và giá trị tương tự. done sẽ là false vì có nhiều phần tử được đọc hơn.
Ví dụ 2: Đặt và lặp lại
var set = new Set(['a','b','c','d','e']);
var iterator = set.values();
console.log(iterator.next());Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
{ value: 'a', done: false }Ví dụ 3: Đặt và lặp lại
var set = new Set(['a','b','c','d','e']);
var iterator = set.keys();
console.log(iterator.next());Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
{ value: 'a', done: false }Ví dụ 4: Bản đồ và Trình lặp lại
var map = new Map([[1,'one'],[2,'two'],[3,'three']]);
var iterator = map.entries();
console.log(iterator.next());Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
{ value: [ 1, 'one' ], done: false }Ví dụ 5: Bản đồ và Trình lặp lại
var map = new Map([[1,'one'],[2,'two'],[3,'three']]);
var iterator = map.values();
console.log(iterator.next());Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
{value: "one", done: false}Ví dụ 6: Bản đồ và Trình lặp lại
var map = new Map([[1,'one'],[2,'two'],[3,'three']]);
var iterator = map.keys();
console.log(iterator.next());Kết quả sau được hiển thị khi thực hiện thành công đoạn mã trên.
{value: 1, done: false}