TIPSIPT: Defina la clase y sus métodos en archivos separados.

Question

¿Es posible declarar una clase en un archivo y definir sus métodos en archivos separados?

Tengo algunas clases con mucho de métodos y sería genial si pudiera extenderlos un poco.

Answer 1

Respuesta corta: Typescript no admite dividir una definición de clase en varios archivos.

solución : podría definir una interfaz que contiene miembros para la clase, y dos clases diferentes que implementan esa interfaz. Luego, mezclar las propiedades de una clase a la otra, para hacer una clase combinada. Por ejemplo:

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];
}

Esto no funcionará si necesita constructores para la clase, sin embargo. Y realmente es subóptimo ... Solución, sin embargo, menos :)

Oh, por cierto, esto funciona porque TypeScript no emiten declaraciones de tipo de propiedad / campo unitialized para las clases: solo las usa para verificar el tipo.

También me doy cuenta de que puede hacerlo sin interfaces y solo la construcción de la clase de una manera más bonita ... Dejaré cómo hacerlo como un ejercicio a los lectores por ahora ...

Answer 2

Puede importar sus funciones de otros archivos que la clase en sí misma

Aquí está el ejemplo del archivo de clase:

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)
}

Aquí está el ejemplo de un archivo de función:

import {MyClass} from "./MyClass"

export function func1(this: MyClass, param1: any, param2: any){
   console.log(this.foo)
   ...
} 

IMPORTANTE Nota: Asegúrese de que cada función exportada no sea una función de flecha porque no puede hacer enlazar (esto) en una función de flecha