Typescript: Définir la classe et ses méthodes dans des fichiers séparés
-
13-12-2019 - |
Question
est-il possible de déclarer une classe dans un fichier et de définir ses méthodes dans des fichiers séparés?
J'ai des classes avec
La solution
Solution de contournement : Vous pouvez définir une interface contenant des membres pour la classe et deux classes différentes implémentant cette interface. Ensuite, mélangez les propriétés d'une classe à l'autre, pour faire une classe combinée. Par exemple:
largeclass.a.ts
interface LargeClass {
methodA(): string;
methodB(): string;
}
class LargeA implements LargeClass {
methodA: () => string; // not implemented, needed since otherwise we don't extend LargeClass
methodB() {
return "Hello world";
}
}
largeclass.b.ts
class LargeB implements LargeClass {
methodA() {
return "Foo";
}
methodB: () => string; // not implemented, needed since otherwise we don't extend LargeClass
}
usage.ts
// Using underscore's extend to copy implementation from A to B
var c:LargeClass = _.extend(new LargeA(), new LargeB());
// Manually mixing in a to b
var a = new LargeA();
var b:LargeClass = new LargeB();
for (var prop in a) {
b[prop]=a[prop];
}
Cela ne fonctionnera pas si vous avez besoin de constructeurs pour la classe, cependant. Et vraiment c'est sous-optimal ... Solution de contournement non plus :)
OH, d'ailleurs, cela fonctionne parce que Thypscript n'émet pas de déclarations de type de propriété / champ unitalisé pour les classes - il ne les utilise que pour la vérification de type.
Je réalise également que vous pouvez le faire sans interfaces et la construction de la classe de manière plus jolie ... Je vais laisser comment faire cela comme un exercice aux lecteurs pour l'instant ...
Autres conseils
Vous pouvez importer vos fonctions à partir d'autres fichiers que la classe elle-même
Voici l'exemple du fichier de classe:
import {func1, func2, func3} from "./functions"
class MyClass {
public foo: string = "bar"
public func1 = func1.bind(this)
public func2 = func2.bind(this)
public func3 = func3.bind(this)
}
Voici l'exemple d'un fichier de fonction:
import {MyClass} from "./MyClass"
export function func1(this: MyClass, param1: any, param2: any){
console.log(this.foo)
...
}