آموزش رایگان جاوا اسکریپت (JavaScript)

مفاهیم پیشرفته در کلاس‌ها و وراثت (Super, Extends) در جاوا اسکریپت: راهنمای کامل و مثال‌ها

1403/07/29 20:25 محراب حسن زاده
مفاهیم پیشرفته در کلاس‌ها و وراثت (Super, Extends) در جاوا اسکریپت: راهنمای کامل و مثال‌ها

در جاوا اسکریپت، کلاس‌ها و وراثت (Inheritance) ابزارهای قدرتمندی برای برنامه‌نویسی شیءگرا هستند که به شما این امکان را می‌دهند تا ساختارهای پیچیده‌ای از اشیاء را با استفاده از اصول شیءگرا طراحی کنید. با استفاده از کلمات کلیدی extends و super، می‌توانید کلاس‌های جدیدی بسازید که از کلاس‌های دیگر ارث‌بری می‌کنند و ویژگی‌ها و متدهای آن‌ها را گسترش دهند. در این مقاله، به بررسی مفاهیم پیشرفته در کلاس‌ها و وراثت خواهیم پرداخت.

 

مقدمه‌ای بر کلاس‌ها و وراثت در جاوا اسکریپت

کلاس‌ها در جاوا اسکریپت از زمان ES6 به زبان اضافه شده‌اند و به شما این امکان را می‌دهند که شیءها و توابع را به صورت سازمان‌یافته‌تری مدیریت کنید. وراثت (Inheritance) یکی از اصول کلیدی برنامه‌نویسی شیءگرا است که به شما این امکان را می‌دهد که ویژگی‌ها و رفتارهای کلاس‌های موجود را به کلاس‌های جدید منتقل کنید و آن‌ها را گسترش دهید.

 

تعریف کلاس‌ها با استفاده از class

کلاس‌ها در جاوا اسکریپت با استفاده از کلمه کلیدی class تعریف می‌شوند. یک کلاس می‌تواند شامل سازنده (constructor)، متدها و ویژگی‌ها باشد.

 

ساختار کلی کلاس


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

  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

const ali = new Person('Ali', 30);
ali.greet(); // Output: Hello, my name is Ali and I am 30 years old.

 

در این مثال:

  • کلاس Person دارای یک سازنده و یک متد greet است.

  • سازنده برای تنظیم خصوصیات name و age استفاده می‌شود.

 

وراثت با استفاده از extends

با استفاده از کلمه کلیدی extends، می‌توانید یک کلاس جدید را از کلاس موجود به ارث ببرید و ویژگی‌ها و متدهای آن را گسترش دهید.

 

ساختار وراثت


class Animal {
  constructor(name) {
    this.name = name;
  }

  speak() {
    console.log(`${this.name} makes a noise.`);
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // فراخوانی سازنده کلاس پایه
    this.breed = breed;
  }

  bark() {
    console.log(`${this.name} barks.`);
  }
}

const myDog = new Dog('Rex', 'Golden Retriever');
myDog.speak(); // Output: Rex makes a noise.
myDog.bark();  // Output: Rex barks.

 

در این مثال:

  • کلاس Dog از کلاس Animal ارث می‌برد و از ویژگی‌ها و متدهای آن استفاده می‌کند.

  • سازنده کلاس Dog با استفاده از super(name)، سازنده کلاس پایه را فراخوانی می‌کند تا خصوصیت name را تنظیم کند.

  • متد bark به کلاس Dog اضافه شده است.

 

ستفاده از super

کلمه کلیدی super برای دسترسی به متدها و سازنده‌های کلاس پایه (پدر) از داخل کلاس فرزند (پسر) استفاده می‌شود.

 

فراخوانی سازنده کلاس پایه


