🔥CHỌN LỌC TOP NHỮNG KHOÁ HỌC LẬP TRÌNH ONLINE NHIỀU NGƯỜI THEO HOC TẠI ĐÂY🔥

Hãy bước ra khỏi các cấu trúc dữ liệu riêng lẻ và nói về việc lặp qua chúng.

Trong các chương trước có các phương thức map.keys(), map.values(), map.entries().

Các phương thức này là chung chung, có một thỏa thuận chung để sử dụng chúng cho các cấu trúc dữ liệu. Nếu chúng ta tự tạo một cấu trúc dữ liệu, chúng ta cũng nên sử dụng chúng.

Chúng được hỗ trợ cho:

  • Map
  • Set
  • Array

Các đối tượng đơn giản cũng hỗ trợ các phương thức tương tự, nhưng cú pháp hơi khác một chút.

1. Object.keys, values, entries(phần tử)

Đối với các đối tượng đơn giản, các phương thức sau đây có sẵn:

Xin lưu ý sự khác biệt (ví dụ so với map):

Mapobject
Cú pháp khi gọi map.keys() Object.keys(obj), nhưng không obj.keys()
Trả vềSự lặp lại(iterable) Mảng thực sự

Sự khác biệt đầu tiên là chúng ta phải gọi Object.keys(obj), và không obj.keys().

Tại sao như vậy? Lý do chính là sự linh hoạt. Hãy nhớ rằng, các đối tượng là một cơ sở của tất cả các cấu trúc phức tạp trong JavaScript. Vì vậy, chúng ta có thể có một đối tượng của riêng mình, datathực hiện phương thức riêng của mình data.values(). Và chúng ta vẫn có thể gọi Object.values(data) đó.

Sự khác biệt thứ hai là các phương thức Object.* trả về các đối tượng mảng thật. Điều đó chủ yếu là vì lý do lịch sử.

Ví dụ:

let user = {
  name: "John",
  age: 30
};
  • Object.keys(user) = ["name", "age"]
  • Object.values(user) = ["John", 30]
  • Object.entries(user) = [ ["name","John"], ["age",30] ]

Đây là một ví dụ về việc sử dụng Object.valuesđể lặp lại các giá trị thuộc tính:

/*
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Group: https://www.facebook.com/groups/cafedev.vn/
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
Pinterest: https://www.pinterest.com/cafedevvn/
YouTube: https://www.youtube.com/channel/UCE7zpY_SlHGEgo67pHxqIoA/
*/

let user = {
  name: "John",
  age: 30
};

// loop over values
for (let value of Object.values(user)) {
  alert(value); // John, then 30
}

Object.keys / value / entries bỏ qua các thuộc tính biểu tượng

Cũng giống như một vòng lặp for..in, các phương thức này bỏ qua các thuộc tính sử dụng Symbol(...)làm khóa.

Thông thường đó là thuận tiện. Nhưng nếu chúng ta cũng muốn các khóa là ký hiệu, ​​thì có một phương thức riêng biệt Object.getOwnPropertySymbols trả về một mảng chỉ có các khóa ký hiệu. Ngoài ra, tồn tại một phương thức Reflect.ownKeys(obj) trả về tất cả các khóa.

2. Biến đổi đối tượng

Đối tượng thiếu khá nhiều phương thức mà có sẳn trong mảng, ví dụ map, filtervà những phương thức khác.

Nếu chúng ta muốn áp dụng chúng, thì chúng ta có thể sử dụng Object.entriestheo sau Object.fromEntries:

  1. Sử dụng Object.entries(obj)để có được một loạt các cặp khóa / giá trị từ obj.
  2. Sử dụng các phương thức mảng trên mảng đó, vd map.
  3. Sử dụng Object.fromEntries(array)trên mảng kết quả để biến nó trở lại thành một đối tượng.

Ví dụ: chúng ta có một đối tượng với prices và muốn nhân đôi chúng:

let prices = {
  banana: 1,
  orange: 2,
  meat: 4,
};

let doublePrices = Object.fromEntries(
  // convert to array, map, and then fromEntries gives back the object
  Object.entries(prices).map(([key, value]) => [key, value * 2])
);

alert(doublePrices.meat); // 8

Nó có thể trông khó khăn từ cái nhìn đầu tiên, nhưng trở nên dễ hiểu sau khi bạn sử dụng nó một hoặc hai lần. Chúng ta có thể tạo ra những chuỗi biến đổi mạnh mẽ theo cách này.

Full series tự học Javascript từ cơ bản tới nâng cao tại đây nha.

Nếu bạn thấy hay và hữu ích, bạn có thể tham gia các kênh sau của cafedev để nhận được nhiều hơn nữa:

Chào thân ái và quyết thắng!

Đăng ký kênh youtube để ủng hộ Cafedev nha các bạn, Thanks you!

BÀI VIẾT LIÊN QUANXEM THÊM