مفاهیم پایه جاوا اسکریپت - آبجکت

در قسمت دوم آموزش مفاهیم پایه جاوا اسکریپت، مبحث نوع های داده ای (Data Types) در جاوا اسکریپت را مطرح کردم و سپس درباره جزئیات انواع داده ای اصلی/مقداری صحبت کردم. در این پست انواع داده ای ارجاعی را خدمت شما دوستان عزیزم معرفی خواهم کرد و از بین آن ها نوع داده ای آبجکت را در ادامه همین پست و مابقی آن ها را در پست های بعدی تشریح خواهم نمود.

انواع داده ای ارجاعی (Reference Types) در جاوا اسکریپت کدامند؟

• آبجکت ها (Objects)
• آرایه ها (Arrays)
• توابع (Functions)

آبجکت (Object) چیست؟

مفهوم آبجکت (شیء) در جاوا اسکریپت و نیز در سایر زبان های برنامه نویسی دقیقا مشابه مفهوم شیء در دنیای واقعی است. یک شخص نوعی را در نظر بگیرید. هر شخصی دارای نام، سن، آدرس و ... است. این متغیرها همگی خصوصیات یک شخص هستند. همین مفهوم را عینا در برنامه نویسی هم داریم. وقتی راجع به چندین متغیر به هم مرتبط صحبت می کنیم می توانیم آن متغیرها را داخل یک مجموعه واحد به نام آبجکت قرار دهیم.

مثال:

let name = 'Ali';
let age = 30;

در مثال بالا دو تا متغیر به هم مرتبط را می بینید که خصوصیات یک شخص نوعی را تعریف می کنند. هر جا که یک سری متغیر به هم مرتبط دیدیم می توانیم آن متغیرها را در قالب یک آبجکت تعریف کنیم و بعد از آن به جای ارجاع به متغیرهای مختلف، فقط به آن آبجکت ارجاع دهیم. با این کار کدی که می نویسیم هم ساده تر و هم گویاتر خواهد شد. برای شروع ابتدا یک متغیر به نام person تعریف می کنم و آن را برابر با مقدار یک آبجکت خالی قرار می دهم:

let person = { }

گرامر (Syntax)-ایکه در بالا برای تعریف آبجکت person استفاده کردم را اصطلاحا Object Literal می نامند. حالا می توانیم بین دو کمانک یک یا چند جفت کلید-مقدار (Key-Value Pair) قرار دهیم. به هر کلید اصطلاحا یک Property می گویند. این کلیدها در حقیقت همان متغیرها هستند:

let person = {
     name: 'Ali',
     age: 30
}

همانطور که مشاهده می کنید جفت های کلید-مقدار را با ویرگول از هم جدا می کنیم.همچنین بعد از کلید باید کاراکتر : و سپس مقدار متناظر آن نوشته شود.

از آبجکت person یک لاگ بگیرید و خروجی را در کنسول مرورگر مشاهده کنید:

console.log(person);

خواهید دید که آبجکت person به صورت مقداری یا همان object literal در خروجی کنسول ثبت خواهد شد:

چگونه مقدار property-های یک آبجکت را تغییر دهیم یا بخوانیم؟

برای کار کردن با property های یک آبجکت دو روش وجود دارد:

• Dot Notation

در این روش برای دسترسی به یک property از یک آبجکت خاص، ابتدا نام آن آبجکت سپس کاراکتر نقطه و بعد از آن نام property مورد نظر را می نویسیم. مثلا فرض کنید که بخواهیم مقدار خصوصیت name در آبجکت person را تغییر دهیم:

person.name = 'Hassan';

برای خواندن مقدار یک property هم از همان روش بالا استفاده می کنیم:

console.log(person.name);

• Bracket Notation

در این روش برای دسترسی به یک property از یک آبجکت خاص، ابتدا نام آن آبجکت سپس یک جفت قلاب باز و بسته می نویسیم بعد از آن نام property مورد نظر را به صورت یک رشته (string) داخل قلاب باز و بسته درج می کنیم. مثال:

person['name'] = 'Hossein';

برای خواندن مقدار یک property هم به همان روش بالا عمل می کنیم:

console.log(person['name']);

نکته: رشته ایکه به عنوان property داخل قلاب باز و بسته می نویسیم را می توانیم مابین کاراکترهای ' ' یا کاراکترهای " " قرار دهیم. مرسوم آنست که رشته را مابین کاراکترهای ' ' قرار دهیم.

کدام روش برای کار کردن با property-های یک آبجکت بهتر است؟

روش Dot Notation دقیق تر و کوتاه تر است و انتخاب پیش فرض شما هم باید همین روش باشد. اما روش Bracket Notation هم کاربردهای خاص خود را دارد. حالت هایی هست که تا زمان اجرا (Runtime) نام property آبجکت موردنظرمان مشخص نیست لذا در این حالت نمی توانیم برای دسترسی به آن property از روش Dot Notation استفاده کنیم. مثلا فرض کنید که Property را کاربر باید در واسط کاربری برنامه انتخاب کند پس ما نمی توانیم قبل از زمان اجرا و در سطح کدنویسی به آن دسترسی داشته باشیم چرا که قرار است آن Property در زمان اجرا و توسط کاربر انتخاب شود. به عنوان نمونه در نظر بگیرید که متغیری به نام selection داریم که property انتخابی توسط کاربر را در آن ذخیره می کنیم و این مقدار در زمان اجرا مشخص می شود:

let selection = 'name'; 

در چنین مواقعی به صورت پویا با استفاده از روش Bracket Notation می توانیم بدان دسترسی پیدا کنیم:

person[selection] = 'Hadi';

در صورتیکه با وجود توضیحات بالا، همچنان موضوع برایتان گنگ است نگران نباشید در آینده که تجربه ی بیشتری در برنامه نویسی با جاوا اسکریپت کسب نمودید با مثال های بیشتری مواجه خواهید شد. اما برای سادگی کار می توانید تا نیاز نشده از همان روش Dot Notation استفاده کنید که هم ساده تر است و هم گویاتر.

در مقاله بعدی فصل دوم دوره آموزش جاوا اسکریپت برای مبتدی ها، به موضوع زیر خواهیم پرداخت :

• مفاهیم پایه جاوا اسکریپت - آرایه