بررسی وجود یک property (ویژگی) در object در جاوااسکریپت

بررسی وجود یک property (ویژگی) در object در جاوااسکریپت

حتما تابحال پیش اومده که خواسته باشیم وجود یک property رو در یک object بررسی کنیم. در این مقاله یاد میگیریم چطور این کار رو انجام بدیم.

متد ()hasOwnProperty

همه‌ی objectهای جاوااسکریپت متدی به نام object.hasOwnProperty('myProperty') دارن که اسم property مورد نظر رو به عنوان آرگومان ورودی دریافت میکنه و یک مقدار Boolean رو با توجه به وجود داشتن یا نداشتن property مورد نظر درون object برمی‌گردونه.

در مثال زیر با استفاده از این متد، وجود دو property به نام‌های name و realName رو بررسی میکنیم:

const hero = {
    name: 'Batman'
};

hero.hasOwnProperty('name');     // => true
hero.hasOwnProperty('realName'); // => false

همون‌طور که میبینیم، متد ()hasOwnProperty برای name مقدار true و برای realName مقدار false برمی‌گردونه چون object مورد نظر property به نام realName نداره.

با کمی توجه به اسم متد یعنی ()hasOwnProperty متوجه میشیم که این متد وجودِ property رو در میان ویژگی‌های خودِ شیء (own properties) بررسی میکنه. منظور از ویژگی‌های خودِ شیء، propertyهایی هستن که مستقیماً بر روی خودِ object تعریف میشن. به همین خاطر، این متد، propertyهای به ارث رسیده رو تشخیص نمیده. به تکه کدی که در ادامه قرار میدم دقت کنید:

const hero = {
    name: 'Batman'
};

hero.toString; // => function() {...}
hero.hasOwnProperty('toString'); // => false

toString یک property به ارث رسیده یا inherited هست؛ بنابراین وقتی با متد بالا وجود اون رو چک میکنیم مقدار false دریافت میکنیم.

اپراتورِ in

اپراتورِ in یکی دیگه از راه‌های تشخیص وجود یک property در object هست. در ادامه نحوه استفاده از اون رو در قالب یک مثال یاد میگیریم. فرض کنید قصد داریم وجود دو ویژگی name و  realName رو در شیء hero بررسی کنیم:

const hero = {
    name: 'Batman'
};

'name' in hero;     // => true
'realName' in hero; // => false

همون‌طور که میبینیم، ویژگی hero در شیء مورد نظرمون وجود داره و مقدار true هم برگردونده میشه.

اما چون ویژگی realName وجود نداره پس مقدار دریافتی ما false هست.

استفاده از این اپراتور، سینتکس کوتاهی داره و من استفاده از اون رو به hasOwnProperty ترجیح میدم. تفاوت اصلی بین متد hasOwnProperty و اپراتورِ in در این نکته هست که دومی هم ویژگی‌های خود شیء و هم ویژگی‌های به ارث رسیده رو بررسی میکنه. این یعنی بر خلاف مثالی که در قسمت مربوط به متد hasOwnProperty زدیم، این اپراتور میتونه وجود toString رو هم تشخیص بده:

const hero = {
    name: 'Batman'
};

hero.toString; // => function() {...}
hero.hasOwnProperty('toString'); // => false
'toString' in hero;              // => true

مقایسه با undefined

اگر بخواهیم به یک property که در object وجود نداره دسترسی داشته باشیم، نتیجه undefined خواهد بود.

const hero = {
    name: 'Batman'
};

hero.name;     // => 'Batman'
hero.realName; // => undefined

خب حالا ما یک راه جدید پیدا کردیم! ما این امکان رو داریم که به وسیله‌ی مقایسه با undefined وجود یک property در شیء رو بررسی کنیم.

const hero = {
    name: 'Batman'
};

hero.name !== undefined;     // => true
hero.realName !== undefined; // => false

بررسی وجود name مقدار true رو برمی‌گردونه که نشون‌دهنده وجود این ویژگی در شیء موردنظر ما هست؛ بر خلاف realName که وجود نداره و مطابق انتظار مقدار false رو دریافت کردیم.

اما باید در نظر داشته باشیم که این روش، غیرحرفه‌ای و به نوعی dirty code هست. علاوه بر اون، در استفاده از این روش احتیاط کنید! اگر property درون شیء موردنظر وجود داشته باشه اما مقدار اون undefined باشه، استفاده از این روش یعنی مقایسه با undefined به اشتباه مقدار false رو برمی‌گردونه. به این مثال دقت کنید:

const hero = {
    name: undefined
};

hero.name !== undefined; // => false

در حالیکه ویژگی name درون شیء وجود داره، به این دلیل که مقدار اون undefined هست، در جواب تست مقدار false رو دریافت کردیم (انگار که چنین ویژگی‌ای درون شیء وجود نداره) که این اشتباهه. پس تا جای ممکن از این روش استفاده نکنید مگر با احتیاط.

 

امیدوارم این آموزش براتون مفید بوده باشه. شما چه روش‌های دیگه ای برای بررسی وجود یک ویژگی در شیء میشناسید؟ برامون بنویسید.

از بهترین نوشته‌های کاربران سکان آکادمی در سکان پلاس


online-support-icon