टाइपस्क्रिप्ट: दो वर्गों का विस्तार कैसे करें?

Question 1

मैं अपना समय बचाना चाहता हूं और PIXI कक्षाओं (एक 2d webGl रेंडरर लाइब्रेरी) तक फैली कक्षाओं में आम कोड का पुन: उपयोग करना चाहता हूं।

ऑब्जेक्ट इंटरफेस:

module Game.Core {
    export interface IObject {}

    export interface IManagedObject extends IObject{
        getKeyInManager(key: string): string;
        setKeyInManager(key: string): IObject;
    }
}

मेरा मुद्दा यह है कि कोड अंदर है getKeyInManagerऔर setKeyInManagerनहीं बदलेगा और मैं इसका पुन: उपयोग करना चाहता हूं, इसे डुप्लिकेट नहीं करना है, यहां कार्यान्वयन है:

export class ObjectThatShouldAlsoBeExtended{
    private _keyInManager: string;

    public getKeyInManager(key: string): string{
        return this._keyInManager;
    }

    public setKeyInManager(key: string): DisplayObject{
        this._keyInManager = key;
        return this;
    }
}

मैं जो करना चाहता हूं वह स्वचालित रूप से जोड़ना है, एक के माध्यम से Manager.add(), प्रबंधक का उपयोग वस्तु के अंदर वस्तु को अपनी संपत्ति में संदर्भित करने के लिए किया जाता है _keyInManager।

तो, चलो एक बनावट के साथ एक उदाहरण लेते हैं। यहाँ जाता हैTextureManager

module Game.Managers {
    export class TextureManager extends Game.Managers.Manager {

        public createFromLocalImage(name: string, relativePath: string): Game.Core.Texture{
            return this.add(name, Game.Core.Texture.fromImage("/" + relativePath)).get(name);
        }
    }
}

जब मैं करता हूं this.add(), तो मुझे उस Game.Managers.Manager add()विधि को कॉल करने की विधि चाहिए जो उस वस्तु पर मौजूद होगी जो उसके द्वारा लौटा दी गई है Game.Core.Texture.fromImage("/" + relativePath)। यह वस्तु, इस मामले में Texture:

module Game.Core {
    // I must extends PIXI.Texture, but I need to inject the methods in IManagedObject.
    export class Texture extends PIXI.Texture {

    }
}

मुझे पता है कि IManagedObjectएक इंटरफ़ेस है और इसमें कार्यान्वयन नहीं हो सकता है, लेकिन मुझे नहीं पता कि ObjectThatShouldAlsoBeExtendedमेरी Textureकक्षा के अंदर कक्षा को इंजेक्ट करने के लिए क्या लिखना है । यह जानते हुए कि एक ही प्रक्रिया के लिए आवश्यक होगा Sprite, TilingSprite, Layerऔर अधिक।

मुझे यहां एक अनुभवी टाइपस्क्रिप्ट फीडबैक / सलाह की आवश्यकता है, इसे करना संभव है, लेकिन एक से अधिक विस्तार से नहीं, क्योंकि उस समय केवल एक ही संभव है, मुझे कोई अन्य समाधान नहीं मिला।

Question 2

टाइपस्क्रिप्ट में एक छोटी ज्ञात विशेषता है जो आपको मिक्सिन्स को फिर से उपयोग करने योग्य छोटी वस्तुओं को बनाने के लिए उपयोग करने की अनुमति देता है। आप कई इनहेरिटेंस का उपयोग करके बड़ी वस्तुओं में इनकी रचना कर सकते हैं (कई वंशानुक्रम वर्गों के लिए अनुमति नहीं है, लेकिन यह मिश्रण के लिए अनुमति दी जाती है - जो एक संबंधित निहितार्थ के साथ इंटरफेस की तरह हैं)।

टाइपस्क्रिप्ट मिक्सिन्स पर अधिक जानकारी

मुझे लगता है कि आप अपने खेल में कई वर्गों के बीच सामान्य घटकों को साझा करने के लिए और अपने खेल में एकल वर्ग से इनमें से कई घटकों का फिर से उपयोग करने के लिए इस तकनीक का उपयोग कर सकते हैं:

यहाँ एक त्वरित मिक्सिंस डेमो है ... सबसे पहले, फ्लेवर जिसे आप मिश्रण करना चाहते हैं:

class CanEat {
    public eat() {
        alert('Munch Munch.');
    }
}

class CanSleep {
    sleep() {
        alert('Zzzzzzz.');
    }
}

फिर मिक्सिन निर्माण के लिए जादू की विधि (आपको अपने कार्यक्रम में केवल एक बार इसकी आवश्यकता है ...)

function applyMixins(derivedCtor: any, baseCtors: any[]) {
    baseCtors.forEach(baseCtor => {
        Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
             if (name !== 'constructor') {
                derivedCtor.prototype[name] = baseCtor.prototype[name];
            }
        });
    }); 
}

और फिर आप मिक्सिन फ्लेवर से कई विरासत के साथ कक्षाएं बना सकते हैं:

class Being implements CanEat, CanSleep {
        eat: () => void;
        sleep: () => void;
}
applyMixins (Being, [CanEat, CanSleep]);

ध्यान दें कि इस वर्ग में कोई वास्तविक कार्यान्वयन नहीं है - बस इसे "इंटरफेस" की आवश्यकताओं को पूरा करने के लिए पर्याप्त है। लेकिन जब हम इस वर्ग का उपयोग करते हैं - यह सब काम करता है।

var being = new Being();

// Zzzzzzz...
being.sleep();

Question 3

मैं वहां वर्णित नए मिश्रणों के दृष्टिकोण का उपयोग करने का सुझाव दूंगा: https://blogs.msdn.microsoft.com/typescript/2017/02/22/announcing-typescript-2-2/

फेंटन द्वारा वर्णित "अप्लाईमिक्सिन" दृष्टिकोण की तुलना में यह दृष्टिकोण बेहतर है, क्योंकि ऑटोकंपेलर आपको आधार और द्वितीय वंशानुक्रम वर्गों से सभी विधियों / गुणों को दिखाने में मदद करेगा।

इस दृष्टिकोण को टीएस प्लेग्राउंड साइट पर जांचा जा सकता है ।

यहाँ कार्यान्वयन है:

class MainClass {
    testMainClass() {
        alert("testMainClass");
    }
}

const addSecondInheritance = (BaseClass: { new(...args) }) => {
    return class extends BaseClass {
        testSecondInheritance() {
            alert("testSecondInheritance");
        }
    }
}

// Prepare the new class, which "inherits" 2 classes (MainClass and the cass declared in the addSecondInheritance method)
const SecondInheritanceClass = addSecondInheritance(MainClass);
// Create object from the new prepared class
const secondInheritanceObj = new SecondInheritanceClass();
secondInheritanceObj.testMainClass();
secondInheritanceObj.testSecondInheritance();

Question 4

दुर्भाग्य से टाइपस्क्रिप्ट एकाधिक वंशानुक्रम का समर्थन नहीं करता है। इसलिए पूरी तरह से तुच्छ जवाब नहीं है, आपको संभवतः अपने कार्यक्रम का पुनर्गठन करना होगा

यहां कुछ सुझाव दिए गए हैं:

यदि इस अतिरिक्त वर्ग में वह व्यवहार होता है जो आपके कई उपवर्ग साझा करते हैं, तो यह समझ में आता है कि इसे कक्षा पदानुक्रम में डाला जाए, कहीं शीर्ष पर। शायद आप इस वर्ग से स्प्राइट, बनावट, परत, ... के आम सुपरक्लास को प्राप्त कर सकते हैं? यह एक अच्छा विकल्प होगा, यदि आप प्रकार के पदानुक्रम में एक अच्छा स्थान पा सकते हैं। लेकिन मैं इस वर्ग को एक यादृच्छिक बिंदु पर सम्मिलित करने की सिफारिश नहीं करूंगा। वंशानुक्रम "इज ए - रिलेशनशिप" को व्यक्त करता है उदाहरण के लिए एक कुत्ता एक जानवर है, एक बनावट इस वर्ग का एक उदाहरण है। आपको अपने आप से पूछना होगा, अगर यह वास्तव में आपके कोड में वस्तुओं के बीच संबंध को मॉडल करता है। एक तार्किक वंशानुक्रम वृक्ष बहुत मूल्यवान है
यदि अतिरिक्त वर्ग तार्किक रूप से पदानुक्रम में फिट नहीं होता है, तो आप एकत्रीकरण का उपयोग कर सकते हैं। इसका मतलब है कि आप स्प्राइट, टेक्सचर, लेयर के एक सामान्य सुपरक्लास में इस वर्ग के प्रकार का एक इंस्टेंस वेरिएबल जोड़ते हैं, ... फिर आप सभी उपवर्गों में इसके गेटटर / सेटर के साथ वेरिएबल को एक्सेस कर सकते हैं। यह मॉडल "एक है - संबंध" है।
आप अपनी कक्षा को एक इंटरफ़ेस में भी बदल सकते हैं। तब आप अपने सभी वर्गों के साथ इंटरफ़ेस का विस्तार कर सकते थे, लेकिन प्रत्येक कक्षा में सही तरीके से तरीकों को लागू करना होगा। इसका मतलब है कुछ कोड अतिरेक लेकिन इस मामले में ज्यादा नहीं।

आपको अपने लिए तय करना होगा कि आपको कौन सा तरीका पसंद है। व्यक्तिगत रूप से मैं कक्षा को एक इंटरफ़ेस में बदलने की सिफारिश करूंगा।

एक टिप: टाइपस्क्रिप्ट गुण प्रदान करता है, जो गेटर्स और सेटर के लिए सिंटैक्टिक चीनी हैं। आप इसे देख सकते हैं: http://blogs.microsoft.co.il/gilf/2013/01/22/creating-properties-in-typescript/

