Tốt hơn là sử dụng Bản đồ hoặc đối tượng trong JavaScript?

Đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 giữ các cặp khóa-giá trị và ghi nhớ thứ tự chèn ban đầu của các khóa. Bất kỳ giá trị nào (cả đối tượng và giá trị nguyên thủy) đều có thể được sử dụng làm khóa hoặc giá trị

Thử nó

Sự miêu tả

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 đối tượng là tập hợp các cặp khóa-giá trị. Một khóa trong
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 chỉ có thể xuất hiện một lần; . Đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 được lặp theo cặp khóa-giá trị — vòng lặp
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
6 trả về một mảng 2 phần tử của
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
7 cho mỗi lần lặp. Việc lặp lại xảy ra theo thứ tự chèn, tương ứng với thứ tự mà mỗi cặp khóa-giá trị được chèn lần đầu tiên vào bản đồ bằng phương pháp
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
8 (nghĩa là không có khóa nào có cùng giá trị trong bản đồ khi
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
8 được gọi

Thông số kỹ thuật yêu cầu các bản đồ phải được triển khai "về trung bình, cung cấp thời gian truy cập phụ trên số lượng phần tử trong bộ sưu tập". Do đó, nó có thể được biểu diễn bên trong dưới dạng bảng băm (với tra cứu O(1), cây tìm kiếm (với tra cứu O(log(N))) hoặc bất kỳ cấu trúc dữ liệu nào khác, miễn là độ phức tạp tốt hơn O

bình đẳng chính

Bình đẳng giá trị dựa trên thuật toán SameValueZero. (Nó đã từng sử dụng SameValue, coi

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
0 và
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
1 là khác nhau. Kiểm tra tính tương thích của trình duyệt. ) Điều này có nghĩa là
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
2 được coi là giống như
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
2 (mặc dù
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
4) và tất cả các giá trị khác được coi là bằng nhau theo ngữ nghĩa của toán tử
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
5

Đối tượng vs. bản đồ

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 tương tự như
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1—cả hai đều cho phép bạn đặt khóa thành giá trị, truy xuất các giá trị đó, xóa khóa và phát hiện xem có thứ gì đó được lưu trữ tại khóa hay không. Vì lý do này (và vì không có lựa chọn thay thế tích hợp sẵn),
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 đã được sử dụng làm
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 trong lịch sử

Tuy nhiên, có những khác biệt quan trọng khiến

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 được ưa chuộng hơn trong một số trường hợp

MapObjectAccidental KeysA
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 không chứa bất kỳ khóa nào theo mặc định. Nó chỉ chứa những gì được đưa vào nó một cách rõ ràng

Một

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 có nguyên mẫu, vì vậy nó chứa các khóa mặc định có thể xung đột với các khóa của chính bạn nếu bạn không cẩn thận

Ghi chú. Điều này có thể được bỏ qua bằng cách sử dụng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
23, nhưng điều này hiếm khi được thực hiện

SecurityA
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 an toàn khi sử dụng với các khóa và giá trị do người dùng cung cấp

Đặt các cặp khóa-giá trị do người dùng cung cấp trên

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 có thể cho phép kẻ tấn công ghi đè nguyên mẫu của đối tượng, điều này có thể dẫn đến các cuộc tấn công tiêm đối tượng. Giống như sự cố về khóa ngẫu nhiên, điều này cũng có thể được giảm thiểu bằng cách sử dụng đối tượng nguyên mẫu
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
26

Các loại khóaKhóa của
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 có thể là bất kỳ giá trị nào (bao gồm hàm, đối tượng hoặc bất kỳ nguyên hàm nào). Khóa của một
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 phải là một
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
29 hoặc một
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
90. Đặt hàng chính

Các phím trong

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 được sắp xếp theo cách đơn giản, dễ hiểu. Một đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 lặp lại các mục nhập, khóa và giá trị theo thứ tự chèn mục nhập

Mặc dù các khóa của một

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 bình thường hiện đã được đặt hàng, nhưng điều này không phải lúc nào cũng đúng và thứ tự rất phức tạp. Do đó, tốt nhất là không nên dựa vào thứ tự tài sản

Thứ tự lần đầu tiên được xác định cho các thuộc tính riêng chỉ trong ECMAScript 2015; . Xem các hoạt động đặc tả trừu tượng của OrdinaryOwnPropertyKeys và EnumerateObjectProperties. Nhưng lưu ý rằng không có cơ chế đơn lẻ nào lặp lại tất cả các thuộc tính của đối tượng; . (

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
94 chỉ bao gồm các thuộc tính khóa chuỗi có thể đếm được;
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
95 chỉ bao gồm các thuộc tính khóa chuỗi, có thể đếm được của riêng;
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
96 bao gồm các thuộc tính có khóa chuỗi, riêng ngay cả khi không thể đếm được;
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
97 thực hiện tương tự đối với chỉ các thuộc tính có khóa
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
90, v.v. )

Kích thước

Số lượng mục trong một
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 có thể dễ dàng lấy ra từ thuộc tính
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
90 của nó. Số lượng mục trong một
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 phải được xác định thủ công. IterationA
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 là một iterable, vì vậy nó có thể được lặp trực tiếp

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 không triển khai giao thức lặp và do đó, các đối tượng không thể lặp lại trực tiếp bằng cách sử dụng JavaScript cho. của tuyên bố (theo mặc định)

Ghi chú

  • Một đối tượng có thể triển khai giao thức lặp hoặc bạn có thể nhận một đối tượng có thể lặp lại bằng cách sử dụng
    wrongMap.has('bla')    // false
    wrongMap.delete('bla') // false
    console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
    
    95 hoặc
    wrongMap.has('bla')    // false
    wrongMap.delete('bla') // false
    console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
    
    95
  • cho. trong câu lệnh cho phép bạn lặp lại vô số thuộc tính của một đối tượng

Hiệu suất

Hoạt động tốt hơn trong các tình huống liên quan đến việc thêm và xóa các cặp khóa-giá trị thường xuyên

Không được tối ưu hóa để thường xuyên thêm và xóa các cặp khóa-giá trị

Tuần tự hóa và phân tích cú pháp

Không có hỗ trợ riêng cho tuần tự hóa hoặc phân tích cú pháp

(Nhưng bạn có thể xây dựng hỗ trợ tuần tự hóa và phân tích cú pháp của riêng mình cho

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 bằng cách sử dụng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
97 với đối số thay thế của nó và bằng cách sử dụng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
98 với đối số hồi sinh của nó. Xem câu hỏi Stack Overflow Làm thế nào để bạn JSON. xâu chuỗi một Bản đồ ES6?)

Hỗ trợ riêng cho tuần tự hóa từ

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6 sang JSON, sử dụng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
97

Hỗ trợ gốc để phân tích cú pháp từ JSON sang

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
6, sử dụng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
98

Đặt thuộc tính đối tượng

Đặt thuộc tính Đối tượng cũng hoạt động cho các đối tượng Bản đồ và có thể gây nhầm lẫn đáng kể

Do đó, điều này dường như hoạt động theo cách

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
2

Nhưng cách đặt thuộc tính đó không tương tác với cấu trúc dữ liệu Bản đồ. Nó sử dụng tính năng của đối tượng chung. Giá trị của 'bla' không được lưu trữ trong Bản đồ cho các truy vấn. Các hoạt động khác trên dữ liệu không thành công

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }

Cách sử dụng chính xác để lưu trữ dữ liệu trong Bản đồ là thông qua phương pháp

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
43

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1

Người xây dựng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
44

Tạo một đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 mới

thuộc tính tĩnh

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
46

Hàm tạo được sử dụng để tạo các đối tượng dẫn xuất

Thuộc tính cá thể

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
47

Giá trị ban đầu của thuộc tính

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
48 là chuỗi
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
49. Tài sản này được sử dụng trong
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
20

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
21

Trả về số cặp khóa/giá trị trong đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1

Phương thức sơ thẩm

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
23

Xóa tất cả các cặp khóa-giá trị khỏi đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
25

Trả về

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
26 nếu một phần tử trong đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 đã tồn tại và đã bị xóa hoặc
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
28 nếu phần tử không tồn tại.
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
29 sẽ trả lại
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
28 sau đó

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
31

Trả về giá trị được liên kết với khóa đã truyền hoặc

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
32 nếu không có

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
33

Trả về một giá trị boolean cho biết liệu một giá trị có được liên kết với khóa đã truyền trong đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 hay không

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
35

Đặt giá trị cho khóa đã truyền trong đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1. Trả về đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
38

Trả về một đối tượng Iterator mới chứa một mảng hai phần tử của

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
7 cho mỗi phần tử trong đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 theo thứ tự chèn

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
31

Trả về một đối tượng Iterator mới chứa các khóa cho từng phần tử trong đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 theo thứ tự chèn

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
33

Trả về một đối tượng Iterator mới chứa các giá trị cho từng phần tử trong đối tượng

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 theo thứ tự chèn

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
35

Trả về một đối tượng Iterator mới chứa một mảng hai phần tử của

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
7 cho mỗi phần tử trong đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1 theo thứ tự chèn

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
38

Gọi

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
39 một lần cho mỗi cặp khóa-giá trị có trong đối tượng
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
1, theo thứ tự chèn. Nếu một tham số
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
01 được cung cấp cho
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
02, nó sẽ được sử dụng làm giá trị
wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
03 cho mỗi lần gọi lại

ví dụ

Sử dụng đối tượng Bản đồ

wrongMap.has('bla')    // false
wrongMap.delete('bla') // false
console.log(wrongMap)  // Map { bla: 'blaa', bla2: 'blaaa2' }
2

Sử dụng NaN làm khóa Bản đồ

const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
2 cũng có thể được sử dụng làm chìa khóa. Mặc dù mọi
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
2 không bằng chính nó (
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
4 là đúng), ví dụ sau hoạt động vì các
const contacts = new Map()
contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
contacts.has('Jessie') // true
contacts.get('Hilary') // undefined
contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"})
contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete('Raymond') // false
contacts.delete('Jessie') // true
console.log(contacts.size) // 1
2 không thể phân biệt được với nhau

Bản đồ hoặc Đối tượng nhanh hơn trong JavaScript?

Kết quả tương tự với các trường hợp khóa chuỗi đó. Bản đồ bắt đầu nhanh hơn nhiều so với các đối tượng (chèn và xóa nhanh hơn 2 lần, lặp lại nhanh hơn 4-5 lần), nhưng đồng bằng đang giảm dần .

Tại sao lại sử dụng bản đồ thay vì JavaScript đối tượng?

Bản đồ có thể lặp lại, do đó, nó có thể được lặp lại trực tiếp . Đối tượng không triển khai giao thức lặp và do đó, các đối tượng không thể lặp lại trực tiếp bằng cách sử dụng JavaScript cho. của tuyên bố (theo mặc định).

Lợi ích của việc sử dụng bản đồ thay vì Đối tượng JavaScript đơn giản để lưu trữ khóa là gì

Tóm lại, Bản đồ tương tự như Đối tượng ở chỗ chúng chứa các cặp khóa/giá trị, nhưng Bản đồ có một số lợi thế so với đối tượng. Kích thước - Bản đồ có thuộc tính kích thước , trong khi Đối tượng không có cách tích hợp để truy xuất kích thước của chúng. Lặp lại - Bản đồ có thể lặp lại trực tiếp, trong khi Đối tượng thì không.