WebAssembly.Table

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since October 2017.

Das WebAssembly.Table Objekt ist ein JavaScript-Wrapper-Objekt — eine array-ähnliche Struktur, die eine WebAssembly-Tabelle darstellt und homogene Referenzen speichert. Eine Tabelle, die durch JavaScript oder durch WebAssembly-Code erstellt wird, ist sowohl von JavaScript als auch von WebAssembly aus zugänglich und veränderbar.

Hinweis: Tabellen können derzeit nur Funktionsreferenzen oder Host-Referenzen speichern, dies wird sich jedoch wahrscheinlich in Zukunft erweitern.

Konstruktor

WebAssembly.Table()

Erstellt ein neues Table-Objekt.

Instanz-Eigenschaften

Table.prototype.length Schreibgeschützt

Gibt die Länge der Tabelle zurück, d.h. die Anzahl der Elemente in der Tabelle.

Instanz-Methoden

Table.prototype.get()

Zugriffsfunktion — erhält das Element, das an einem bestimmten Index gespeichert ist.

Table.prototype.grow()

Erhöht die Größe der Table-Instanz um eine angegebene Anzahl von Elementen.

Table.prototype.set()

Setzt ein Element, das an einem bestimmten Index gespeichert ist, auf einen gegebenen Wert.

Beispiele

Erstellen einer neuen WebAssembly-Table-Instanz

Das folgende Beispiel (siehe table2.html Quellcode und Live-Version) erstellt eine neue WebAssembly-Table-Instanz mit einer Anfangsgröße von 2 Elementen. Wir drucken dann die Tabellenlänge und den Inhalt der beiden Indizes (abgerufen über Table.prototype.get()), um zu zeigen, dass die Länge zwei ist und beide Elemente null sind.

js
const tbl = new WebAssembly.Table({ initial: 2, element: "anyfunc" });
console.log(tbl.length); // "2"
console.log(tbl.get(0)); // "null"
console.log(tbl.get(1)); // "null"

Wir erstellen dann ein Importobjekt, das die Tabelle enthält:

js
const importObj = {
  js: { tbl },
};

Schließlich laden und instanziieren wir ein Wasm-Modul (table2.wasm) mit der Methode WebAssembly.instantiateStreaming(). Das table2.wasm-Modul enthält zwei Funktionen (eine, die 42 zurückgibt und eine andere, die 83 zurückgibt) und speichert beide in den Elementen 0 und 1 der importierten Tabelle (siehe Textdarstellung). Nach der Instanziierung hat die Tabelle immer noch die Länge 2, aber die Elemente enthalten nun aufrufbare exportierte WebAssembly-Funktionen, die wir aus JS aufrufen können.

js
WebAssembly.instantiateStreaming(fetch("table2.wasm"), importObject).then(
  (obj) => {
    console.log(tbl.length);
    console.log(tbl.get(0)());
    console.log(tbl.get(1)());
  },
);

Beachten Sie, dass Sie am Ende des Zugriffsoperators einen zweiten Funktionsaufruf-Operator einschließen müssen, um die referenzierte Funktion tatsächlich aufzurufen und den darin gespeicherten Wert zu protokollieren (z.B. get(0)() statt get(0)).

Dieses Beispiel zeigt, dass wir die Tabelle aus JavaScript erstellen und darauf zugreifen, aber dieselbe Tabelle ist auch in der Wasm-Instanz sichtbar und aufrufbar.

Spezifikationen

Specification
WebAssembly JavaScript Interface
# tables

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
Table
Table() constructor
get
grow
length
set

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch