Búsqueda de sitios web

javascript - ¿Cómo divido una clase de TypeScript en varios archivos?

Encontré muchos ejemplos y también intenté yo mismo dividir un módulo en varios archivos. Así que entiendo eso, muy útil. Pero también es práctico a veces dividir una clase por la misma razón. Digamos que tengo un par de métodos y no quiero amontonar todo en un archivo largo.

Estoy buscando algo similar a la declaración partial en C#.

Respuesta #1

Últimamente uso este patrón:

// file class.ts
import { getValue, setValue } from "./methods";

class BigClass {
    public getValue = getValue;
    public setValue = setValue;

    protected value = "a-value";
}

// file methods.ts
import { BigClass } from "./class";

function getValue(this: BigClass) {
    return this.value;
}

function setValue(this: BigClass, value: string ) {
   this.value = value;
}

De esta manera podemos poner métodos en un archivo separado. Ahora hay algo de dependencia circular ocurriendo aquí. El archivo class.ts importa de methods.ts y methods.ts importa de class.ts. Esto puede parecer aterrador, pero no es un problema. Mientras la ejecución del código no sea circular, todo está bien y en este caso el archivo methods.ts no está ejecutando ningún código del archivo class.ts. ¡NP!

También podrías usarlo con una clase genérica así:

class BigClass<T> {
    public getValue = getValue;
    public setValue = setValue;

    protected value?: T;
}

function getValue<T>(this: BigClass<T>) {
    return this.value;
}

function setValue<T>(this: BigClass<T>, value: T) {
    this.value = value;
}

Respuesta #2

No puedes.

Hubo una solicitud de función para implementar clases parciales, primero en CodePlex y luego en GitHub, pero el 04-04-2017 se declaró fuera de alcance. Se dan varias razones, la principal conclusión parece ser que quieren evitar desviarse de ES6 tanto como sea posible:

TypeScript ya tiene demasiadas características de clase específicas de TS [...] Agregar otra característica de clase específica de TS es otra carga para la espalda del camello que deberíamos evitar si podemos. [...] Entonces, si hay algún escenario que realmente lo haga destacar para agregar clases parciales, ese escenario debería poder justificarse a través del proceso de TC39.

Respuesta #3

Uso esto (funciona en TypeScript 2.2.2):

class BigClass implements BigClassPartOne, BigClassPartTwo {
    // only public members are accessible in the
    // class parts!
    constructor(public secret: string) { }

    // this is ugly-ish, but it works!
    methodOne = BigClassPartOne.prototype.methodOne;
    methodTwo = BigClassPartTwo.prototype.methodTwo;
}

class BigClassPartOne {
    methodOne(this: BigClass) {
        return this.methodTwo();
    }
}

class BigClassPartTwo {
    methodTwo(this: BigClass) {
        return this.secret;
    }
}

Respuesta #4

Utilizo la subclase simple al convertir grandes clases antiguas de JavaScript con múltiples archivos que usan 'prototype' en múltiples archivos de TypeScript:

bigclassbase.ts:

class BigClassBase {
    methodOne() {
        return 1;
    }

}
export { BigClassBase }

bigclass.ts:

import { BigClassBase } from './bigclassbase'

class BigClass extends BigClassBase {
    methodTwo() {
        return 2;
    }
}

Puedes importar BigClass en cualquier otro archivo de TypeScript.

Artículos relacionados