Wie verwende ich Object.values ​​mit Typoskript?

Ich versuche, eine durch Kommas getrennte Zeichenfolge von einem Objekt zu bilden.

const data = {"Ticket-1.pdf":"8e6e8255-a6e9-4626-9606-4cd255055f71.pdf","Ticket-2.pdf":"106c3613-d976-4331-ab0c-d581576e7ca1.pdf"};
const values = Object.values(data).map(x => x.substr(0, x.length - 4));
const commaJoinedValues = values.join(',');
console.log(commaJoinedValues);

Wie geht das mit TypeScript?

eine Fehlerdatei erhalten:

severity: 'Error'
message: 'Property 'values' does not exist on type 'ObjectConstructor'.'
at: '216,27'
source: 'ts'

Verwenden Sie stattdessen Object.keys.

const data = {
  a: "first",
  b: "second",
};

const values = Object.keys(data).map(key => data[key]);

const commaJoinedValues = values.join(",");
console.log(commaJoinedValues);

Object.values()ist Teil von ES2017 , und der Kompilierungsfehler, den Sie erhalten, liegt darin, dass Sie TS für die Verwendung der ES2017-Bibliothek konfigurieren müssen. Sie verwenden wahrscheinlich die ES6- oder ES5-Bibliothek in Ihrer aktuellen TS-Konfiguration.

Lösung: Verwenden Sie es2017oder es2017.objectin Ihrer --libCompiler-Option .

Zum Beispiel mit tsconfig.json:

"compilerOptions": {
    "lib": ["es2017", "dom"]
}

Beachten Sie, dass ES2017 mit Typoskript Targeting ist nicht polyfills im Browser für ES2017 emittieren (dh die oben löst Ihre Kompilierung Fehler, aber man kann immer noch auftreten Laufzeitfehler , da der Browser ES2017 nicht implementiert ), dann ist es an Ihnen, Ihr Projekt POLYfill Codieren Sie sich, wenn Sie möchten. Und da ist noch nicht gut von allen Browsern unterstützt (zum Zeitpunkt des Schreibens dieses Artikels) , die Sie auf jeden Fall eine polyfill: wird die Arbeit erledigen .Object.valuesObject.valuescore-js

Sie können dies Object.valuesin TypeScript verwenden, (<any>Object).values(data)wenn Sie aus irgendeinem Grund in tsconfig nicht auf ES7 aktualisieren können.

Anstatt

Object.values(myObject);

verwenden

Object["values"](myObject);

In Ihrem Beispielfall:

const values = Object["values"](data).map(x => x.substr(0, x.length - 4));

Dadurch wird der ts-Compilerfehler ausgeblendet.

Ich habe das Ziel in meinem erhöht tsconfig.json, um diese Funktion in TypeScript zu aktivieren

{
    "compilerOptions": {
        "target": "es2017",
        ......
    }
}

Ich habe gerade genau dieses Problem mit Angular 6 mithilfe der CLI und der Arbeitsbereiche festgestellt, mit denen eine Bibliothek erstellt wurde ng g library foo.

In meinem Fall befand sich das Problem im tsconfig.lib.jsonOrdner "Bibliothek", der nicht es2017im libAbschnitt enthalten war.

Wenn Sie mit Angular 6 auf dieses Problem stoßen, müssen Sie nur sicherstellen, dass Sie tsconfig.lib.jsonund Ihre Anwendung aktualisiert werdentsconfig.json

Wenn meine tslintRegelkonfiguration hier immer die Zeile Object["values"](myObject)durch ersetztObject.values(myObject) .

Zwei Optionen, wenn Sie das gleiche Problem haben:

(Object as any).values(myObject)

oder

/*tslint:disable:no-string-literal*/
`Object["values"](myObject)`

Der einfachste Weg ist, das Objectzu besetzen, wie folgt any:

const data = {"Ticket-1.pdf":"8e6e8255-a6e9-4626-9606-4cd255055f71.pdf","Ticket-2.pdf":"106c3613-d976-4331-ab0c-d581576e7ca1.pdf"};
const obj = <any>Object;
const values = obj.values(data).map(x => x.substr(0, x.length - 4));
const commaJoinedValues = values.join(',');
console.log(commaJoinedValues);

Und voila - keine Kompilierungsfehler;)

Noch einfacher ist die Verwendung _.valuesvon underscore.js https://underscorejs.org/#values