Prototype و متدهای ES5 در اشیاء جاوا اسکریپتی

Javascript Prototypes

0 74

با سلام و عرض ادب خدمت شما همراهان روکسو، در این قسمت با مفهومی آشنا می شویم که شاید از دید اکثر برنامه نویسان مبتدی و بعضا حرفه ای دور مانده باشد و آن مبحث prototype ها است. سپس به معرفی برخی از متدهای جدید در ECMAScript 5 می پردازیم چرا که بسیار به درد بخور و مفید هستند.

prototype چیست؟

prototype در لغت به معنی «نمونه ی اولیه» است. در واقع تمام اشیاء جاوا اسکریپتی متدها و خصوصیات خود را از یک prototype به ارث می برند. این prototype ها همانطور که از نامشان مشخص است نمونه ی اولیه و طرح کلی برای دسته ای از اشیاء هستند.

اگر یادتان باشد در جلسه ی قبل در رابطه با object constructor ها صحبت کردیم و مثال زیر را برایتان آوردیم:

مشاهده ی خروجی در JSBin

اگر یادتان باشد به شما گفتیم که نمی توانیم property (خصوصیت) های دلخواه خود را به constructor اضافه کنیم و کد زیر غلط از آب در می آمد:

بلکه باید آن را به شکل دستی به خودِ تابعِ constructor اضافه می کردیم:

این مثال ها را در ذهن داشته باشید تا در ادامه از آن ها استفاده کنیم.

ارث بری از prototype

همانطور که گفتیم تمام اشیاء جاوا اسکریپتی متدها و خصوصیات خود را از یک prototype به ارث می برند اما مشخص نکردیم از کدام prototype:

  • Date ها از Date.prototype ارث بری می کنند.
  • Array ها از  Array.prototype ارث بری می کنند.
  • Person ها (همان مثال خودمان) از  Person.prototype ارث بری می کنند.

بنابراین قانون کلی به این شکل است که یک شیء از Object.prototype ارث بری دارد.

مثال های استفاده از prototype

حالا که در مورد prototype اطلاعات کسب کردیم باید بدانید می توانیم از طریق آن به تابعِ constructor دسترسی داشته باشیم.

در این مثال می خواهیم با استفاده از prototype  یک خصوصیت (property) جدید ایجاد کنیم که در شیء ما وجود نداشته است.

مشاهده ی خروجی در JSBin

همانطور که مشخص است به راحتی خصوصیت nationality را اضافه کردیم.

برای اضافه کردن متدها نیز به همین شیوه عمل می کنیم:

مشاهده ی خروجی در JSBin

هشدار: تنها prototype های خودتان را تغییر دهید! به هیچ عنوان به prototype های پیش فرض جاوا اسکریپت و اشیاء استاندارد آن دست نزنید چرا که تمام برنامه بهم خواهد ریخت.

متدهای جدید در ECMAScript 5

در ECMAScript 5 متدهای جدیدی برای کار با اشیاء معرفی شدند. ما میخواهیم با مهم ترینشان آشنا شویم:

در کدهای بالا توضیحات را به صورت مثال آورده ام که می توانید مطالعه کنید اما چند مورد از کدهای بالا را در یک مثال بررسی می کنیم تا با نحوه ی کارشان آشنا شوید.

تغییر مقدارِ یک خصوصیت

ساختار کلی کد به این شکل است:

property به معنی خصوصیت و value به معنی مقدار (یعنی مقدارِ آن خصوصیت) است. به طور مثال:

تغییر metadata ها

تغییر متادیتاها به شکل زیر است:

برای هر کدام مقدار False هم داریم که برعکس توضیحات بالا خواهد بود.

دریافت تمام خصوصیت ها

برای دریافت تمام خصوصیت های یک شیء می توانیم به این شکل عمل کنیم:

تعریف Getter و Setter

در قسمت های قبلی با مبحث Getter و Setter آشنا شدیم اما باید بدانید می توانید با ()Object.defineProperty نیز آن ها را تعریف کنید:

امیدوارم از این قسمت لذت برده باشید. این قسمت، قسمت پایانی اشیاء بود و در قسمت بعد به سراغ توابع جاوا اسکریپت می رویم. پس از بحث در مورد توابع جاوا اسکریپت (به صورت پیشرفته) مستقیما به سراغ دسترسی به DOM و BOM خواهیم رفت. اصل استفاده ی جاوا اسکریپت در این زمینه است بنابراین پیشنهاد می کنم آن را از دست ندهید.

ترتیبی که روکسو برای یادگیری مطالب سری جاوا اسکریپت پیشرفته به شما توصیه می‌کند:

ارسال نظر

توجه:‌ آدرس ایمیل شما منتشر نخواهد شد.