Hướng dẫn can an object be a key in a javascript map? - một đối tượng có thể là một khóa trong bản đồ javascript không?

Tóm tắt: Trong hướng dẫn này, bạn sẽ tìm hiểu về đối tượng bản đồ JavaScript ánh xạ khóa thành một giá trị.: in this tutorial, you will learn about the JavaScript Map object that maps a key to a value.

Giới thiệu về đối tượng bản đồ JavaScript

Trước ES6, chúng ta thường sử dụng một đối tượng để mô phỏng bản đồ bằng cách ánh xạ một khóa đến giá trị của bất kỳ loại nào. Nhưng sử dụng một đối tượng làm bản đồ có một số tác dụng phụ:

  1. Một đối tượng luôn có một khóa mặc định như nguyên mẫu.
  2. Khóa của một đối tượng phải là một chuỗi hoặc biểu tượng, bạn không thể sử dụng một đối tượng làm khóa.
  3. Một đối tượng không có thuộc tính đại diện cho kích thước của bản đồ.

ES6 cung cấp một loại bộ sưu tập mới gọi là

let userRoles = new Map();

Code language: JavaScript (javascript)
5 giải quyết các thiếu sót này.

Theo định nghĩa, một đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5 giữ các cặp giá trị khóa. Các phím là duy nhất trong bộ sưu tập bản đồ. Nói cách khác, một khóa trong một đối tượng bản đồ chỉ xuất hiện một lần.

Các khóa và giá trị của bản đồ có thể là bất kỳ giá trị nào.

Khi lặp lại một đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5, mỗi lần lặp lại trả về một mảng 2 thành viên là

let userRoles = new Map();

Code language: JavaScript (javascript)
8. Thứ tự lặp theo thứ tự chèn tương ứng với thứ tự trong đó mỗi cặp giá trị khóa lần đầu tiên được chèn vào bản đồ bằng phương thức

let userRoles = new Map();

Code language: JavaScript (javascript)
9.

Để tạo

let userRoles = new Map();

Code language: JavaScript (javascript)
5 mới, bạn sử dụng cú pháp sau:

let map = new Map([iterable]);

Code language: JavaScript (javascript)

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)
1 chấp nhận một đối tượng có thể lặp lại tùy chọn có các phần tử là các cặp giá trị khóa.

Phương pháp bản đồ JavaScript hữu ích

  • console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

    Code language: JavaScript (javascript)
    2 - Loại bỏ tất cả các phần tử khỏi đối tượng bản đồ.
  • & nbsp; ________ 33 - Loại bỏ một phần tử được chỉ định bởi khóa. Nó trả về nếu phần tử nằm trong bản đồ, hoặc sai nếu nó không.
  • & nbsp; ________ 34 - Trả về một đối tượng lặp mới có chứa một mảng

    let userRoles = new Map();

    Code language: JavaScript (javascript)
    8 cho mỗi phần tử trong đối tượng bản đồ. Thứ tự của các đối tượng trong bản đồ giống như thứ tự chèn.
  • & nbsp; ________ 36-gọi một cuộc gọi lại cho mỗi cặp giá trị khóa trong bản đồ theo thứ tự chèn. Tham số này tùy chọn đặt giá trị

    console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

    Code language: JavaScript (javascript)
    7 cho mỗi cuộc gọi lại.
  • & nbsp; get (khóa) - Trả về giá trị được liên kết với khóa. Nếu khóa không tồn tại, nó sẽ trả về không xác định.
  • & nbsp; có (khóa) - trả về true nếu một giá trị liên quan đến khóa tồn tại hoặc sai.
  • & nbsp; ________ 38 - Trả về một trình lặp mới có chứa các phím cho các phần tử theo thứ tự chèn.
  • & nbsp; ________ 39 - Đặt giá trị cho khóa trong đối tượng bản đồ. Nó trả về chính đối tượng bản đồ do đó bạn có thể chuỗi phương pháp này với các phương thức khác.
  • & nbsp; ________ 40 Trả về một đối tượng lặp mới có chứa các giá trị cho từng phần tử theo thứ tự chèn.

Ví dụ bản đồ JavaScript

Hãy cùng lấy một số ví dụ về việc sử dụng một đối tượng bản đồ.

Tạo một đối tượng bản đồ mới

Giả sử bạn có một danh sách các đối tượng

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)
1 như sau:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)

Giả sử rằng bạn phải tạo một bản đồ người dùng và vai trò. Trong trường hợp này, bạn sử dụng mã sau:

let userRoles = new Map();

Code language: JavaScript (javascript)

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)
2 là một thể hiện của đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5 và loại của nó là một đối tượng như được minh họa trong ví dụ sau:

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)

Thêm các phần tử vào bản đồ

Để gán vai trò cho người dùng, bạn sử dụng phương thức

let userRoles = new Map();

Code language: JavaScript (javascript)
9:

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)

Phương pháp

let userRoles = new Map();

Code language: JavaScript (javascript)
9 ánh xạ người dùng

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)
6 với vai trò

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)
7. Vì phương thức

let userRoles = new Map();

Code language: JavaScript (javascript)
9 có thể chuỗi, bạn có thể lưu một số gõ như trong ví dụ này:

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)

Khởi tạo bản đồ với một đối tượng có thể lặp lại

Như đã đề cập trước đó, bạn có thể chuyển một đối tượng có thể lặp lại cho hàm tạo

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)
1:

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)

Nhận một phần tử từ bản đồ theo khóa

Nếu bạn muốn xem vai trò của

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)
0, bạn sẽ sử dụng phương pháp

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)
1:

userRoles.get(john); // admin

Code language: JavaScript (javascript)

Nếu bạn vượt qua một khóa không tồn tại, phương thức

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)
1 sẽ trả về

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)
3.

let foo = {name: 'Foo'}; userRoles.get(foo); //undefined

Code language: JavaScript (javascript)

Kiểm tra sự tồn tại của một phần tử bằng khóa

Để kiểm tra xem một khóa có tồn tại trong bản đồ không, bạn sử dụng phương thức

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)
4.

userRoles.has(foo); // false userRoles.has(lily); // true

Code language: JavaScript (javascript)

Nhận số lượng các phần tử trong bản đồ

Thuộc tính

userRoles.set(lily, 'editor') .set(peter, 'subscriber');

Code language: JavaScript (javascript)
5 trả về số lượng mục của đối tượng bản đồ.

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
0

Lặp lại các phím bản đồ

Để có được các khóa của đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5, bạn sử dụng phương thức

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)
8.

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)
8 trả về một đối tượng lặp mới có chứa các khóa của các phần tử trong bản đồ.

Ví dụ sau đây hiển thị tên người dùng của người dùng trong đối tượng bản đồ

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)
2.

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
1

Output:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
2

Lặp lại các giá trị bản đồ

Tương tự, bạn có thể sử dụng phương thức

userRoles.set(john, 'admin');

Code language: JavaScript (javascript)
0 để lấy một đối tượng Iterator chứa các giá trị cho tất cả các phần tử trong bản đồ:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
3

Output:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
4

Lặp lại các yếu tố bản đồ

Ngoài ra, phương thức

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)
4 trả về một đối tượng lặp có chứa một mảng

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
2 của mỗi phần tử trong đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
5

Để làm cho việc lặp lại tự nhiên hơn, bạn có thể sử dụng phá hủy như sau:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
6

Ngoài vòng lặp

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
4, bạn có thể sử dụng phương thức

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
5 của đối tượng bản đồ:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
7

Chuyển đổi các phím hoặc giá trị bản đồ thành một mảng

Đôi khi, bạn muốn làm việc với một mảng thay vì một đối tượng có thể lặp lại, trong trường hợp này, bạn có thể sử dụng toán tử lây lan.

Ví dụ sau đây chuyển đổi các phím cho từng phần tử thành một mảng các phím:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
8

Output:

let john = {name: 'John Doe'}, lily = {name: 'Lily Bush'}, peter = {name: 'Peter Drucker'};

Code language: JavaScript (javascript)
9

Và sau đây chuyển đổi các giá trị của các phần tử thành một mảng:

let userRoles = new Map();

Code language: JavaScript (javascript)
0

Đầu ra

let userRoles = new Map();

Code language: JavaScript (javascript)
1

Xóa một phần tử bằng khóa

Để xóa một mục trong bản đồ, bạn sử dụng phương thức

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
6.

let userRoles = new Map();

Code language: JavaScript (javascript)
2

Xóa tất cả các yếu tố trong bản đồ

Để xóa tất cả các mục trong đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5, bạn sử dụng phương thức

console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

