Dlaczego to wyjście tekstu opisu "[Klasa] nie jest konstruktorem."?

Question

Pracuję w maszynopisie 1.5 w visual studio. Mam główną klasę o nazwie app.ts i inną o nazwie FizzBuzzManager.ts. Nie mogę wykombinować, co jest nie tak z tym kodem, ale generuje błąd, "TypeError: jim.FizzBuzzManager nie jest konstruktorem".

app.ts

namespace jim { 
    class Greeter { 
     element: HTMLElement; 
     span: HTMLElement; 
     timerToken: number; 

     constructor() { 
      window.console.log("constructing Greeter."); 
      this.init(); 
     } 

     private init() { 
      window.console.log("Calling init."); 
      var _fizzBuzzManager: any = new jim.FizzBuzzManager(); 
    } 

} 

    window.onload =() => { 
     window.console.log("Hello") 
     var greeter = new Greeter(); 

}; 

FizzBuzzManager.ts

namespace jim { 

export class FizzBuzzManager { 

    constructor() { 
     window.console.log("Making a FizzBuzzManager."); 
    } 

    public myThing: String = "Hi"; 

    public fizzBuzz2() { 
     window.console.log("fizzbuzzing2 " + this.myThing); 
    } 

} 

export function fizzBuzz() { 
    window.console.log("export function fizzbuzz"); 
} 

} 

Wyjście patrząc na skompilowanej wyjścia w przeglądarce jest taki:

Hello             app.js:15:9 
constructing Greeter.         app.js:5:13 
Calling init.           app.js:9:13 
TypeError: jim.FizzBuzzManager is not a constructor app.js:10:36 

Answer 1

próbowałem powtórzyć swój problem i nie mogę znaleźć żadnego błędu:

app.ts

namespace jim { 
    class Greeter { 
     element: HTMLElement; 
     span: HTMLElement; 
     timerToken: number; 

     constructor() { 
      window.console.log("constructing Greeter."); 
      this.init(); 
     } 

     private init() { 
      window.console.log("Calling init."); 
      var _fizzBuzzManager: any = new jim.FizzBuzzManager(); 
     } 

    } 

    window.onload =() => { 
     window.console.log("Hello") 
     var greeter = new Greeter(); 

    }; 
} 

FizzBuzzManager.ts

namespace jim { 

export class FizzBuzzManager { 

    constructor() { 
     window.console.log("Making a FizzBuzzManager."); 
    } 

    public myThing: String = "Hi"; 

    public fizzBuzz2() { 
     window.console.log("fizzbuzzing2 " + this.myThing); 
    } 

} 

export function fizzBuzz() { 
    window.console.log("export function fizzbuzz"); 
} 

} 

Następnie

c:\Work\TypeScript-playground>node_modules\.bin\tsc --out app.js app.ts FizzBuzzManager.ts 

i skompilowany plik app.js wygląda następująco:

var jim; 
(function (jim) { 
    var Greeter = (function() { 
     function Greeter() { 
      window.console.log("constructing Greeter."); 
      this.init(); 
     } 
     Greeter.prototype.init = function() { 
      window.console.log("Calling init."); 
      var _fizzBuzzManager = new jim.FizzBuzzManager(); 
     }; 
     return Greeter; 
    })(); 
    window.onload = function() { 
     window.console.log("Hello"); 
     var greeter = new Greeter(); 
    }; 
})(jim || (jim = {})); 
var jim; 
(function (jim) { 
    var FizzBuzzManager = (function() { 
     function FizzBuzzManager() { 
      this.myThing = "Hi"; 
      window.console.log("Making a FizzBuzzManager."); 
     } 
     FizzBuzzManager.prototype.fizzBuzz2 = function() { 
      window.console.log("fizzbuzzing2 " + this.myThing); 
     }; 
     return FizzBuzzManager; 
    })(); 
    jim.FizzBuzzManager = FizzBuzzManager; 
    function fizzBuzz() { 
     window.console.log("export function fizzbuzz"); 
    } 
    jim.fizzBuzz = fizzBuzz; 
})(jim || (jim = {})); 

raporty przeglądarce Chrome w swojej konsoli:

app.js:15 Hello 
app.js:5 constructing Greeter. 
app.js:9 Calling init. 
app.js:24 Making a FizzBuzzManager. 

---

nie jest dobrym wyjaśnieniem błędu otrzymujesz tutaj: Javascript: TypeError: ... is not a constructor (nie, że ujawnia źródło problemu, ale może pojawić się problem z przeniesionym kodem.)

Answer 2

TypeError: jim.FizzBuzzManager is not a constructor

Jest to częsty błąd podczas korzystania --out: https://basarat.gitbooks.io/typescript/docs/tips/outFile.html

Jesteś odpowiedzialny za ładowanie plików w odpowiedniej kolejności. Nie używaj i nie używaj modułów zewnętrznych.

Answer 3

Którą wersję językową używasz?

Jest Bug w TSC 1.8.10:

https://github.com/Microsoft/TypeScript/issues/8910

Answer 4

To może być pomocne, aby pomyśleć o tym, jak gdybyś pisania kodu w JavaScript bezpośrednio. Natknąłem się na to pytanie, ponieważ dostałem ten sam błąd w specyfikacji testu Angular 2 napisanej w TypeScript. Po przemyśleniu tego na podstawie powyższych odpowiedzi zdałem sobie sprawę, że JavaScript nie ma pojęcia, jaki jest mój odpowiednik twojej klasy BuzzFeed, ponieważ znajdował się na samym dole pliku.

Przenosiłem klasę na górę pliku przed pierwszym stwierdzeniem opisującym i wszystko działa. Pomyślałem, że to może pomóc innym takim jak ja.

Answer 5

Natknąłem się na to pytanie po wyszukiwaniu "maszynopis nie jest konstruktorem". Niestety, te odpowiedzi nie rozwiązały mojego problemu. W końcu znalazłem rozwiązanie, więc zamieszczam je tutaj dla potomności.

Problem

I zdefiniowano następujące klasy maszynopis:

module mymodule { 
    export class myclass { 
     addDocuments(parentId: string) { 
     // Code removed for brevity... 
     } 
    } 
} 

ja wówczas nazywano klasę w oddzielnym module:

module mymodule.test { 

    var myClass = new mymodule.myclass(); 

    export function initialize(): void { 
     myClass.addDocuments("test123"); 
    } 
} 

Po kompilacji i gdy próbuje załadować strona, która wykonuje wynikowy Javascript, strona nie ładuje się poprawnie i widziałem następujący wyjątek JS:

Uncaught TypeError: mymodule.myclass is not a constructor

Rozwiązanie

Kolega deweloper był na tyle uprzejmy, aby podkreślić, że muszę przenieść instancji obiektu wewnątrz mojej funkcji. Teraz mój kod instancji wygląda tak i działa tak, jak powinien:

module mymodule.test { 

    var myClass: mymodule.myclass; 

    export function initialize(): void { 
     myClass = new mymodule.myclass(); 
     myClass.addDocuments("test123"); 
    } 
}