angular - flatMap, flat, flatten existieren nicht auf dem Typ any[]

Ich benutze Chrome 70 und Chrome fügt die Methoden .flatMap, .flatten, .flat hinzu. Daher läuft mein Code wie erwartet. Leider mag TypeScript es nicht.

// data.flatMap lint error
export const transformData = (data: any[]) => data.flatMap(abc => [
   parentObj(abc),
   ...generateTasks(abc)
]);

Die Warnung, die ich erhalten habe, lautet TS2339: Die Eigenschaft 'flatMap' existiert nicht auf dem Typ 'any[]'.

Ich verwende Angular 6, das TypeScript ~2.9.2 verwendet, und ich habe bereits import 'core-js/es7/array'; in polyfills.ts eingefügt.

Ich vermute, dass es für diese Methoden keine Typisierung gibt, und ich habe versucht, npm run -dev @types/array.prototype.flatmap auszuführen, es hat das Problem aber trotzdem nicht gelöst.

Antwort #1

Sie sollten es2019 oder es2019.array zu Ihrer --lib-Einstellung hinzufügen, damit TypeScript array.flat() und flatMap() erkennt.

Beispiel :

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "es2019"
    ]
  }
}

Früher war dies als Teil von esnext oder esnext.array verfügbar, aber jetzt ist es offiziell Teil von ES2019.

Antwort #2

Wenn Sie eine niedrigere Version als es2019 verwenden, können Sie ein Shim implementieren, um eine ähnliche Funktionalität wie .flat() und .flatMap() bereitzustellen, die von späteren Bibliotheken angeboten wird.

Zu flachem einzeiligem Array

arr.reduce((acc, val) => acc.concat(val), []);

Zu flachem mehrstufigem Array

function flatDeep(arr, d = 1) {
   return d > 0 ? arr.reduce((acc, val) => acc.concat(Array.isArray(val) ? flatDeep(val, d - 1) : val), []) : arr.slice();
};

Um tiefgehend zu wissen, können Sie auch den untenstehenden Link überprüfen

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/flat

Antwort #3

Die Antwort von Aaron Beall ist ausgezeichnet. Es kann nützlich sein zu wissen, dass, wenn "lib" in der tsConfig.JSON-Datei nicht angegeben ist, eine Standardliste von Bibliotheken eingefügt wird. Die standardmäßig eingefügten Bibliotheken sind: ► Für --target ES5: DOM, ES5, ScriptHost ► Für --target ES6: DOM, ES6, DOM.Iterable, ScriptHost

Mit anderen Worten: Wir müssen diejenigen Bibliotheken angeben, die zuvor automatisch hinzugefügt wurden. (siehe: https://www.typescriptlang.org/docs/handbook/compiler-options.html für weitere Informationen)

"compilerOptions": {

   "target": "es6",

   "lib": [ "es2019", "DOM", "ES6" ,"DOM.Iterable", "ScriptHost"],}