تمديد الصفوف

تُستخدم الكلمة الرئيسية extends في إعلانات الفئة أو التعبيرات لإنشاء فئة تعمل كفئة فرعية لفئة أخرى، مع الفئة الأصل (أحيانًا تسمى "الفئة الأساسية") وهي بمثابة النموذج الأولي للفئة الفرعية (أحيانًا تسمى "الفئة الفرعية" أو "فئة مشتقة").

class ParentClass {}
class ChildClass extends ParentClass {}

Object.getPrototypeOf( ChildClass );
> class ParentClass {}

ترث هذه الفئات الفرعية خصائص الفئة الرئيسية وطرقها. هذا النمط تتيح لك توسيع الوظائف الأساسية لفئةٍ ما لتقديم بيانات أكثر تحديدًا دون تحميل الفئة الرئيسية لتناسب كل حالة استخدام ممكنة، أو إعادة تنفيذ رمز يخدم غرضًا مشابهًا.

يمكن للفئات الفرعية أن تقدم آليات تنفيذ خاصة بها للطرق الموروثة من صف رئيسي:

class MyClass {
  constructor( myPassedValue ) {
    this.instanceProp = myPassedValue;
  }
  classMethod() {
    console.log( `The value was '${ this.instanceProp }.'`)
  }
}
class ChildClass extends MyClass {
  classMethod() {
    console.log( `The value was '${ this.instanceProp },' and its type was '${ typeof this.instanceProp }.'`)
  }
}

const myParentClassInstance = new MyClass( "My string." );
const mySubclassInstance = new ChildClass( 100 );

myParentClassInstance.classMethod();
> "The value type was 'string.'"

mySubclassInstance.classMethod();
> "The value was '100,' and its type was 'number.'"

ويمكنك أيضًا استدعاء الطرق المحددة في الفئة الرئيسية في سياق صف ثانوي باستخدام super:

class MyClass {
  constructor( myPassedValue ) {
    this.instanceProp = myPassedValue;
  }
  classMethod() {
    console.log( `The value was '${ this.instanceProp }.'`)
  }
}

class ChildClass extends MyClass {
  subclassMethod() {
    super.classMethod();
    console.log( `The value type was '${ typeof this.instanceProp }.'`)
  }
}
const mySubclassInstance = new ChildClass( 100 );

mySubclassInstance.subclassMethod();
> The value was '100.'
> The value type was 'number.'

كما هو موضّح في الأمثلة السابقة، عند حذف طريقة constructor() في سياق فئة فرعية، تستدعي الدالة الإنشائية الضمنية في JavaScript العنصر الأصل الدالة الإنشائية مع نفس مجموعة الوسيطات. ومع ذلك، إذا كان هناك في الفئة الفرعية، يجب استدعاء الدالة super() أولاً مع أي الوسيطات الضرورية قبل الإشارة إلى this.

class MyClass {
  constructor( myPassedValue ) {
    this.instanceProp = myPassedValue;
  }
  classMethod() {
    console.log( `The value was '${ this.instanceProp }.'`)
  }
}

class ChildClass extends MyClass {
    constructor( myPassedValue ) {
        super( myPassedValue );
        this.modifiedProp = myPassedValue + 50;
    }\
    subclassMethod() {
        super.classMethod();
        console.log( `The value type was '${ typeof this.instanceProp }.'`)
    }
}
const mySubclassInstance = new ChildClass( 100 );

mySubclassInstance;
> MyClass { instanceProp: 100, modifiedProp: 150 }

تُعد دوال Gets وsets طرق خاصة تُستخدم حصريًا لاسترداد البيانات وتحديدها على التوالي. تتيح الطرق المحدّدة باستخدام الكلمتَين الرئيسيتَين get وset تنفيذ ما يلي: يمكنك إنشاء طرق يمكن التفاعل معها كما لو كانت ثابتة المواقع.

class MyClass {
    constructor( originalValue ) {
        this.totalValue = 0;
    }
    set doubleThisValue( newValue ) {
        this.totalValue = newValue * 2;
    }
    get currentValue() {
        console.log( `The current value is: ${ this.totalValue }` );
    }
}
const myClassInstance = new MyClass();

myClassInstance;
> MyClass { totalValue: 0 }

myClassInstance.doubleThisValue = 20;

myClassInstance.currentValue;
> The current value is: 40

يتم تحديد الخاصيتين get وset على خاصية النموذج الأولي للفئة، وبالتالي تكون متاحة لجميع مثيلات الفئة.

التحقق من فهمك

اختَر العبارات الصحيحة حول الفئات التي تم إنشاؤها باستخدام الكلمة الرئيسية extends.

وهو يعمل كفرع للفئة التي تتمدد.

تكتسب خصائص وأساليب الفئة الرئيسية.

وهو بمثابة أصل للفئة التي تتم مدها.

It can't overwrite methods from a parent class.