class Person {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, my name is ${this.name}.`);
  }
}

class Student extends Person {
  constructor(name, studentId) {
    super(name); // فراخوانی سازنده کلاس پایه
    this.studentId = studentId;
  }

  greet() {
    super.greet(); // فراخوانی متد پایه
    console.log(`My student ID is ${this.studentId}.`);
  }
}

const student = new Student('Ali', '12345');
student.greet();
// Output:
// Hello, my name is Ali.
// My student ID is 12345.

 

در این مثال:

  • سازنده کلاس Student از super(name) برای فراخوانی سازنده کلاس Person استفاده می‌کند.

  • متد greet در کلاس Student با استفاده از super.greet() متد پایه را فراخوانی می‌کند و سپس پیغام دیگری را چاپ می‌کند.

 

استفاده از super برای فراخوانی متدهای پایه


class Shape {
  constructor(name) {
    this.name = name;
  }

  area() {
    return 0;
  }
}

class Rectangle extends Shape {
  constructor(name, width, height) {
    super(name);
    this.width = width;
    this.height = height;
  }

  area() {
    return this.width * this.height;
  }

  describe() {
    console.log(`The area of the ${this.name} is ${super.area()}.`);
    console.log(`The actual area of the ${this.name} is ${this.area()}.`);
  }
}

const rectangle = new Rectangle('rectangle', 5, 10);
rectangle.describe();
// Output:
// The area of the rectangle is 0.
// The actual area of the rectangle is 50.

 

در این مثال:

  • متد describe در کلاس Rectangle از super.area() برای دسترسی به متد area کلاس پایه استفاده می‌کند.

 

مدیریت وراثت چندگانه

جاوا اسکریپت به طور مستقیم از وراثت چندگانه (وراثت از چندین کلاس) پشتیبانی نمی‌کند. اما با استفاده از مفاهیم دیگر مانند میکسین‌ها (Mixins) می‌توانید ویژگی‌های مشابهی را پیاده‌سازی کنید.

 

استفاده از میکسین‌ها

میکسین‌ها به شما این امکان را می‌دهند که ویژگی‌ها و متدها را از چندین منبع به یک کلاس اضافه کنید.

مثال: استفاده از میکسین‌ها


const Flyer = {
  fly() {
    console.log(`${this.name} is flying.`);
  }
};

const Swimmer = {
  swim() {
    console.log(`${this.name} is swimming.`);
  }
};

class Superhero {
  constructor(name) {
    this.name = name;
  }
}

// افزودن میکسین‌ها به کلاس
Object.assign(Superhero.prototype, Flyer, Swimmer);

const hero = new Superhero('Superman');
hero.fly();  // Output: Superman is flying.
hero.swim(); // Output: Superman is swimming.

 

در این مثال:

  • دو میکسین Flyer و Swimmer تعریف شده‌اند.

  • با استفاده از Object.assign, متدهای این میکسین‌ها به پروتوتایپ کلاس Superhero اضافه شده‌اند.

 

نکات و تکنیک‌های پیشرفته

استفاده از متدهای استاتیک

متدهای استاتیک به متدهایی اطلاق می‌شود که به خود کلاس تعلق دارند و نه به نمونه‌های آن.


class MathUtils {
  static add(a, b) {
    return a + b;
  }

  static multiply(a, b) {
    return a * b;
  }
}

console.log(MathUtils.add(2, 3)); // Output: 5
console.log(MathUtils.multiply(2, 3)); // Output: 6

 

استفاده از Getter و Setter

Getters و Setters به شما این امکان را می‌دهند که ویژگی‌های کلاس را به صورت خصوصی و قابل کنترل نگه دارید.


class Circle {
  constructor(radius) {
    this._radius = radius;
  }

  get radius() {
    return this._radius;
  }

  set radius(value) {
    if (value > 0) {
      this._radius = value;
    } else {
      console.log('Radius must be positive.');
    }
  }

  get area() {
    return Math.PI * this._radius * this._radius;
  }
}

const circle = new Circle(5);
console.log(circle.area); // Output: 78.53981633974483
circle.radius = 10;
console.log(circle.area); // Output: 314.1592653589793

 

نتیجه‌گیری

کلاس‌ها و وراثت در جاوا اسکریپت ابزارهای قدرتمندی برای طراحی برنامه‌های شیءگرا هستند. با استفاده از کلمه‌های کلیدی extends و super, می‌توانید کلاس‌های جدیدی بسازید که از کلاس‌های دیگر ارث‌بری می‌کنند و ویژگی‌ها و رفتارهای آن‌ها را گسترش دهید. درک و استفاده از این مفاهیم پیشرفته به شما این امکان را می‌دهد که برنامه‌های پیچیده‌تر و مقیاس‌پذیرتری بنویسید و اصول شیءگرایی را به طور مؤثر پیاده‌سازی کنید.

پرسش و پاسخ

نظری یافت نشد

مطالب مشابه

آموزش جامع Session در PHP به زبان ساده + پروژه عملی شبیه‌ساز
1405/05/01 20:07

آموزش جامع Session در PHP به زبان ساده + پروژه عملی شبیه‌ساز

مطالعه بیشتر
آموزش کامل دستور switch-case در PHP (به همراه مثال‌های کاربردی)
1405/04/04 00:08

آموزش کامل دستور switch-case در PHP (به همراه مثال‌های کاربردی)

مطالعه بیشتر
استفاده از clip-path در CSS برای برش‌های زیبا و جذاب: راهنمای کامل
1403/08/16 22:58

استفاده از clip-path در CSS برای برش‌های زیبا و جذاب: راهنمای کامل

مطالعه بیشتر
آموزش HTML: اولین گام برای طراحی سایت و سئو حرفه‌ای
1402/05/18 00:00

آموزش HTML: اولین گام برای طراحی سایت و سئو حرفه‌ای

مطالعه بیشتر
راهنمای کامل جداول HTML: آموزش ساخت و بهینه‌سازی سئو
1402/05/21 23:26

راهنمای کامل جداول HTML: آموزش ساخت و بهینه‌سازی سئو

مطالعه بیشتر
آشنایی با Vue CLI و ایجاد پروژه‌های پیشرفته در Vue.js | راهنمای کامل
1404/09/29 21:09

آشنایی با Vue CLI و ایجاد پروژه‌های پیشرفته در Vue.js | راهنمای کامل

مطالعه بیشتر
نصب Node.js و Create React App: شروع پروژه‌های React.js به‌صورت آسان
1402/06/28 01:09

نصب Node.js و Create React App: شروع پروژه‌های React.js به‌صورت آسان

مطالعه بیشتر
آموزش ساخت یک گالری تصویر با استفاده از جاوا اسکریپت: راهنمای گام به گام
1403/08/03 16:57

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

مطالعه بیشتر
راهنمای جامع قوانین نام‌گذاری متغیرها در PHP بر اساس استاندارد گوگل
1405/03/24 00:57

راهنمای جامع قوانین نام‌گذاری متغیرها در PHP بر اساس استاندارد گوگل

مطالعه بیشتر
الگوهای رایج برنامه‌نویسی ناهمگام در جاوا اسکریپت: Promise.race، Promise.all، و Promise.any کامل و مثال‌ها
1403/08/01 19:08

الگوهای رایج برنامه‌نویسی ناهمگام در جاوا اسکریپت: Promise.race، Promise.all، و Promise.any کامل و مثال‌ها

مطالعه بیشتر
آموزش جامع اعتبارسنجی اطلاعات فرم در PHP طبق استانداردهای امنیتی گوگل
1405/04/27 22:17

آموزش جامع اعتبارسنجی اطلاعات فرم در PHP طبق استانداردهای امنیتی گوگل

مطالعه بیشتر
آموزش جامع خواندن و نوشتن فایل متنی در PHP (به زبان ساده)
1405/05/04 23:17

آموزش جامع خواندن و نوشتن فایل متنی در PHP (به زبان ساده)

مطالعه بیشتر

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