الوراثة في TypeScript: extends وsuper وoverride

يرث صنف في TypeScript من صنف آخر باستخدام extends. يحصل الصنف الفرعي على كل حقول الأب وتوابعه، ويستدعي دالة بناء الأب بـ super(...)، ويمكنه إعادة تعريف التوابع، وتتحقق TypeScript من أن كل إعادة تعريف تبقى متوافقة مع أنواع الأب.

class Animal {
    constructor(public name: string) {}

    speak(): string {
        return `${this.name} makes a sound`;
    }
}

class Dog extends Animal {
    constructor(name: string, public breed: string) {
        super(name); // call the parent constructor first
    }

    override speak(): string {
        return `${super.speak()}: woof`; // call the parent method
    }
}

const rex = new Dog("Rex", "beagle");
console.log(rex.speak());          // Rex makes a sound: woof
console.log(rex);                  // Dog { name: 'Rex', breed: 'beagle' }
console.log(rex instanceof Animal); // true

هذه وراثة الأصناف في JavaScript (راجع الوراثة في JavaScript لسلسلة الـ prototype التي تقف خلفها). تضيف TypeScript فحوص الأنواع: يمكن إسناد Dog في أي موضع يُتوقع فيه Animal، ويتحقق المترجم من إعادة التعريف ومن استدعاء super.

إعادة تعريف التوابع

تابع الصنف الفرعي الذي يحمل الاسم نفسه يحل محل تابع الأب. ويجب أن يكون نوعه قابلًا للإسناد إلى نوع تابع الأب: معاملات مماثلة أو متوافقة، ونوع قيمة مُعادة مماثل أو أضيق. وإلا فأي كود يحمل Animal قد يستدعي التابع بوسائط لا يستطيع الصنف الفرعي التعامل معها.

class Formatter {
    format(value: number): string {
        return value.toString();
    }
}

class CurrencyFormatter extends Formatter {
    // Compatible: accepts more (number | bigint) and returns the same type.
    override format(value: number | bigint): string {
        return `$${value.toLocaleString("en-US")}`;
    }
}

const formatters: Formatter[] = [new Formatter(), new CurrencyFormatter()];
for (const f of formatters) console.log(f.format(1234567));
// 1234567
// $1,234,567

تغيير المعامل إلى value: string سيكون الخطأ TS2416: Property 'format' in type 'CurrencyFormatter' is not assignable to the same property in base type 'Formatter'. والحلقة توضح السبب: تستدعي format برقم على كل عنصر دون أن تعرف أي صنف فرعي لديها.

هناك ثغرة واحدة. تُقارن معاملات التوابع بشكل ثنائي التغاير (bivariant)، فإعادة التعريف التي تقبل نوعًا أضيق، مثل format(value: 1 | 2)، تُترجم رغم أن الحلقة قد تمرر إليها 1234567. أما أنواع القيم المُعادة فتُفحص بصرامة: إعادة number بدل string هي TS2416.

الكلمة المفتاحية override وnoImplicitOverride

تقول override إن «هذا العضو يحل محل عضو في الصنف الأساسي»، ويلزمك المترجم بذلك. إن لم يكن في الصنف الأساسي عضو كهذا (خطأ إملائي، أو تابع أعاد أحدهم تسميته في الأب) فهذا خطأ:

// This does not compile: the parent has no method called 'speek'.
class Animal {
    speak(): string {
        return "...";
    }
}

class Cat extends Animal {
    override speek(): string {
        return "meow";
    }
}

console.log(new Cat().speak());

index.ts(9,14): error TS4117: This member cannot have an 'override' modifier because it is not declared in the base class 'Animal'. Did you mean 'speak'?

دون override يُترجم هذا الخطأ الإملائي وتعيد speak() القيمة "..." بصمت. الكلمة المفتاحية لا تفيد إلا حيث تُكتب، لذلك فعّل noImplicitOverride في tsconfig.json. عندها يجب على كل تابع يعيد تعريف عضو أساسي أن يصرّح بذلك، ويكون speak() العادي في صنف فرعي الخطأ TS4114 (This member must have an 'override' modifier because it overrides a member in the base class 'Animal').

{
    "compilerOptions": {
        "strict": true,
        "noImplicitOverride": true
    }
}

noImplicitOverride ليس جزءًا من strict؛ عليك إضافته بنفسك. وتُحذف override من JavaScript المترجم.

الأعضاء protected في الأصناف الفرعية

الأعضاء private في الأب غير مرئية في الصنف الفرعي. أما الأعضاء protected فمرئية، وهذا سبب وجود protected: إنها الواجهة التي يقدمها الصنف الأب لأبنائه.

class Counter {
    protected count = 0;
    private log: string[] = [];

    increment(): void {
        this.count++;
        this.log.push(`now ${this.count}`);
    }
}

class StepCounter extends Counter {
    constructor(private step: number) {
        super();
    }

