35- آموزش جاوااسکریپت | آموزش وراثت پروتوتایپی (Prototypal Inheritance)

در این بخش، می‌خواهیم یکی از مفاهیم کلیدی برنامه‌نویسی شی‌گرا در جاوااسکریپت، یعنی وراثت پروتوتایپی (Prototypal Inheritance) را بررسی کنیم. اگر از زبان‌هایی مثل Java یا C# به جاوااسکریپت آمده باشید، احتمالاً به وراثت مبتنی بر کلاس عادت دارید. اما در جاوااسکریپت ES5، سیستم وراثت از طریق «زنجیره پروتوتایپ» انجام می‌شود.

در این آموزش، یک سازنده (Constructor) به نام Person ایجاد می‌کنیم و سپس یک سازنده Customer می‌سازیم که از پروتوتایپ Person ارث‌بری کند.

۱. ایجاد سازنده والد (Person)

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

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

// تعریف متد در پروتوتایپ والد
Person.prototype.greeting = function() {
  return `Hello there ${this.firstName} ${this.lastName}`;
};

۲. ایجاد سازنده فرزند (Customer)

سازنده Customer باید علاوه بر ویژگی‌های Person (نام و نام خانوادگی)، ویژگی‌های خاص خودش (شماره تلفن و نوع عضویت) را نیز داشته باشد. برای ارث‌بری ویژگی‌ها از والد، از متد .call() استفاده می‌کنیم.

function Customer(firstName, lastName, phone, membership) {
  // فراخوانی سازنده والد
  Person.call(this, firstName, lastName);
  
  this.phone = phone;
  this.membership = membership;
}

۳. ارث‌بری پروتوتایپ

فقط فراخوانی سازنده کافی نیست. برای اینکه Customer به متدهای موجود در Person.prototype دسترسی داشته باشد، باید پروتوتایپ آن را با استفاده از Object.create به پروتوتایپ Person متصل کنیم.

// ارث‌بری پروتوتایپ
Customer.prototype = Object.create(Person.prototype);

۴. اصلاح سازنده (Constructor)

پس از انجام مرحله قبل، ویژگی constructor در پروتوتایپ Customer به Person اشاره می‌کند که اشتباه است. باید آن را به صورت دستی اصلاح کنیم تا به خود Customer اشاره کند.

// بازگرداندن سازنده به حالت صحیح
Customer.prototype.constructor = Customer;

اکنون اگر یک نمونه از Customer بسازیم، به متد greeting که در Person تعریف شده بود، دسترسی خواهیم داشت:

const customer1 = new Customer('Tom', 'Smith', '555-5555', 'Standard');

console.log(customer1.greeting()); 
// خروجی: Hello there Tom Smith

۵. بازنویسی (Override) متدها

شما می‌توانید متدهای ارث‌بری شده را در شیء فرزند بازنویسی کنید. اگر بخواهید متد greeting برای مشتری‌ها رفتار متفاوتی داشته باشد، کافی است آن را مستقیماً روی Customer.prototype تعریف کنید:

Customer.prototype.greeting = function() {
  return `Hello there ${this.firstName} ${this.lastName}, welcome to our company!`;
};

console.log(customer1.greeting());
// خروجی: Hello there Tom Smith, welcome to our company!

با این کار، متد جدید جایگزین متد والد می‌شود، اما سایر متدهایی که در Person وجود دارند و در Customer بازنویسی نشده‌اند، همچنان در دسترس خواهند بود. این یکی از قدرت‌های وراثت پروتوتایپی است که اجازه می‌دهد در عین ارث‌بری، قابلیت‌های جدید یا اختصاصی برای اشیاء فرزند ایجاد کنیم.