Cách kiểm tra một đối tượng JavaScript

Tìm hiểu các cách JavaScript cung cấp cho bạn để kiểm tra một đối tượng (hoặc bất kỳ loại giá trị nào khác)

JavaScript cung cấp nhiều cách để kiểm tra nội dung của một biến. Cụ thể, hãy cùng tìm hiểulàm thế nào để in nội dung của một đối tượng.

Giả sử chúng ta có đối tượng nàycar, nhưng chúng tôi không biết nội dung của nó và chúng tôi muốn kiểm tra nó:

const car = {
  color: 'black',
  manufacturer: 'Ford',
  model: 'Fiesta'
}

API bảng điều khiển

Sử dụngAPI bảng điều khiểnbạn có thể in bất kỳ đối tượng nào vào bảng điều khiển. Điều này sẽ hoạt động trên bất kỳ trình duyệt nào.

console.log

console.log(car)

Inspect object using console.log

console.dir

console.dir(car)

Inspect object using console.dir

Điều này hoạt động chính xác như

console.log('%O', car)

JSON.stringify()

Thao tác này sẽ in đối tượng dưới dạng biểu diễn chuỗi:

JSON.stringify(car)

Inspect object using console.dir

Bằng cách thêm các tham số này:

JSON.stringify(car, null, 2)

bạn có thể làm cho nó in đẹp hơn. Số cuối cùng xác định lượng khoảng trắng trong thụt lề:

Inspect object using console.dir

JSON.stringify()có lợi thế khi làm việc bên ngoài bảng điều khiển, vì bạn có thể in đối tượng trong màn hình. Hoặc, bạn có thể kết hợp nó với API Console để in nó trong bảng điều khiển:

console.log(JSON.stringify(car, null, 2))

Combine console.log with JSON.stringify

toSource()

Tương tự như JSON.stringify, toSource () là một phương thức có sẵn trên hầu hết các loại,chỉ trong Firefox(và các trình duyệt dựa trên nó):

Using toSource

Đáng nói hơn, nhưng không phải là một tiêu chuẩn và chỉ được triển khai trong Firefox, làm cho JSON.stringify trở thành một giải pháp tốt hơn.

Lặp lại các thuộc tính bằng cách sử dụng một vòng lặp

Cácfor...invòng lặp rất tiện dụng, vì nó in ra các thuộc tính đối tượng:

const inspect = obj => {
  for (const prop in obj) {
    if (obj.hasOwnProperty(prop)) {
      console.log(`${prop}: ${obj[prop]}`)
    }
  }
}

inspect(car)

Looping properties

tôi sử dụnghasOwnProperty()để tránh in các thuộc tính kế thừa.

Bạn có thể quyết định phải làm gì trong vòng lặp, ở đây chúng tôi in tên thuộc tính và giá trị vào bảng điều khiển bằng cách sử dụngconsole.log, nhưng bạn có thể thêm chúng vào một chuỗi và sau đó in chúng trên trang.

Cách kiểm tra trong Node.js

Phương thức kiểm tra () được hiển thị bởiutilgói hoạt động tốt trong Node.js:

util.inspect(car)

Use util.inspect in Node.js

Tuy nhiên, một bản trình bày tốt hơn nhiều được cung cấp bởiconsole.dir(), vớicolorsthuộc tính được kích hoạt:

console.dir(car, { colors: true })

console.dir in Node with colors

Tải xuống miễn phí của tôiSổ tay dành cho Người mới bắt đầu JavaScript


Các hướng dẫn js khác: