Bauen Sie eine Funktion ein Objekt mit Eigenschaften, die in TypeScript

Möchte ich eine Funktion erstellen-Objekt, das hat auch einige Eigenschaften gehalten. Zum Beispiel in JavaScript, die ich tun würde:

var f = function() { }
f.someValue = 3;

Nun in Maschinenschrift, kann ich beschreiben, die Art dieser:

var f: { (): any; someValue: number; };

Allerdings kann ich nicht wirklich bauen kann, ohne dass einem Guss. Wie:

var f: { (): any; someValue: number; } =
    <{ (): any; someValue: number; }>(
        function() { }
    );
f.someValue = 3;

Wie würden Sie bauen, ohne dass ein cast?

InformationsquelleAutor der Frage JL235 | 2012-10-07

17

Wenn also die Anforderung ist einfach zu erstellen und weisen Sie diese Funktion auf "f" ohne eine Besetzung, hier ist eine mögliche Lösung:
```
var f: { (): any; someValue: number; };

f = (() => {
    var _f : any = function () { };
    _f.someValue = 3;
    return _f;
})();
```
Im wesentlichen, es verwendet eine selbst ausgeführte Funktion literal zu "bauen", ein Objekt zu entsprechen, wird die Signatur, bevor die Zuweisung erfolgt. Die einzige Seltsamkeit ist, dass die innere Deklaration der Funktion muss vom Typ 'any', sonst der compiler schreit, dass Sie die Zuweisung an eine Eigenschaft, die nicht vorhanden ist auf dem Objekt noch.

EDIT: Vereinfacht den code ein wenig.

InformationsquelleAutor der Antwort nxn
82

Update: Diese Antwort war die beste Lösung, die in früheren Versionen von Typoskript, aber es gibt bessere Optionen in neueren Versionen (siehe andere Antworten).

Die akzeptierte Antwort, die funktioniert und könnte erforderlich sein, in einigen Situationen, haben aber den Nachteil, sofern keine Typ-Sicherheit für den Aufbau des Objekts. Diese Technik wird zumindest werfen Sie einen Typ-Fehler, wenn Sie versuchen, hinzufügen eine Undefinierte Eigenschaft.
```
interface F { (): any; someValue: number; }

var f = <F>function () { }
f.someValue = 3

//type error
f.notDeclard = 3
```
InformationsquelleAutor der Antwort Greg Weber
38

Typoskript ausgelegt ist diesem Fall durch Erklärung Zusammenführen:

können Sie auch mit JavaScript vertraut sein die Praxis der Erstellung einer Funktion, und dann erweitern Sie die Funktion weiter, indem Eigenschaften auf die Funktion. Typoskript verwendet Erklärung der Zusammenführung aufzubauen Definitionen, wie dies in einer typsicheren Art und Weise.

Erklärung verschmelzen lässt uns sagen, dass etwas eine Funktion und einen Namensraum (internes Modul):
```
function f() { }
namespace f {
    export var someValue = 3;
}
```
Dies spart Tipparbeit und ermöglicht es uns, Ihnen schreiben f() und f.someValue. Beim schreiben einer .d.ts Datei vorhandenen JavaScript-code, verwenden Sie declare:
```
declare function f(): void;
declare namespace f {
    export var someValue: number;
}
```
Hinzufügen von Eigenschaften zu den Funktionen wird oft eine verwirrende oder unerwartete Muster in Typoskript, so versuchen Sie es zu vermeiden, aber es kann notwendig sein, wenn die Verwendung oder Umwandlung von älteren JS-code. Dies ist einer der erst mal wäre es sinnvoll zu mischen internen Modulen (Namensräume) mit externen.

InformationsquelleAutor der Antwort mk.
33

Dies ist leicht erreichbar, jetzt (Typoskript 2.x) mit Object.assign(target, source)

Beispiel:

Die Magie hier ist, dass Object.assign<T, U>(...) eingegeben wird, um wieder eine Kreuzung Art von T & U.

Erzwingen, dass dies wird zu einer Schnittstelle bekannt ist auch straight-forward:
```
interface Foo {
  (a: number, b: string): string[];
  foo: string;
}

let method: Foo = Object.assign(
  (a: number, b: string) => { return a * a; },
  { foo: 10 }
); 
```
Fehler: foo:Anzahl nicht zuordenbar foo:string

