Typ Deklarationsreihenfolge in TypeScript

Question

Ist TypeScript empfindlich gegenüber der Reihenfolge der Typdeklarationen?

die Reihenfolge der Typ ändern, verursacht einen Fehler innerhalb Angular 2 (beta.0), die (AFAIK) Typoskript mit implementiert selbst (das ist, warum dieser Fehler so seltsam & irrelevant mir scheint):

angular2-polyfills.js:138 Error: Cannot read property 'prototype' of undefined(…)

Angenommen wir eine Datei t1.ts haben:

export class AuthResponse extends JsonResponse { } 
export class JsonResponse { 
    public code: ResultCode; 
} 
export enum ResultCode { } 

Beim Starten der App, sehen wir den Fehler erwähnt, auf Client-Seite. Aber wenn wir die Reihenfolge der Deklarationen in dieser Datei umkehren, verschwindet der Fehler (nur für den Rekord, derzeit gehe ich vorwärts, unter Berücksichtigung dieser & es funktioniert).

diesen Fehler zu reproduzieren brauchen wir fünf weitere Dateien:

t2.ts:

import {AuthResponse, JsonResponse, ResultCode} from './t1'; // this order? 

export class DummyAction { 
    doSomething() { 
     console.log('test, starting ...'); 

     var v = new AuthResponse(); 
     return v; 
    } 
} 

app.component.ts:

import {Component, OnInit} from 'angular2/core'; 
import {DummyAction} from './components/t2';    

@Component({  
    selector: 'root-app', 
    templateUrl: '/app/templates/app.html', 
}) 
export class AppComponent implements OnInit { 
    constructor() { 
     var tester = new DummyAction(); 
     // tester.runTest(); 
    } 

    ngOnInit() { } 
} 

app.html:

<h1>TEST</h1> 

boot.ts:

import {bootstrap} from 'angular2/platform/browser'; 
import {AppComponent} from './app.component'; 

bootstrap(AppComponent, []); 

Und index.html, die ein bisschen größer, aber im Wesentlichen ist, hat die Struktur der index.html von Tutorial auf angular Website.

Answer 1

TypeScript selbst nicht empfindlich, aber dies zu JS kompiliert.

class A extends B {} 
class B {} 

In JS:

var A = (function (_super) { /* ... */ })(B); 
var B = (function() { /* ... */ })(); 

B ist nicht definiert, auf der Linie 1.

Answer 2

ich meine Stimme für die vasa_c Antwort gegossen haben, da es die richtige ist. Im Folgenden möchte ich Ihnen einige weitere Informationen zu diesem Thema geben, damit OP das Problem besser verstehen kann.

Wenn wir Ihr Beispielcode nehmen:

export class AuthResponse extends JsonResponse { } 
export class JsonResponse { 
    public code: ResultCode; 
} 
export enum ResultCode { } 

Und es kompilieren - das ist, was das Endergebnis aussehen wird:

var AuthResponse = (function (_super) { 
    __extends(AuthResponse, _super); 
    function AuthResponse() { 
     _super.apply(this, arguments); 
    } 
    return AuthResponse; 
})(JsonResponse); 
exports.AuthResponse = AuthResponse; 
var JsonResponse = (function() { 
    function JsonResponse() { 
    } 
    return JsonResponse; 
})(); 
exports.JsonResponse = JsonResponse; 
(function (ResultCode) { 
})(exports.ResultCode || (exports.ResultCode = {})); 
var ResultCode = exports.ResultCode; 

Beachten Sie, dass der resultierende Code funktioniert nicht nur Definitionen . Es sind Funktionen und Variablen. Das macht den Unterschied. Weil Sie sowohl Deklarationen als auch Ausdrücke haben. Mehr zu diesem Thema und warum mit Ausdrücken in js Reihenfolge ist von Bedeutung, können Sie in diesem ausgezeichneten Beitrag lesen: JavaScript function declaration and evaluation order