Website-Suche

TypeScript benannte Parameter wie sie in AngularJS verwendet werden?

Ich versuche, sowohl TypeScript als auch Angular (und damit JavaScript) zu lernen.

Wenn ich die Angular-Tutorials durchgehe, sehe ich, dass sie so etwas machen:

In normalem JavaScript:

function CreateCtrl($scope, $location, Project){
// do stuff
}

Für ein vollständiges Beispiel siehe das "Wire up a backend" Projekt.js-Beispiel auf der Angular-Startseite.

Der Clou ist, dass diese Parameter in beliebiger Reihenfolge sein könnten (oder überhaupt nicht vorhanden), und Project tatsächlich eine vom Benutzer definierte Variable/Typ ist. Das Angular-Framework ist in der Lage, die Parameter den tatsächlichen Objekten zuzuordnen.

Kommen wir nun zu TypeScript, wie kann ich diese Art von Funktionalität nachbilden? Ich würde gerne das Verhalten von Angular auf irgendeine Weise beschreiben, um es in TypeScript einzubinden (diese flexible Eigenschaftsinjektion stark typisieren).

Antwort #1

Es gibt eine AngularJS-Typdefinition auf Definitely Typed, die es Ihnen ermöglicht, Angular von TypeScript aus zu verwenden.

Wenn ich eine Definition für eine bestehende Funktion wie diese erstellen würde (in Abwesenheit von benannten Argumenten), würde ich sie wahrscheinlich entweder in einer bestimmten Reihenfolge definieren (obwohl ich weiß, dass sie in einfachem JavaScript in unterschiedlichen Reihenfolgen übergeben werden könnten) oder eine Reihe von Funktionsüberladungen erstellen, die den Möglichkeiten entsprechen, die ich freigeben wollte, so wie hier:

interface Example {
    ($scope: bool, $location: string, Project: number): void;
    ($location: string, $scope: bool, Project: number): void;
    (Project: number, $scope: bool, $location: string): void;
}

declare var example: Example;

Wenn ich versuche, example( aufzurufen, erhalte ich Intellisense mit den drei Optionen, und wenn ich keine dieser Kombinationen verwende, erhalte ich eine Compiler-Warnung.

In JavaScript werden benannte Argumente normalerweise mit einem Objekt erstellt, also wenn ich eine neue Methode schreiben würde, die Argumente auf diese Weise akzeptieren könnte, würde ich Folgendes tun...

interface ExampleArguments {
    scope: bool;
    location: string;
    project: number;
}

var example = function (exampleArguments: ExampleArguments) {

};

example({ scope: true, project: 4, location: 'hi' });

Welche in TypeScript statisch typisiert und überprüft wird.

Verwandte Artikel