پروتوتایپ‌ها در جاوااسکریپت از وراثت (inheritance) استفاده می‌کنند. در اصل، هر کلاس در جاوااسکریپت یک شیء پروتوتایپی (prototype object) دارد که ویژگی‌ها و روش‌های مربوط به آن کلاس را تعریف می‌کند. به عبارت دیگر، پروتوتایپ‌ها ساختار مشابهی با شیء‌های کلاسیک دارند اما به صورت غیر قابل تغییر و در دسترس هستند.

زمانیکه ما در برنامه خود نیاز به ارث بری داریم، این کار در جاوا اسکریپت بیشتر از طریق prototype انجام می شود و نه مثل اکثر زبان ها با class! هر object در جاوا اسکریپت فقط یک prototype دارد.

در ادامه یک نمونه معروف از استفاده از پروتوتایپ‌ها در جاوااسکریپت را بررسی می‌کنیم.

تعریف یک کلاس به نام Person با استفاده از تابع سازنده:

//(constructor function)// function Person(name, age) { this.name = name; this.age = age; }

اضافه کردن متد sayHello به پروتوتایپ کلاس Person :

Person.prototype.sayHello = function() { console.log(`Hello, my name is ` + this.name + ` and I am ` + this.age + ` years old.`); }

ساخت یک شیء از کلاس Person :

var person1 = new Person(`parsa`, 30); var person2 = new Person(`arsam`, 5);

فراخوانی متد sayHello بر روی شیء‌های person1 و person2 :

person1.sayHello(); // خروجی: Hello, my name is parsa and I am 30 years old. person2.sayHello(); // خروجی: Hello, my name is arsam and I am 5 years old.

در کد بالا، ابتدا یک کلاس با نام Person با استفاده از تابع سازنده (constructor function) تعریف شده است. سپس، یک متد به نام sayHello به پروتوتایپ این کلاس اضافه می‌شود. در نهایت، دو شیء از کلاس Person ساخته شده و متد sayHello بر روی هر یک از این شیء‌ها فراخوانی می‌شود.

استفاده از پروتوتایپ‌ها در جاوااسکریپت به تعریف متدها و ویژگی‌ها در پروتوتایپ کلاس کمک می‌کند و میتوان این اعضا را به تمام شیء‌هایی که از آن کلاس ایجاد می‌شوند به اشتراک بگذارید.

آیا میدانید مدرسه پرنیان، کلاس طراحی سایت حرفه ای بصورت حضوری و مجازی برگزار میکند؟

کلیک کنید

اما …

وقتی property یک object را صدا می زنیم

برای مثال obj.name را داریم. ابتدا در obj دنبال name می گردد. اگر یافت نشد در prototype از obj به دنبال آن می گردد و اگر بود کال میکند و اگر نبود باز هم به صورت تکراری به سراغ prototype از prototype بعدی می رود تا در نهایت prototype دیگری وجود نداشته باشد و اگر پیدا نکرد خطا می دهد!

همان طور که مشخص هست شئ staff دارای greeting نیست اما ()staff.greeting اجرا شد بدون خطا!

دلیلش این بود که person را به عنوان prototype به staff دادیم پس از آن ارث بری کرد. یعنی بعد از اینکه توی staff این property وجود نداشت رفت و در person دنبال آن گشت و پیدا کرد.

اما چون تا قبل از es6 چیزی بنام __proto__ وجود ندارد میتوانید از ()Object.create استفاده کنید.

امیدواریم از این مقاله نهایت استفاده را برده باشید و آن را با دوستانتان به اشتراک بگذارید. تیم تولید محتوای مدرسه اینترنتی پرنیان این مقاله را تهیه کرده است.