[Setiap Terobosan] Bagaimana untuk menentukan sama ada sifat wujud dalam JavaScript

Mukadimah

Dalam pembangunan JavaScript, kita selalunya perlu menentukan sama ada sifat wujud dalam objek.
Oleh kerana JavaScript adalah bahasa yang agak longgar, sukar untuk kita melakukan sesuatu yang lebih ketat. Sebagai contoh, terdapat masalah dalam definisi "sama ada atribut wujud" dalam JavaScript Bilakah ia wujud dan bilakah ia dikira sebagai tidak wujud? Tidak ada jawapan yang betul atau salah, tetapi dalam konteks yang berbeza dan keperluan pembangunan yang berbeza, maksud "kewujudan" adalah berbeza.
Di sini saya akan bercakap tentang lima kaedah penghakiman yang biasa digunakan dan masalahnya.

Kaedah 1: Penghakiman Boolean

Ini contoh:

const obj1 = { name: 'Andy', age: 21 }
const obj2 = { name: 'Alice' }

console.log( obj1.age ? '存在' : '不存在' ); // 存在
console.log( obj2.age ? '存在' : '不存在' ); // 不存在

Mari kita bincangkan dahulu tentang kelemahan kaedah ini
Jika:

const obj = { name: 'Baby', age: 0 }

console.log( obj.age ? '存在' : '不存在' ); // 不存在

Dalam kes ini, umur sepatutnya "wujud", tetapi ia akan dinilai sebagai "tidak wujud".

Jadi kaedah ini tidak boleh digunakan?
Ini bergantung kepada keperluan pembangunan perniagaan.
Jika anda tahu bahawa dalam keperluan pembangunan perniagaan anda, atribut ini tidak boleh 0, rentetan kosong, NaN, undefined, dsb., maka pertimbangan ini masih boleh dilaksanakan.
Jika anda meletakkannya dalam persekitaran yang lebih ketat, maka kaedah ini akan mempunyai kelemahan.

Kaedah 2: Rangkaian pilihan (?.) dan semakan tidak ditentukan

Mari kita beri contoh dahulu:

const obj1 = { name: 'Andy', age: 21 }
const obj2 = { name: 'Alice' }

console.log( obj1?.age !== undefined ? '存在' : '不存在' ); // 存在
console.log( obj2?.age !== undefined ? '存在' : '不存在' ); // 不存在

Logik perbandingan ini ialah dalam bahasa JS, nilai yang tidak wujud tidak ditentukan.

Tetapi dalam objek, situasi ini juga mungkin berlaku:

const obj = {
    name: 'Andy',
    age: undefined
}

Dalam kes ini, adakah atribut umur harus "wujud" atau "tidak wujud"?

Sukar untuk dikatakan, ia masih bergantung pada persekitaran permintaan khusus anda.

Kaedah 3: Cari Object.keys()

Jika saya katakan, saya perlu tahu sama ada terdapat umur atribut dalam objek, saya tidak kisah nilainya.

Kita boleh menggunakan kaedah ini:

const obj = { name: 'Andy', age: 21 }

console.log( Object.keys(obj).includes('age') ? '存在' : '不存在' ); // 存在

Gunakan Object.keys() untuk mendapatkan nama hartanya yang boleh dikira sendiri untuk penghakiman.

Terdapat dua kata kunci di sini, satu adalah "sendiri" dan satu lagi "terhitung".

Pertama, mari kita bercakap tentang apa itu "diri"

Sebagai contoh, terdapat objek di sini Tambahkan nama atribut pada objek:

const obj = { name: 'Andy' }
// `name` 就是 obj 自身的属性
console.log( Object.keys(obj) ); // [ 'name' ]

Jadi apakah yang bukan sifat itu sendiri? Di sinilah "prototaip" dimainkan. Objek mempunyai prototaip, dan atribut yang ditambahkan pada prototaip bukanlah atribut "sendiri".

const obj = Object.create( { type: 'human' } );
obj.name = 'Andy';

console.log( obj.name ); // Andy
console.log( obj.type ); // human
console.log( Object.keys(obj) ); // [ 'name' ]

Dalam contoh ini, bagaimana anda menentukan sama ada jenis ialah atribut obj? Ini sukar untuk dikatakan, bukan? Anda boleh mengatakan ya atau tidak. Ini adalah masalah yang disebabkan oleh persekitaran bahasa yang santai.

