Cách đếm số thuộc tính trong một đối tượng JavaScript

Tìm hiểu cách đếm số lượng thuộc tính trong một đối tượng JavaScript, bằng hai phương pháp khác nhau.

Để đếm số thuộc tính đối tượng JavaScript, bạn có thể sử dụng:

a for vòng lặp
hoặc Object.keys() phương pháp.

Hãy khám phá cả hai!

Đếm thuộc tính đối tượng với vòng lặp for

Đây là một đối tượng JavaScript có tên là dog :

const dog = {
  name: "Naya",
  age: 2,
  color: "black",
  Breed: "Rottweiler mix",
}

Để đếm số lượng thuộc tính đối tượng trong dog , trước tiên hãy khai báo một biến có tên là count và cung cấp cho nó giá trị bắt đầu là 0 :

let count = 0

Bây giờ chúng ta cần lặp qua dog đối tượng và đối với mỗi thuộc tính mà chúng tôi bắt gặp, chúng tôi thêm một (+ 1) vào count biến:

for (let properties in dog) {
  count = count + 1
}

Bây giờ hãy thử in kết quả bằng cách sử dụng console.log() :

console.log(count)
// Result: 4

Nếu bạn đã viết mã chính xác, bạn sẽ nhận được 4 .

Đếm thuộc tính đối tượng với Object.keys ()

Bạn cũng có thể sử dụng Object.keys() của JavaScript phương pháp để đếm tất cả có thể liệt kê thuộc tính (thông tin thêm về điều đó trong giây lát) trên một đối tượng.

Hãy sử dụng lại dog đối tượng từ trước, nhưng bây giờ chúng ta chuyển dog đối tượng với Object.keys() và tính toán độ dài của nó với length tài sản:

const dog = {
  name: "Naya",
  age: 2,
  color: "black",
  Breed: "Rottweiler mix",
}

let count = Object.keys(dog).length

console.log(count)
// Result: 4

Như bạn có thể thấy, kết quả là như nhau. Hay là nó?

Có và không. Nó phụ thuộc vào ngữ cảnh.

đối với Object.keys ()

Sự khác biệt giữa việc sử dụng for vòng lặp và Object.keys() là:

for vòng lặp đếm cả thuộc tính của đối tượng (ở đây, dog ) và bất kỳ thuộc tính nào có thể được liên kết với đối tượng bên ngoài nó.
Theo mặc định, Object.keys() phương thức chỉ đếm (liệt kê) các thuộc tính liệt kê (riêng) của đối tượng - không phải các thuộc tính được liên kết.

Liệt kê là một từ khác để chỉ đếm.

Ý tôi là gì với “thuộc tính được liên kết”?

Hãy lấy cùng một Object.keys() ví dụ từ trước, nhưng lần này chúng tôi liên kết con chó dog đối tượng với một đối tượng được gọi là animal bằng cách sử dụng _proto_ tài sản:

// New object
let animal = {
  fourLegs: true,
}

const dog = {
  name: "Naya",
  age: 2,
  color: "black",
  Breed: "Rottweiler mix",
}

// Link dog object to animal object
dog.__proto__ = animal

var count = Object.keys(dog).length
console.log(count)
// Result: 4

Tại sao kết quả lại là 4, khi tổng số thuộc tính của dog và animal là 5 và chúng tôi vừa liên kết chúng lại với nhau và đếm chúng?

Bởi vì chúng tôi đang sử dụng Object.keys() mà chỉ đếm các thuộc tính riêng (có thể liệt kê) của nó, không tính các thuộc tính được liên kết. Do đó, fourLegs thuộc tính từ animal đối tượng không được tính trong ví dụ trên.

Bây giờ chúng ta hãy thử một ví dụ khác, nhưng lần này chúng ta sử dụng for vòng lặp để đếm các thuộc tính:

const animal = {
  fourLegs: true,
}

const dog = {
  name: "Naya",
  age: 2,
  color: "black",
  Breed: "Rottweiler mix",
}

// Link dog object to animal object
dog.__proto__ = animal

let count = 0

for (properties in dog) {
  count = count + 1
}

console.log(count)
// Result: 5

Bây giờ chúng ta đang nhận được tất cả 5 thuộc tính, vì không giống như Object.keys() khi chúng tôi sử dụng for vòng lặp chúng tôi đếm mọi thuộc tính của một đối tượng, bao gồm cả được liên kết thuộc tính đối tượng.

Như bạn có thể thấy, điều quan trọng là bạn sử dụng cách tiếp cận nào.

Tóm lại:

Có hai cách để đếm số lượng thuộc tính trong một đối tượng. Bạn có thể sử dụng for vòng lặp hoặc Object.keys() phương pháp.
Sử dụng for lặp lại nếu bạn muốn đưa bất kỳ thuộc tính đối tượng được liên kết nào vào số thuộc tính của mình.
Sử dụng Object.keys() nếu bạn chỉ muốn đếm các thuộc tính có thể liệt kê (của riêng đối tượng).