--- title: WebAssembly.instantiate() slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate tags: - API - JavaScript - Method - Object - Reference - WebAssembly - instantiate - オブジェクト - メソッド translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate ---
{{JSRef}}

WebAssembly.instantiate() 関数は WebAssembly コードをコンパイルおよびインスタンス化することができます。この関数は2つのオーバーロードを持ちます。

重要: このメソッドは wasm モジュールの読み込みとインスタンス化に最も効率で黄な方法ではありません。可能であれば、代わりにもっと新しい {{jsxref("WebAssembly.instantiateStreaming()")}} メソッドを使用すれば、生のバイトコードから直接モジュールの読み込み、コンパイル、インスタンス化を1ステップで行うことができ、 {{jsxref("ArrayBuffer")}} へ変換する必要がありません。

構文

第一のオーバーロード — wasm バイナリコード

Promise<ResultObject> WebAssembly.instantiate(bufferSource, importObject);

引数

bufferSource
コンパイルする .wasm モジュールを含む 型付き配列 または {{jsxref("ArrayBuffer")}}。
importObject {{optional_inline}}
関数や {{jsxref("WebAssembly.Memory")}} オブジェクトなどの新しく生成される Instance にインポートされる値を持つオブジェクト。モジュール内で宣言されたインポートそれぞれに対応するプロパティが存在する必要があります。そうでない場合、 {{jsxref("WebAssembly.LinkError")}} がスローされます。

返値

解決時に次の2つのフィールドを持つ ResultObject を渡す Promise。

例外

第二のオーバーロード — モジュールオブジェクトのインスタンスを取る

Promise<WebAssembly.Instance> WebAssembly.instantiate(module, importObject);

引数

module
インスタンス化する {{jsxref("WebAssembly.Module")}} オブジェクト。
importObject {{optional_inline}}
関数や {{jsxref("WebAssembly.Memory")}} オブジェクトなどの新しく生成される Instance にインポートされる値を含むオブジェクト。宣言されたモジュールのインポートごとに1つの一致するプロパティが存在する必要があります。そうでない場合、 {{jsxref("WebAssembly.LinkError")}} がスローされます。

返値

解決時に {{jsxref("WebAssembly.Instance")}} オブジェクトを渡す Promise 。

例外

例

注: おそらく多くの場合は {{jsxref("WebAssembly.instantiateStreaming()")}} を使用したほうが、 instantiate() よりも効率的でしょう。

第一のオーバーロードの例

fetch を使用して WebAssembly バイトコードを読み込んだ後、 {{jsxref("WebAssembly.instantiate()")}} 関数を使用してモジュールをコンパイル、インスタンス化し、その処理中に JavaScript の関数を WebAssembly モジュールにインポートします。次に、 Instance によってエクスポートされたエクスポート済み WebAssembly 関数を呼び出します。

var importObject = {
  imports: {
    imported_func: function(arg) {
      console.log(arg);
    }
  }
};

fetch('simple.wasm').then(response =>
  response.arrayBuffer()
).then(bytes =>
  WebAssembly.instantiate(bytes, importObject)
).then(result =>
  result.instance.exports.exported_func()
);

注: この例は Github 上の index.html でも見ることができます (動作例)。

第二のオーバーロードの例

次の例 (GitHub上の index-compile.html デモを参照、 そして 動作例 も確認してください) では、読み込まれた simple.wasm バイトコードを {{jsxref("WebAssembly.compileStreaming()")}} メソッドを使用してコンパイルし、 {{domxref("Worker.postMessage", "postMessage()")}} を使用してワーカーに送信しています。

var worker = new Worker("wasm_worker.js");

WebAssembly.compileStreaming(fetch('simple.wasm'))
.then(mod =>
  worker.postMessage(mod)
);

ワーカーでは (wasm_worker.jsを参照) モジュールで使用するためのインポートオブジェクトを定義して、メインスレッドからモジュールを受け取るイベントハンドラーを設定し、 {{jsxref("WebAssembly.instantiate()")}} メソッドを使用してインスタンスを生成し、エクスポートされた関数を呼び出します。

var importObject = {
  imports: {
    imported_func: function(arg) {
      console.log(arg);
    }
  }
};

onmessage = function(e) {
  console.log('module received from main thread');
  var mod = e.data;

  WebAssembly.instantiate(mod, importObject).then(function(instance) {
    instance.exports.exported_func();
  });
};

仕様書

仕様書
{{SpecName('WebAssembly JS', '#dom-webassembly-instantiate', 'instantiate()')}}

ブラウザーの互換性

{{Compat("javascript.builtins.WebAssembly.instantiate")}}

関連情報