Tetapi apa yang anda perlu tahu ialah dalam kes ini, Object.keys() tidak boleh mendapatkan sifat pada prototaip. Kerana ia hanya boleh membaca sifat "sendiri".

Yang kedua ialah, "terhitung"

Deskriptor atribut disebut di sini Ramai rakan sekerja saya tidak tahu bahawa dalam bahasa JS, dalam objek, setiap atribut mempunyai deskriptor.
Bagaimana cara membacanya? Mari cetak dan lihat:

const obj1 = { name: 'Andy', age: 21 }
const obj2 = { name: 'Alice' }

console.log( obj1.age ? '存在' : '不存在' ); // 存在
console.log( obj2.age ? '存在' : '不存在' ); // 不存在

Anda akan mendapati bahawa deskriptor ini sebenarnya adalah objek, yang menerangkan beberapa maklumat tentang atribut ini, seperti nilai, boleh ditulis dan ini (boleh dikira) terbilang ...

Enumerable ini mentakrifkan atribut itu dan sama ada ia boleh dibilang sebagai contoh, atribut ini boleh dibaca semasa for...in loop, dan perkara yang sama berlaku untuk Object.keys().

Jika saya mentakrifkan semula sifat sebagai tidak boleh dikira, maka Object.keys() tidak boleh membaca sifat ini.

const obj = { name: 'Baby', age: 0 }

console.log( obj.age ? '存在' : '不存在' ); // 不存在

Ini melibatkan pengetahuan tentang deskriptor atribut Ini adalah pengetahuan yang sangat penting tentang bahasa JS asli, dan saya mendapati bahawa ramai pengaturcara hadapan yang saya kenali tidak mempunyai pengetahuan tentang JS asli.

Jadi bagaimana jika atribut yang anda ingin nilai hanya perlu menjadi atributnya sendiri, tidak kira sama ada ia boleh dikira atau tidak? Kemudian anda tidak boleh menggunakan Object.keys(). Anda boleh menggunakan kaedah berikut.

Kaedah 4: Gunakan Object.hasOwn() atau hasOwnProperty()

Apakah perbezaan antara Object.hasOwn() dan hasOwnProperty()?

Object.hasOwn() ialah kaedah yang ditambahkan dalam ES2022, yang digunakan untuk menyemak sama ada objek itu sendiri mempunyai sifat tertentu dan digunakan untuk menggantikan pemprosesan pengoptimuman hasOwnProperty. Memandangkan kaedah ini telah ditambahkan kemudian, keserasian masih menjadi isu Jika anda hanya mempertimbangkan versi baharu penyemak imbas, ia masih boleh digunakan.

Kedua-dua kaedah ini menentukan nama atribut "sendiri" , jadi ia boleh dibaca tanpa mengira sama ada ia boleh dikira atau tidak.

const obj1 = { name: 'Andy', age: 21 }
const obj2 = { name: 'Alice' }

console.log( obj1?.age !== undefined ? '存在' : '不存在' ); // 存在
console.log( obj2?.age !== undefined ? '存在' : '不存在' ); // 不存在

Mengapa menggunakan Object.hasOwn(), kerana hasOwnProperty() objek boleh diubah suai:

const obj = {
    name: 'Andy',
    age: undefined
}

Jika nama atribut yang anda ingin nilai tidak perlu menjadi miliknya dan boleh dikira, prototaip juga boleh diterima, maka kaedah terakhir harus digunakan.

Kaedah 5: dalam operator

in digunakan untuk menentukan sama ada sesuatu sifat wujud dalam objek atau rantai prototaipnya.

const obj = { name: 'Andy', age: 21 }

console.log( Object.keys(obj).includes('age') ? '存在' : '不存在' ); // 存在

ringkaskan

Kaedah ini tidak menyatakan kaedah mana yang betul atau yang mana salah. Tidak setiap senario sesuai untuk pendekatan yang sama, mematuhi amalan terbaik bergantung pada situasi untuk meningkatkan kebolehbacaan dan keselamatan kod.

Atas ialah kandungan terperinci [Setiap Terobosan] Bagaimana untuk menentukan sama ada sifat wujud dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!