Cách kiểm tra xem thuộc tính có tồn tại trong đối tượng JavaScript không

Khi làm việc với các đối tượng trong JavaScript, bạn có thể cần kiểm tra xem một thuộc tính cụ thể có tồn tại hay không.

Trong bài viết này, tôi sẽ chỉ cho bạn ba cách để kiểm tra xem một thuộc tính có tồn tại trong một đối tượng JavaScript hay không.

Làm thế nào để sử dụng hasOwnProperty() Phương thức trong JavaScript

Các hasOwnProperty() phương thức sẽ kiểm tra xem một đối tượng có chứa thuộc tính trực tiếp hay không và sẽ trả về true hoặc false nếu nó tồn tại hay không.

Đây là cú pháp cơ bản:

obj.hasOwnProperty(prop)

Trong ví dụ đầu tiên này, chúng ta có một đối tượng được gọi là developer với ba thuộc tính:

const developer = {
  name: "Jessica Wilkins",
  country: "United States",
  isEmployed: true
};

Nếu chúng tôi muốn kiểm tra xem isEmployed tài sản tồn tại trong developer đối tượng, sau đó chúng ta có thể sử dụng hasOwnProperty() phương pháp, như thế này:

developer.hasOwnProperty("isEmployed")

Điều này sẽ trả về true vì thuộc tính được gọi là isEmployed là tài sản trực tiếp của developer vật.

Nhưng điều gì sẽ xảy ra nếu chúng ta thử kiểm tra một thuộc tính có tên isPrototypeOf?

developer.hasOwnProperty("isPrototypeOf")

Điều này sẽ trả về false vì không có thuộc tính trực tiếp nào được gọi là isPrototypeOf trên developer vật. Nhưng tôi có ý nghĩa gì bởi tài sản trực tiếp?

Bất cứ khi nào bạn tạo một đối tượng trong JavaScript, sẽ có một thuộc tính tích hợp được gọi là nguyên mẫu và giá trị là một đối tượng khác. Đối tượng đó sẽ có nguyên mẫu riêng và đây được gọi là chuỗi nguyên mẫu.

Của chúng ta developer đối tượng có quyền truy cập vào các thuộc tính khác này, như toStringvà đây được gọi là tài sản được thừa kế.

Các hasOwnProperty() phương thức sẽ chỉ trả về true cho các thuộc tính trực tiếp chứ không phải các thuộc tính được kế thừa từ chuỗi nguyên mẫu.

Làm thế nào để sử dụng in Nhà điều hành

không giống như hasOwnProperty() phương pháp, các in toán tử sẽ trả về true cho cả thuộc tính trực tiếp và thuộc tính kế thừa tồn tại trong đối tượng.

Đây là cú pháp cơ bản:

property in object

Chúng ta có thể sửa đổi ví dụ trước đó để kiểm tra xem country tài sản tồn tại trong developer đối tượng sử dụng in nhà điều hành.

"country" in developer

Điều này sẽ trả về true bởi vì country tài sản là một tài sản trực tiếp trong developer vật.

Chúng tôi cũng có thể kiểm tra nếu toString tài sản tồn tại trên developer đối tượng hoặc trong chuỗi nguyên mẫu.

"toString" in developer

Điều này sẽ trả về true bởi vì toString thuộc tính tồn tại trong chuỗi nguyên mẫu vì nó được kế thừa từ đối tượng nguyên mẫu.

Cách kiểm tra xem một thuộc tính có tồn tại trong một đối tượng hay không bằng cách sử dụng undefined

Nếu tôi cố truy cập một tên thuộc tính trong một đối tượng không tồn tại, thì tôi sẽ không xác định được.

Ví dụ, nếu tôi cố gắng developer.age thì giá trị trả về sẽ không được xác định vì developer đối tượng không có tên thuộc tính đó.

Chúng ta có thể kiểm tra xem một thuộc tính có tồn tại trong đối tượng hay không bằng cách kiểm tra xem property !== undefined.

Trong ví dụ này, nó sẽ trả về true vì name tài sản tồn tại trong developer vật.

developer.name !== undefined

Phần kết luận

Nếu bạn cần kiểm tra xem một thuộc tính có tồn tại trong một đối tượng JavaScript hay không, thì có ba cách phổ biến để thực hiện điều đó.

Các hasOwnProperty() phương thức sẽ kiểm tra xem một đối tượng có chứa thuộc tính trực tiếp hay không và sẽ trả về true hoặc false nếu nó tồn tại hay không. Các hasOwnProperty() phương thức sẽ chỉ trả về true cho các thuộc tính trực tiếp chứ không phải các thuộc tính được kế thừa từ chuỗi nguyên mẫu.

không giống như hasOwnProperty() phương pháp, các in toán tử sẽ trả về true cho cả thuộc tính trực tiếp và thuộc tính kế thừa tồn tại trong đối tượng hoặc chuỗi nguyên mẫu của nó.

Cuối cùng, chúng ta có thể xem liệu một thuộc tính có tồn tại trong đối tượng hay không bằng cách kiểm tra xem property !== undefined.

Tôi hy vọng bạn thích bài viết này và chúc may mắn trên hành trình phát triển của bạn.