    override increment(): void {
        this.count += this.step - 1; // protected: allowed
        super.increment();
        // this.log is private to Counter: a compile error here
    }

    get value(): number {
        return this.count;
    }
}

const c = new StepCounter(5);
c.increment();
c.increment();
console.log(c.value); // 10

راجع معدّلات الوصول للقواعد الكاملة، بما فيها سبب عدم فرض private ولا protected وقت التشغيل.

إعادة تعريف حقل بنوع أضيق

كثيرًا ما يعرف الصنف الفرعي أن حقلًا يحمل شيئًا أكثر تحديدًا مما يقوله الأب. إعادة تعريفه بصيغة pet: Dog لها أثر وقت التشغيل مع حقول الأصناف الحديثة: يُهيَّأ حقل الصنف الفرعي بالقيمة undefined بعد عودة super()، فيمحو ما خزّنته دالة بناء الأب. وما لم تُسنده دالة بناء الصنف الفرعي مجددًا، تبلّغ TypeScript عن ذلك بالخطأ TS2612 (Property 'pet' will overwrite the base property in 'Home'). استخدم declare لتغيير النوع فقط:

class Animal {
    name = "pet";
}
class Dog extends Animal {
    bark(): string {
        return "woof";
    }
}

class Home {
    pet: Animal;
    constructor(pet: Animal) {
        this.pet = pet;
    }
}

class Kennel extends Home {
    declare pet: Dog; // type only: no field is emitted

    constructor(dog: Dog) {
        super(dog);
    }
}

console.log(new Kennel(new Dog()).pet.bark()); // woof

لا تولّد declare أي شيء، فتبقى القيمة التي ضبطتها دالة بناء Home. ودالة البناء التي لا تقبل إلا Dog هي ما يجعل النوع الأضيق صحيحًا.

implements مقابل extends

تجيب الكلمتان عن سؤالين مختلفين، ويمكن للصنف أن يستخدم الاثنتين.

interface Serializable {
    serialize(): string;
}

class Entity {
    constructor(readonly id: number) {}
}

class User extends Entity implements Serializable {
    constructor(id: number, readonly email: string) {
        super(id);
    }

    serialize(): string {
        return JSON.stringify({ id: this.id, email: this.email });
    }
}

const u = new User(1, "ada@example.com");
console.log(u.serialize()); // {"id":1,"email":"ada@example.com"}

يمكن للصنف أن يرث من صنف واحد فقط (TS1174: Classes can only extend a single class). لجمع سلوك من عدة مصادر، طبّق عدة interfaces وشارك الكود عبر التركيب (حقل يحمل كائنًا مساعدًا) أو الـ mixins.

الـ Mixins

الـ mixin دالة تأخذ صنفًا وتعيد صنفًا فرعيًا منه. تعطي شكلًا من الوراثة المتعددة يجتاز فحص الأنواع:

type Constructor<T = {}> = new (...args: any[]) => T;

function Timestamped<TBase extends Constructor>(Base: TBase) {
    return class extends Base {
        createdAt = new Date("2024-03-15T10:30:00Z");
    };
}

function Tagged<TBase extends Constructor>(Base: TBase) {
    return class extends Base {
        tags: string[] = [];
        tag(t: string): this {
            this.tags.push(t);
            return this;
        }
    };
}

class Note {
    constructor(public text: string) {}
}

const TaggedNote = Tagged(Timestamped(Note));
const n = new TaggedNote("buy milk").tag("home");
console.log(n.text, n.tags, n.createdAt.toISOString());
// buy milk [ 'home' ] 2024-03-15T10:30:00.000Z

النوع any[] في Constructor ضروري: لا تقبل TypeScript أساسًا لـ mixin إلا إذا كانت دالة بنائه تأخذ معامل rest واحدًا من النوع any[]. تعمل الـ mixins لكنها تجعل قراءة الأنواع وتتبعات المكدس أصعب، فابدأ بالتركيب أولًا.

أخطاء شائعة

• استدعاء تابع قابل لإعادة التعريف من دالة البناء الأساسية. تعمل دالة البناء الأساسية قبل تهيئة حقول الصنف الفرعي، فإعادة التعريف التي تقرأ this.items ترى undefined، واستدعاء مثل this.items.push(x) يرمي TypeError وقت التشغيل. لا تكتشف TypeScript ذلك.
• نسيان super(...) أو استدعاؤه متأخرًا. الخطآن TS2377 وTS17009؛ يجب أن يبني الأب الكائن قبل أن يلمس الصنف الفرعي this.
• إعادة تعريف حقل من الأب دون declare. يعيد حقل الصنف الفرعي ضبطه إلى undefined.
• الهرميات العميقة. كل مستوى يربط الابن بتفاصيل الأب الداخلية. مستويان يكفيان عادة؛ وبعد ذلك فضّل التركيب أو الـ interfaces.