Fehler: Anzahl nicht zuordenbar string[] (return type)

Nachteil: Sie müssen möglicherweise polyfill Objekt.zuweisen wenn welche auf älteren Browsern.

InformationsquelleAutor der Antwort Meirion Hughes
2

Als eine Verknüpfung, können Sie dynamisch zuweisen, das Objekt Wert mit Hilfe der ['Eigenschaft'] - accessor:
```
var f = function() { }
f['someValue'] = 3;
```
Dadurch wird die Typ-Prüfung. Jedoch ist es ziemlich sicher, weil Sie absichtlich den Zugriff auf die Eigenschaft auf die gleiche Weise:
```
var val = f.someValue; //This won't work
var val = f['someValue']; //Yeah, I meant to do that
```
Jedoch, wenn Sie wirklich wollen, geben Sie für die Eigenschaft Wert, das funktioniert nicht.

InformationsquelleAutor der Antwort Rick Love
1

Eine aktualisierte Antwort: da die Zugabe der Schnittpunkt Typen über & ist es möglich, zu "verschmelzen" zwei abgeleitete Typen on the fly.

Hier ist ein allgemeiner Helfer, der liest die Eigenschaften eines Objektes from und kopiert Sie über ein Objekt onto. Es gibt das gleiche Objekt zurück onto aber mit einer neuen Art gehören beide Gruppen von Eigenschaften, so richtig beschreiben das Laufzeitverhalten:
```
function merge<T1, T2>(onto: T1, from: T2): T1 & T2 {
    Object.keys(from).forEach(key => onto[key] = from[key]);
    return onto as T1 & T2;
}
```
Diese low-level-Helfer wird immer noch führen Sie eine Typ-Aussage, aber ist es Typ-sicher. Mit diesem Helfer haben wir einen operator, den wir verwenden können, um zu lösen die OP das problem der volle Typ-Sicherheit:
```
interface Foo {
    (message: string): void;
    bar(count: number): void;
}

const foo: Foo = merge(
    (message: string) => console.log(`message is ${message}`), {
        bar(count: number) {
            console.log(`bar was passed ${count}`)
        }
    }
);
```
Klicken Sie hier, um zu versuchen, es in der TypeScript Playground. Beachten Sie, dass wir eingeschränkt haben foo Typ Fooso das Ergebnis der merge muss eine vollständige Foo. Wenn Sie also umbenennen bar zu bad dann bekommt man einen Typ-Fehler.

NB Es ist immer noch eine Art Loch hier, jedoch. Typoskript nicht bieten eine Möglichkeit zum einschränken von einem parameter " Typ " auf "keine Funktion". So könnten Sie verwirrt werden und an Ihre Funktion als zweites argument mergeund das würde nicht funktionieren. So lange, bis dieser erklärt werden kann, haben wir, um es zu fangen Laufzeit:
```
function merge<T1, T2>(onto: T1, from: T2): T1 & T2 {
    if (typeof from !== "object" || from instanceof Array) {
        throw new Error("merge: 'from' must be an ordinary object");
    }
    Object.keys(from).forEach(key => onto[key] = from[key]);
    return onto as T1 & T2;
}
```
InformationsquelleAutor der Antwort Daniel Earwicker

Ich kann nicht sagen, dass es sehr einfach ist, aber es ist definitiv möglich:

interface Optional {
  <T>(value?: T): OptionalMonad<T>;
  empty(): OptionalMonad<any>;
}

const Optional = (<T>(value?: T) => OptionalCreator(value)) as Optional;
Optional.empty = () => OptionalCreator();

wenn du neugierig dies ist eine Kernaussage von mir mit TypeScript/JavaScript-version von Optional

InformationsquelleAutor der Antwort thiagoh

0

Dieser fährt vom starken eingeben, aber Sie können tun,
```
var f: any = function() { }
f.someValue = 3;
```
wenn Sie versuchen zu umgehen, bedrückend starke Typisierung wie ich war, als ich fand diese Frage. Leider ist dies ein Fall, Typoskript, schlägt fehl, absolut gültigen JavaScript, so dass Sie haben, um Sie sagen, Typoskript, wieder aus.

"Du JavaScript ist durchaus gültig Typoskript" zu false ausgewertet wird. (Hinweis: mit 0.95)

InformationsquelleAutor der Antwort WillSeitz

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.