Với giải pháp này, bạn sẽ vượt qua if (typeof user.settings.theme !=== 'undefined') { // your property exists }1. Tuy nhiên, bạn có thể thấy rằng nếu đối tượng của bạn được lồng sâu, việc kiểm tra từng cấp độ, sẽ nhanh chóng khiến câu lệnh không thể đọc được
Sử dụng toán tử trong
Điều này cũng sẽ trả về một giá trị boolean
if ('theme' in user.settings) { // your property exist } trong. js
Đã sao chép vào khay nhớ tạm. Sao chép
Một lần nữa, vấn đề với giải pháp này là nó giả định rằng if (typeof user.settings.theme !=== 'undefined') { // your property exists }0 là một đối tượng. Nếu không, chúng tôi nhận được một if (typeof user.settings.theme !=== 'undefined') { // your property exists }1
Sử dụng phương thức hasOwnProperty
Cũng giống như toán tử if (typeof user.settings.theme !=== 'undefined') { // your property exists }5, toán tử này giả định sự tồn tại của if (typeof user.settings.theme !=== 'undefined') { // your property exists }0 và chỉ có thể được sử dụng một cách đáng tin cậy nếu chúng ta có một đối tượng cấp độ duy nhất
if (user.settings.hasOwnProperty('theme')) { // your property exist } hasOwnProperty. js
Đã sao chép vào khay nhớ tạm. Sao chép
Sử dụng chuỗi tùy chọn
Không giống như các ví dụ trước, phương pháp này cung cấp giải pháp cho cha mẹ không tồn tại
if (user?.settings?.theme) { // your property exist } xâu chuỗi tùy chọn. js
Đã sao chép vào khay nhớ tạm. Sao chép
Ngay cả khi if (typeof user.settings.theme !=== 'undefined') { // your property exists }0 không phải là một đối tượng, nó sẽ không gây ra lỗi. Tuy nhiên, cũng có một nhược điểm của việc này. Theo , giải pháp này chỉ được hỗ trợ trong ~78% trình duyệt khi viết giải pháp này. Vì vậy, bạn không nên sử dụng nó trong môi trường sản xuất. Đảm bảo rằng bạn có tùy chọn dự phòng nếu chọn tùy chọn này
Phần thưởng - Sử dụng toán tử xác nhận không null trong TypeScript
Nếu bạn đang sử dụng TypeScript, bạn có thể sử dụng toán tử xác nhận không null để kiểm tra sự tồn tại của các thuộc tính. Điều này hoạt động giống như chuỗi tùy chọn và sẽ ngăn chặn if (typeof user.settings.theme !=== 'undefined') { // your property exists }1s
if ('theme' in user.settings) { // your property exist } 0 khẳng định không rỗng. js
Đã sao chép vào khay nhớ tạm. Sao chép
Tìm cách để cải thiện kỹ năng của bạn?
Đâu là sự khác biệt giữa in và hasOwnProperty?
Điều quan trọng là phải biết sự khác biệt giữa if (typeof user.settings.theme !=== 'undefined') { // your property exists }5 và if ('theme' in user.settings) { // your property exist } 20. Nếu cần kiểm tra các thuộc tính kế thừa, bạn cần sử dụng toán tử if (typeof user.settings.theme !=== 'undefined') { // your property exists }5 . Nếu không, bạn cũng có thể sử dụng if ('theme' in user.settings) { // your property exist } 20 cũng được. Để nhấn mạnh sự khác biệt giữa hai loại này, hãy xem ví dụ mã sau
if ('theme' in user.settings) { // your property exist } 5 in-vs-hasOwnProperty. js
Đã sao chép vào khay nhớ tạm. Sao chép
Cách làm việc với các đối tượng an toàn với lỗi
Ngoài ra, hãy nhớ xem cách bạn có thể khắc phục lỗi thuộc tính lồng sâu một cách an toàn và cách lặp qua một đối tượng bằng cách nhấp vào một trong hai mẹo bên dưới