From 6c82813dfb8eabfec094f1926f898122214b81d9 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 14 Sep 2021 11:08:23 +0900 Subject: Global_Objects/WebAssembly を更新 (#2338) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Markdownに変換 - 2021/09/01 時点の英語版に同期 --- .../global_objects/webassembly/index.html | 116 --------------------- .../reference/global_objects/webassembly/index.md | 87 ++++++++++++++++ 2 files changed, 87 insertions(+), 116 deletions(-) delete mode 100644 files/ja/web/javascript/reference/global_objects/webassembly/index.html create mode 100644 files/ja/web/javascript/reference/global_objects/webassembly/index.md (limited to 'files/ja/web') diff --git a/files/ja/web/javascript/reference/global_objects/webassembly/index.html b/files/ja/web/javascript/reference/global_objects/webassembly/index.html deleted file mode 100644 index 721d647799..0000000000 --- a/files/ja/web/javascript/reference/global_objects/webassembly/index.html +++ /dev/null @@ -1,116 +0,0 @@ ---- -title: WebAssembly -slug: Web/JavaScript/Reference/Global_Objects/WebAssembly -tags: - - API - - JavaScript - - Namespace - - Object - - Reference - - WebAssembly -translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly ---- -
{{JSRef}}{{SeeCompatTable}}
- -

WebAssembly JavaScript オブジェクトは全ての WebAssembly に関連する機能の名前空間として振る舞います。

- -

他のグローバルオブジェクトとは異なり、WebAssembly はコンストラクタではありません (関数オブジェクトではない) 。数学定数、関数の名前空間である {{jsxref("Math")}} や 、国際化コンストラクタと他の言語に依存する関数のための {{jsxref("Intl")}} と同等のものです。

- -

概要

- -

WebAssembly オブジェクトの主な用途は次のとおりです:

- - - -

メソッド

- -
-
{{jsxref("WebAssembly.instantiate()")}}
-
WebAssembly コードをコンパイル、インスタンス化するための主要な API で、 Module と、その最初の Instance を返します。
-
{{jsxref("WebAssembly.instantiateStreaming()")}}
-
ソースのストリームから直接 WebAssembly モジュールをコンパイル、インスタンス化し、 Module と、その最初の Instance を返します。
-
{{jsxref("WebAssembly.compile()")}}
-
{{jsxref("WebAssembly.Module")}} を用いて WebAssembly バイナリコードからコンパイルします。インスタンス化は別ステップとして分離されます。
-
{{jsxref("WebAssembly.compileStreaming()")}}
-
ソースのストリームから直接 {{jsxref("WebAssembly.Module")}} にコンパイルします。インスタンス化は別ステップとして分離されます。
-
{{jsxref("WebAssembly.validate()")}}
-
WebAssembly バイナリコードの型付き配列を検証し、バイト列が有効な WebAssembly コードか (true) 否か (false) を返します。
-
- -

コンストラクタ

- -
-
{{jsxref("WebAssembly.Module()")}}
-
新しい WebAssembly Module オブジェクトを生成します。
-
{{jsxref("WebAssembly.Instance()")}}
-
新しい WebAssembly Instance オブジェクトを生成します。
-
{{jsxref("WebAssembly.Memory()")}}
-
新しい WebAssembly Memory オブジェクトを生成します。
-
{{jsxref("WebAssembly.Table()")}}
-
新しい WebAssembly Table オブジェクトを生成します。
-
{{jsxref("WebAssembly.CompileError()")}}
-
新しい WebAssembly CompileError オブジェクトを生成します。
-
{{jsxref("WebAssembly.LinkError()")}}
-
新しい WebAssembly LinkError オブジェクトを生成します。
-
{{jsxref("WebAssembly.RuntimeError()")}}
-
新しい WebAssembly RuntimeError オブジェクトを生成します。
-
- -

- -

fetch を使用して WebAssembly バイトコードをフェッチした後、{{jsxref("WebAssembly.instantiate()")}} 関数を使用してモジュールをコンパイル、インスタンス化します。その過程で、WebAssembly モジュールに JavaScript の関数をインポートします。このプロミスは解決時に Module と Instance を含むオブジェクト (result) を渡します。次に、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では、我々で定義した fetchAndInstantiate() ライブラリ関数を使用しています。

-
- -

仕様

- - - - - - - - - - - - - - - - -
仕様策定状況コメント
{{SpecName('WebAssembly JS', '#the-webassembly-object', 'WebAssembly')}}{{Spec2('WebAssembly JS')}}初回ドラフト定義。
- -

ブラウザ実装状況

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

関連情報

- - diff --git a/files/ja/web/javascript/reference/global_objects/webassembly/index.md b/files/ja/web/javascript/reference/global_objects/webassembly/index.md new file mode 100644 index 0000000000..700baceb0b --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/webassembly/index.md @@ -0,0 +1,87 @@ +--- +title: WebAssembly +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly +tags: + - API + - JavaScript + - Namespace + - Object + - Reference + - WebAssembly +browser-compat: javascript.builtins.WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly +--- +{{JSRef}} + +**`WebAssembly`** は JavaScript のオブジェクトで、 [WebAssembly](/ja/docs/WebAssembly) に関するすべての機能の名前空間の役割をします。 + +他のグローバルオブジェクトとは異なり、 `WebAssembly` はコンストラクターではありません (関数オブジェクトではありません) 。数学の定数や関数の名前空間である {{jsxref("Math")}} や 、国際化のコンストラクターやその他の言語を意識した関数ための {{jsxref("Intl")}} と同様のものです。 + +## 概要 + +`WebAssembly` オブジェクトの主な用途は次のとおりです。 + +- {{jsxref("WebAssembly.instantiate()")}} 関数を用いた WebAssembly コードの読み込み。 +- {{jsxref("WebAssembly.Memory()")}}/{{jsxref("WebAssembly.Table()")}} コンストラクターによる新しいメモリーやテーブルインスタンスの生成。 +- {{jsxref("WebAssembly.CompileError()")}}/{{jsxref("WebAssembly.LinkError()")}}/{{jsxref("WebAssembly.RuntimeError()")}} コンストラクターによる、WebAssembly で発生するエラーの処理する機能の提供。 + +## コンストラクタープロパティ + +- [`WebAssembly.CompileError()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/CompileError/CompileError) + - : WebAssembly のデコードまたは検証中のエラーを示します。 +- [`WebAssembly.Global()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/Global) + - : グローバル変数のインスタンスを表し、 JavaScript からアクセス可能で、 1 つ以上の {{jsxref("WebAssembly.Module")}} インスタンスの間でインポート/エクスポート可能です。これにより、複数のモジュールを動的リンクすることができます。 +- [`WebAssembly.Instance()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance/Instance) + - : ステートフルで、実行可能な [WebAssembly.Module](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module) のインスタンスです。 +- [`WebAssembly.LinkError()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/LinkError/LinkError) + - : (関数開始後の[トラップ](https://webassembly.org/docs/semantics/#traps)ではなく) モジュールの初期化時に発生したエラーを示します。 +- [`WebAssembly.Memory()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory/Memory) + - : {{jsxref("WebAssembly/Memory/buffer","buffer")}} プロパティが可変長の [ArrayBuffer](/ja/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer) であり、これが WebAssembly の `Instance` からアクセス可能なメモリーのバイト列を保持しています。 +- [`WebAssembly.Module()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module/Module) + - : ステートレスの WebAssembly のコードであり、ブラウザーでコンパイルされ、効率的に[ワーカーと共有](/ja/docs/Web/API/Worker/postMessage)することができ、複数回インスタンス化することができます。 +- [`WebAssembly.RuntimeError()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/RuntimeError/RuntimeError) + - : WebAssembly が[トラップ](https://webassembly.org/docs/semantics/#traps)を指定するたびに例外として発生するエラー型です。 +- [`WebAssembly.Table()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/Table) + - : WebAssembly のテーブルを表す配列風の構造で、関数の参照を保持します。 + +## 静的メソッド + +- {{jsxref("WebAssembly.instantiate()")}} + - : WebAssembly コードをコンパイル、インスタンス化するための主要な API で、 `Module` と、その最初の `Instance` を返します。 +- {{jsxref("WebAssembly.instantiateStreaming()")}} + - : ソースのストリームから直接 WebAssembly モジュールをコンパイル、インスタンス化し、 `Module` と、その最初の `Instance` を返します。 +- {{jsxref("WebAssembly.compile()")}} + - : {{jsxref("WebAssembly.Module")}} を用いて WebAssembly バイナリコードからコンパイルします。インスタンス化は別ステップとして分離されます。 +- {{jsxref("WebAssembly.compileStreaming()")}} + - : ソースのストリームから直接 {{jsxref("WebAssembly.Module")}} にコンパイルします。インスタンス化は別ステップとして分離されます。 +- {{jsxref("WebAssembly.validate()")}} + - : WebAssembly バイナリコードの型付き配列を検証し、バイト列が有効な WebAssembly コードか (`true`) 否か (`false`) を返します。 + +## 例 + +## .wasm モジュールを読み込み、コンパイルし、インスタンス化する + +次の例 (GitHub 上の [instantiate-streaming.html](https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/instantiate-streaming.html) のデモと、[動作例](https://mdn.github.io/webassembly-examples/js-api-examples/instantiate-streaming.html)も参照) は、基礎となるソースから .wasm モジュールを直接ストリーミングし、コンパイルしてインスタンス化し、 `ResultObject` で履行されるプロミスを返します。 `instantiateStreaming()` 関数は [`Response`](/ja/docs/Web/API/Response "Response は Fetch API のインターフェイスで、リクエストのレスポンスを表します。") オブジェクトのプロミスを受け付けるので、 [`fetch()`](/ja/docs/Web/API/fetch) の呼び出し結果を直接渡すと、履行されたときにレスポンスを関数に渡すことができます。 + +```js +var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject) +.then(obj => obj.instance.exports.exported_func()); +``` + +それから `ResultObject` の instance メンバーにアクセスすると、呼び出し対象のエクスポートされた関数が入っています。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [WebAssembly](/ja/docs/WebAssembly) 概要ページ +- [WebAssembly の概念](/ja/docs/WebAssembly/Concepts) +- [WebAssembly JavaScript API の使用](/ja/docs/WebAssembly/Using_the_JavaScript_API) -- cgit v1.2.3-54-g00ecf