Typescript : 별도의 파일에서 클래스 및 메소드 정의

Question

하나의 파일에서 클래스를 선언하고 그 메소드를 별도의 파일로 정의 할 수 있습니까?

나는 의 많은 의 수업을 가지고 있으며, 나는 그들을 비트를 꺼낼 수 있다면 훌륭하게 될 것입니다.

Answer 1

짧은 대답 : Typescript는 클래스 정의를 여러 파일로 분할하지 않습니다.

해결 방법 : 클래스의 구성원이 포함 된 인터페이스와 해당 인터페이스를 구현하는 두 개의 다른 클래스를 정의 할 수 있습니다. 그런 다음 하나의 클래스의 속성을 다른 클래스로 믹스하여 결합 된 클래스를 만듭니다. 예 :

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
}

.

사용법.

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

.

클래스의 생성자가 필요하면 작동하지 않습니다. 그리고 정말로 그것은 하위를 보냅니다 ... 해결 방법 없음은 없음 :)

오, 그건 그렇고, Typescript는 클래스에 대한 UnitiAlised 속성 / 필드 유형 선언을 방출하지 않기 때문에 작동합니다.

나는 또한 인터페이스 없이이 일을 할 수 있고 더 예쁜 방법으로 클래스 구조를 할 수 있다는 것을 깨닫습니다. 지금 당장 독자들에게 운동으로하는 방법을 남길 것입니다 ...

Answer 2

클래스 자체와 다른 파일에서 기능을 가져올 수 있습니다

여기에 클래스 파일의 예입니다.

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

.

여기에 하나의 함수 파일의 예입니다.

import {MyClass} from "./MyClass"

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

.

중요 정보 : 화살표 함수에서 바인드 (이)를 할 수 없기 때문에 모든 내 보낸 함수가 화살표 함수가 아니면