Cara memeriksa sama ada objek kosong di JavaScript

Artikel ini dengan cepat akan menerangkan bagaimana untuk memeriksa sama ada objek kosong di JavaScript.

Dalam pembangunan JavaScript harian, anda mungkin perlu menyemak sama ada objek itu kosong. Jika anda pernah melakukan ini, anda mungkin tahu tiada penyelesaian langsung tunggal. Walau bagaimanapun, anda boleh menggunakan teknik yang berbeza untuk membuat penyelesaian tersuai yang sesuai dengan kes penggunaan anda sendiri. Di samping itu, jika anda menggunakan perpustakaan utiliti JavaScript dalam projek anda, perpustakaan mungkin telah menyediakan cara terbina dalam untuk memeriksa sama ada objek itu kosong.

Kaedah Moden (ES5)

Dalam bahagian ini, kami akan membincangkan kaedah yang berbeza yang boleh anda gunakan dalam pelayar moden yang menyokong versi ES5.

1. Kaedah Object.keys() mengembalikan pelbagai nama atribut penghitungan objek yang diberikan. Oleh itu, kita boleh menyemak sama ada objek mempunyai sebarang sifat dengan mengira panjang array ini.

Mari lihat contoh berikut.

 fungsi isemptyObject (obj) {
    kembali object.keys (obj) .length === 0;
}

Console.log (isemptyObject ({}));

var bar = {"foo": "1"};
console.log (object.keys (bar) .length);
Console.log (isemptyObject (bar));

Seperti yang ditunjukkan dalam contoh di atas, atribut foo dilampirkan, jadi fungsi isEmptyObject akan mengembalikan fungsi isEmptyObject dengan nilai yang berbeza.

Perhatikan bahawa isEmptyObject akan kembali true untuk objek REGEXP.

 Console.log (isemptyObject (date.now ()));
Console.log (isemptyObject (baru regexp ()));

Juga, berhati -hati kerana kaedah ini dipanggil dengan nilai yang tidak ditentukan. Mereka boleh menyebabkan pengecualian. Kemudian, kami akan membuat penyelesaian peluru yang tidak gagal pada input kosong.

 Console.log (isemptyObject (null));

2. Object.getOwnPropertyNames() Kaedah Mengembalikan pelbagai sifat objek yang diberikan. Walaupun ia mungkin kelihatan sama seperti kaedah Object.keys() , kaedah Object.getOwnPropertyNames() juga menganggap sifat yang tidak dapat dipertikaikan, manakala Object.keys() merindui beberapa sifat yang diisytiharkan tidak dapat dipertahankan.

Mari lihat contoh berikut.

 fungsi isemptyObject (obj) {
    kembali objek.getownPropertyNames (OBJ) .length === 0;
}

Console.log (isemptyObject ({}));

var bar = {"foo": "1"};
Console.log (Object.GetownPropertyNames (bar) .length);
Console.log (isemptyObject (bar));

Seperti yang anda lihat, gunakan Object.keys() untuk menguji nilai null.

Walau bagaimanapun, kes kelebihannya sedikit berbeza - Date , tetapi untuk null atau JSON.stringify akan kembali false .

Gunakan {} untuk memeriksa sama ada objek yang diberikan kosong.

Mari lihat contoh berikut.

 fungsi isemptyObject (obj) {
    kembali json.stringify (obj) === '{}';
}

Console.log (isemptyObject ({}));

var bar = {"foo": "1"};
Console.log (json.stringify (bar));
Console.log (isemptyObject (bar));

Sekali lagi, keadaan kelebihan sedikit berbeza. "1651283138454" digunakan dalam regexp. Jadi gunakan Object.getOwnPropertyNames kaedah!

 console.log (isemptyObject (date.now ()));
Console.log (isemptyObject (baru regexp ()));

Satu lagi perubahan adalah false , yang mungkin bukan apa yang anda harapkan.

 Console.log (isemptyObject (null));

4. Object.entries() Kaedah Mengembalikan pelbagai tatasusunan, setiap elemen adalah pelbagai pasang nilai utama objek objek.

Mari lihat contoh berikut untuk memahami bagaimana ia berfungsi dengan tepat.

 fungsi isemptyObject (obj) {
    pulangan objek.entries (obj) .length === 0;
}

Console.log (isemptyObject ({}));

var bar = {"foo": "1"};
console.log (object.entries (bar));
console.log (object.entries (bar) .length);
Console.log (isemptyObject (bar));

Seperti yang anda dapat lihat, kaedah Object.keys() akan memberikan hasil yang sama untuk contoh kes EDGE Objek RegEXP kami. Untuk input yang tidak ditentukan, ia juga melemparkan pengecualian.

 Console.log (isemptyObject (date.now ()));
Console.log (isemptyObject (baru regexp ()));

Penyelesaian peluru

Satu masalah dengan penyelesaian mudah yang disebutkan di atas ialah mereka memberikan hasil yang tidak konsisten untuk kes kelebihan: objek khas (seperti tarikh), nilai yang tidak ditentukan, atau primitif (seperti integer). Ini adalah penyelesaian yang mudah tetapi lebih dipercayai.

 fungsi isEmptyObject (nilai) {
  Jenis Const = Nilai Typeof
  const isObject = value! = null && type === 'Object'
  kembali isObject && object.keys (nilai) .length === 0;
}

Kaedah ini dilakukan dengan tepat dengan namanya: ia mengembalikan true jika dan hanya jika nilai input adalah objek dan objek kosong. Ia akan berfungsi dengan nilai null dan undefined kembali false kerana mereka bukan objek. Untuk objek khas seperti regexp, ia akan kembali true kerana mereka tidak menentukan sebarang kunci khas. Ia juga kembali true untuk tatasusunan kosong dan false untuk tatasusunan yang tidak kosong.

Rancangan sebelumnya ES5

Dalam bahagian ini, kami akan membincangkan penyelesaian yang berfungsi walaupun dalam pelayar yang lebih tua. Kaedah ini sering digunakan sebelum era JavaScript ES5, apabila tiada kaedah terbina dalam untuk memeriksa sama ada objek kosong.

Mari lihat contoh berikut.

 fungsi isemptyObject (obj) {
    untuk (var harta dalam obj) {
        jika (obj.hasownProperty (harta)) {
            kembali palsu;
        }
    }

    kembali benar;
}

Console.log (isemptyObject ({}));
Console.log (isemptyObject ({"foo": "1"}));

Dalam contoh di atas, kami membina fungsi tersuai yang boleh anda panggil untuk memeriksa sama ada objek itu kosong. Ia menerima parameter, dan anda perlu lulus objek untuk diuji. Dalam palsu, jika tidak, kami akan mengembalikan fungsi isEmptyObject dengan nilai yang berbeza. Seperti yang ditunjukkan dalam contoh di atas, kami memanggilnya dengan nilai yang berbeza dan merekodkan output menggunakan kaedah isEmptyObject , yang membolehkan anda menyemak sama ada objek itu kosong.

Mari kita lihat dengan cepat contoh di bawah.

 jQuery.isemptyObject ({});
jQuery.isemptyObject ({"foo": "1"});

Seperti yang anda lihat, menggunakan _.isEmpty() sangat mudah.

kesimpulannya

Dalam artikel ini, kami membincangkan beberapa cara yang berbeza untuk memeriksa sama ada objek kosong dalam JavaScript. Semak tutorial kami yang lain mengenai pengaturcaraan JavaScript!

Siaran ini telah dikemas kini dengan sumbangan Neema Muganga.

Atas ialah kandungan terperinci Cara memeriksa sama ada objek kosong di JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!