Start · Sprachen · JavaScript · Referenz · TypedArray.from()

TypedArray.from()

Methode

Erstellt ein neues getyptes Array (z. B. <code>Uint8Array</code>, <code>Float32Array</code>) aus einem array-ähnlichen oder iterierbaren Objekt, optional mit Abbildungsfunktion.

seit JavaScript ES2015 Kategorie: method-property

Signatur

TypedArray.from(arrayLike, mapFn, thisArg)

Beschreibung

TypedArray.from() ist eine statische Methode, die auf den konkreten Konstruktoren aufgerufen wird, also etwa Uint8Array.from(), Int16Array.from(), Float64Array.from() oder BigInt64Array.from(). Ein globales Objekt TypedArray gibt es nicht. Es handelt sich um den gemeinsamen, verborgenen Oberkonstruktor aller getypten Arrays.

Als Quelle eignet sich jedes iterierbare Objekt (Array, Set, Map-Werte, Generatoren, Strings) und jedes array-ähnliche Objekt mit einer length-Eigenschaft und indizierten Elementen. Jeder Wert wird in den Elementtyp des Ziel-Arrays umgewandelt. Dabei wird gegebenenfalls abgeschnitten, begrenzt (bei Uint8ClampedArray) oder modulo gerechnet (Überlauf bei Ganzzahltypen).

Über den optionalen Parameter mapFn lässt sich jedes Element schon beim Erzeugen umrechnen. Das spart ein Zwischen-Array, wie es bei Array.from(...).map(...) entstünde. Die Methode passt gut, wenn Daten aus normalen JavaScript-Strukturen in binäre Puffer übertragen werden sollen, z. B. für WebGL, die Web Audio API, WebAssembly oder Netzwerkprotokolle.

Im Gegensatz zu Array.from() muss this ein Konstruktor für getypte Arrays sein. Deshalb funktionieren auch Unterklassen, etwa class MyBytes extends Uint8Array {} mit MyBytes.from(...).

Parameter

Name Typ Default Beschreibung
$arrayLike Pflicht Iterable|ArrayLike Iterierbares oder array-ähnliches Objekt, aus dem das getypte Array erzeugt wird.
$mapFn (element: any, index: number) => number|bigint undefined Optionale Abbildungsfunktion, die für jedes Element aufgerufen wird. Ihr Rückgabewert wird statt des Originalwerts gespeichert und anschließend in den Elementtyp umgewandelt.
$thisArg any undefined Wert, der beim Aufruf von mapFn als this verwendet wird. Bei Pfeilfunktionen hat er keine Wirkung.

Rückgabewert

Typ
TypedArray
Beschreibung
Eine neue Instanz des getypten Arrays, auf dem die Methode aufgerufen wurde (z. B. Uint8Array), mit eigenem, neu angelegtem ArrayBuffer.

Beispiele

Aus Array und Set erzeugen

const bytes = Uint8Array.from([10, 20, 300, -1]);
console.log(bytes);

const unique = Int16Array.from(new Set([1, 2, 2, 3]));
console.log(unique);
Uint8Array(4) [10, 20, 44, 255] Int16Array(3) [1, 2, 3]

Mit Abbildungsfunktion: Sinus-Welle für Web Audio

const sampleRate = 8;
// array-ähnliches Objekt { length } + mapFn erzeugt Samples ohne Zwischen-Array
const wave = Float32Array.from({ length: sampleRate }, (_, i) =>
  Math.sin((2 * Math.PI * i) / sampleRate)
);
console.log(Array.from(wave, (v) => v.toFixed(2)).join(' '));
0.00 0.71 1.00 0.71 0.00 -0.71 -1.00 -0.71

String in Byte-Array umwandeln (nur ASCII)

const text = 'Hallo';
const codes = Uint8Array.from(text, (ch) => ch.charCodeAt(0));
console.log(codes);

// Für echtes UTF-8 besser TextEncoder verwenden:
console.log(new TextEncoder().encode('Grüße'));
Uint8Array(5) [72, 97, 108, 108, 111] Uint8Array(7) [71, 114, 195, 188, 195, 159, 101]

BigInt64Array aus Generator

function* powersOfTwo(n) {
  for (let i = 0n; i < n; i++) yield 2n ** i;
}
const big = BigInt64Array.from(powersOfTwo(5n));
console.log(big);
BigInt64Array(5) [1n, 2n, 4n, 8n, 16n]

// Wichtig · Fallstricke

  • Kein globales TypedArray: TypedArray.from() ist nur ein Platzhalter-Name. Sie rufen die Methode immer auf einem konkreten Typ auf, z. B. Uint8Array.from().
  • Stille Umwandlung: Werte außerhalb des Wertebereichs laufen über (Uint8Array.from([256]) ergibt [0]). Nicht-numerische Werte werden zu NaN und in Ganzzahl-Arrays zu 0. Nachkommastellen werden bei Ganzzahltypen abgeschnitten.
  • BigInt-Typen: BigInt64Array und BigUint64Array erwarten BigInt-Werte. BigInt64Array.from([1, 2]) wirft einen TypeError. Umgekehrt führen BigInts in normalen getypten Arrays ebenfalls zu einem TypeError.
  • Kopie statt Sicht: Anders als new Uint8Array(buffer) legt from() immer einen neuen Speicher an. Für eine Sicht ohne Kopie auf einen vorhandenen ArrayBuffer verwenden Sie den Konstruktor.
  • Strings: Strings werden nach Unicode-Codepunkten durchlaufen. Für eine Byte-Kodierung ist TextEncoder die richtige Wahl.
  • Kompatibilität: Wird von allen modernen Browsern und von Node.js ab Version 4 unterstützt, nicht vom Internet Explorer. Die BigInt-Varianten gibt es ab ES2020.