Question 5

टाइपस्क्रिप्ट डेकोरेटर का समर्थन करता है , और उस सुविधा का उपयोग करते हुए एक छोटी सी लाइब्रेरी जिसे टाइपस्क्रिप्ट-मिक्स कहा जाता है, आप सिर्फ एक दो लाइनों के साथ कई वंशानुक्रमों के मिश्रण का उपयोग कर सकते हैं

// The following line is only for intellisense to work
interface Shopperholic extends Buyer, Transportable {}

class Shopperholic {
  // The following line is where we "extend" from other 2 classes
  @use( Buyer, Transportable ) this 
  price = 2000;
}

Question 6

मुझे लगता है कि बहुत बेहतर दृष्टिकोण है, जो ठोस प्रकार-सुरक्षा और मापनीयता के लिए अनुमति देता है।

पहले घोषणा करें कि आप अपने लक्ष्य वर्ग पर लागू करना चाहते हैं:

interface IBar {
  doBarThings(): void;
}

interface IBazz {
  doBazzThings(): void;
}

class Foo implements IBar, IBazz {}

अब हमें कार्यान्वयन को Fooवर्ग में जोड़ना होगा । हम वर्ग मिश्रणों का उपयोग कर सकते हैं जो इन इंटरफेस को भी लागू करते हैं:

class Base {}

type Constructor<I = Base> = new (...args: any[]) => I;

function Bar<T extends Constructor>(constructor: T = Base as any) {
  return class extends constructor implements IBar {
    public doBarThings() {
      console.log("Do bar!");
    }
  };
}

function Bazz<T extends Constructor>(constructor: T = Base as any) {
  return class extends constructor implements IBazz {
    public doBazzThings() {
      console.log("Do bazz!");
    }
  };
}

Fooवर्ग मिश्रण के साथ कक्षा बढ़ाएँ :

class Foo extends Bar(Bazz()) implements IBar, IBazz {
  public doBarThings() {
    super.doBarThings();
    console.log("Override mixin");
  }
}

const foo = new Foo();
foo.doBazzThings(); // Do bazz!
foo.doBarThings(); // Do bar! // Override mixin

Question 7

एक बहुत ही घिनौना उपाय उस वर्ग के माध्यम से लूप होगा जिसे आप नए पैरेंट क्लास में एक-एक करके फ़ंक्शंस को जोड़ना चाहते हैं

class ChildA {
    public static x = 5
}

class ChildB {
    public static y = 6
}

class Parent {}

for (const property in ChildA) {
    Parent[property] = ChildA[property]
}
for (const property in ChildB) {
    Parent[property] = ChildB[property]
}


Parent.x
// 5
Parent.y
// 6

सब के सब गुण ChildAऔर ChildBअब से पहुँचा जा सकता Parentवर्ग है, लेकिन वे जिसका अर्थ है कि आप इस तरह के रूप में चेतावनी प्राप्त होगा नहीं पहचाना जाएगाProperty 'x' does not exist on 'typeof Parent'

Question 8

डिजाइन पैटर्न में एक सिद्धांत है जिसे "विरासत पर रचना का पक्ष" कहा जाता है। यह कहता है कि क्लास ए से क्लास बी को विरासत में लेने के बजाय, क्लास ए के अंदर क्लास ए का एक प्रॉपर्टी के रूप में उदाहरण दें और फिर आप क्लास ए के वर्ग बी के कार्यात्मकता का उपयोग कर सकते हैं। आप इसके कुछ उदाहरण देख सकते हैं। यहां और यहां के ।

Question 9

मुझे अप-टू-डेट और अद्वितीय समाधान मिला: https://www.npmjs.com/package/ts-mixer

Question 10

यहां पहले से ही बहुत सारे अच्छे उत्तर हैं, लेकिन मैं सिर्फ एक उदाहरण के साथ दिखाना चाहता हूं कि आप विस्तारित की जा रही कक्षा में अतिरिक्त कार्यक्षमता जोड़ सकते हैं;

function applyMixins(derivedCtor: any, baseCtors: any[]) {
    baseCtors.forEach(baseCtor => {
        Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
            if (name !== 'constructor') {
                derivedCtor.prototype[name] = baseCtor.prototype[name];
            }
        });
    });
}

class Class1 {
    doWork() {
        console.log('Working');
    }
}

class Class2 {
    sleep() {
        console.log('Sleeping');
    }
}

class FatClass implements Class1, Class2 {
    doWork: () => void = () => { };
    sleep: () => void = () => { };


    x: number = 23;
    private _z: number = 80;

    get z(): number {
        return this._z;
    }

    set z(newZ) {
        this._z = newZ;
    }

    saySomething(y: string) {
        console.log(`Just saying ${y}...`);
    }
}
applyMixins(FatClass, [Class1, Class2]);


let fatClass = new FatClass();

fatClass.doWork();
fatClass.saySomething("nothing");
console.log(fatClass.x);