Code language: JavaScript (javascript)
2:

let userRoles = new Map();

Code language: JavaScript (javascript)
3

Do đó, kích thước của bản đồ bây giờ là bằng không.

let userRoles = new Map();

Code language: JavaScript (javascript)
4

Yếu

A

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
9 tương tự như

let userRoles = new Map();

Code language: JavaScript (javascript)
5 ngoại trừ các khóa của

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
9 phải là đối tượng. Điều đó có nghĩa là khi một tham chiếu đến một khóa (một đối tượng) nằm ngoài phạm vi, giá trị tương ứng sẽ tự động được giải phóng khỏi bộ nhớ.

A

let userRoles = new Map([ [john, 'admin'], [lily, 'editor'], [peter, 'subscriber'] ]);

Code language: JavaScript (javascript)
9 chỉ có các phương thức tập hợp con của đối tượng

let userRoles = new Map();

Code language: JavaScript (javascript)
5:

  •  

    userRoles.get(john); // admin

    Code language: JavaScript (javascript)
    4
  • & nbsp; ________ 39
  •  

    userRoles.get(john); // admin

    Code language: JavaScript (javascript)
    6
  •  

    console.log(typeof(userRoles)); // object console.log(userRoles instanceof Map); // true

    Code language: JavaScript (javascript)
    3

Dưới đây là sự khác biệt chính giữa

let userRoles = new Map();

Code language: JavaScript (javascript)
5 và

userRoles.get(john); // admin

Code language: JavaScript (javascript)
9:

  • Các yếu tố của một điểm yếu không thể được lặp lại.
  • Không thể xóa tất cả các yếu tố cùng một lúc.
  • Không thể kiểm tra kích thước của một yếu.

Trong hướng dẫn này, bạn đã học được cách làm việc với đối tượng bản đồ JavaScript và các phương pháp hữu ích của nó để thao tác các mục trong bản đồ.

Hướng dẫn này có hữu ích không?

Bản đồ JavaScript có thể có đối tượng làm khóa không?

Khóa của một đối tượng phải là một chuỗi hoặc biểu tượng, bạn không thể sử dụng một đối tượng làm khóa. Một đối tượng không có thuộc tính đại diện cho kích thước của bản đồ.you cannot use an object as a key. An object does not have a property that represents the size of the map.

Sự khác biệt giữa bản đồ và các phím của một đối tượng là gì?

Một bản đồ được đặt hàng và có thể lặp lại, trong khi một đối tượng không được đặt hàng và không thể lặp lại (theo nghĩa là chúng không có thuộc tính [biểu tượng. Iterator]. Tuy nhiên, bạn có thể lặp lại các phím sử dụng cho..in Cú pháp.) Chúng ta có thể đặt bất kỳ loại dữ liệu nào làm khóa bản đồ, trong khi các đối tượng chỉ có thể có một số, chuỗi hoặc ký hiệu làm khóa. (in the sense that they don't have a [Symbol. iterator] property. However, you can iterate over the keys using for..in syntax.) We can put any type of data as a Map key, whereas objects can only have a number, string, or symbol as a key.

Là đối tượng trong hashmap javascript?

Các đối tượng JavaScript: Tương tự nhưng khác nhau, khóa trong Hashmap có thể là bất kỳ kiểu dữ liệu nào, điều này bao gồm các mảng và đối tượng.Trong khi đó, các đối tượng chỉ có thể sử dụng số nguyên, chuỗi và ký hiệu làm khóa của chúng.Hashmap được tổ chức dưới dạng danh sách được liên kết, vì vậy thứ tự của các yếu tố của nó được duy trì, cho phép hashmap có thể sử dụng được.The key in a hashmap can be any datatype, this includes arrays and objects. Meanwhile, objects can only use integers, strings, and symbols as their keys. Hashmaps are organized as linked lists, so the order of its elements is maintained, which allows the hashmap to be iterable.

Một mảng có thể là một javascript khóa đối tượng?

Để chuyển đổi các giá trị của một mảng thành các khóa đối tượng: khai báo một biến mới và đặt nó thành một đối tượng trống. Sử dụng phương thức foreach () để lặp qua mảng. Mỗi lần lặp, hãy gán phần tử của mảng làm khóa trong đối tượng.Declare a new variable and set it to an empty object. Use the forEach() method to iterate over the array. On each iteration, assign the array's element as a key in the object.