diff options
Diffstat (limited to 'files/fr/web/javascript/reference/global_objects/webassembly')
24 files changed, 2375 insertions, 0 deletions
diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/compile/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/compile/index.html new file mode 100644 index 0000000000..9922106222 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/compile/index.html @@ -0,0 +1,89 @@ +--- +title: WebAssembly.compile() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/compile +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +--- +<div>{{JSRef}}</div> + +<p>La méthode <strong><code>WebAssembly.compile()</code></strong>, permet de compiler un module ({{jsxref("WebAssembly.Module")}} à partir d'un code binaire WebAssembly. Cette fonction est utile lorsqu'il est nécessaire de compiler un module avant de l'instancier (dans les autres cas, la méthode {{jsxref("WebAssembly.instantiate()")}} sera plus pertinente).</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">Promise<WebAssembly.Module> WebAssembly.compile(bufferSource);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>bufferSource</code></dt> + <dd>Un <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/TypedArray">tableau typé</a> ou un {{jsxref("ArrayBuffer")}} contenant le <em>bytecode</em> du module WebAssembly qu'on souhaite compiler.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Une promesse ({{jsxref("Promise")}}) dont la valeur de résolution est une instance de {{jsxref("WebAssembly.Module")}} qui représente le module compilé.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>Si <code>bufferSource</code> n'est pas un tableau typé, une exception {{jsxref("TypeError")}} sera levée.</li> + <li>Si la compilation échoue, la promesse sera rompue avec une exception {{jsxref("WebAssembly.CompileError")}}.</li> +</ul> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple qui suit, on compile le <em>bytecode</em> <code>simple.wasm</code> grâce à la méthode <code>compile()</code> puis on envoie le contenu à <a href="https://developer.mozilla.org/fr/docs/Web/API/Web_Workers_API">un <em>worker</em></a> grâce à la méthode <code><a href="/fr/docs/Web/API/Worker/postMessage">postMessage()</a></code>.</p> + +<pre class="brush: js">var worker = new Worker("wasm_worker.js"); + +fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(bytes => + WebAssembly.compile(bytes) +).then(mod => + worker.postMessage(mod) +);</pre> + +<div class="note"> +<p><strong>Note </strong>: Dans la plupart des cas, mieux vaudra utiliser {{jsxref("WebAssembly.compileStreaming()")}} qui est plus efficace que <code>compile()</code>.</p> +</div> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblycompile', 'compile()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.compile")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/compileerror/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/compileerror/index.html new file mode 100644 index 0000000000..69afe21895 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/compileerror/index.html @@ -0,0 +1,120 @@ +--- +title: WebAssembly.CompileError() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/CompileError +tags: + - API + - CompileError + - Constructeur + - Error + - JavaScript + - NativeError + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/CompileError +--- +<div>{{JSRef}}</div> + +<p>Le constructeur <code><strong>WebAssembly.CompileError()</strong></code> permet de créer une nouvelle instance de <code>CompileError</code> qui indique qu'une erreur s'est produite lors du décodage du code WebAssembly ou lors de sa validation.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">new WebAssembly.CompileError(<var>message</var>, <var>nomFichier</var>, <var>numeroLigne</var>)</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>Une description, compréhensible par un humain, de l'erreur qui s'est produite.</dd> + <dt><code>nomFichier</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>Le nom du fichier contenant le code à l'origine de l'exception.</dd> + <dt><code>numeroLigne</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>Le numéro de la ligne du fichier à l'origine de l'exception.</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<p><em>Le constructeur <code>CompileError</code> ne possède aucune propriété propre. En revanche, il hérite de certaines propriétés via sa chaîne de prototypes.</em></p> + +<dl> + <dt><code>WebAssembly.CompileError.prototype.constructor</code></dt> + <dd>Définit la fonction qui crée le prototype d'une instance.</dd> + <dt>{{jsxref("Error.prototype.message", "WebAssembly.CompileError.prototype.message")}}</dt> + <dd>Le message qui décrit l'erreur. Bien qu'ECMA-262 indique que l'instance devrait fournir sa propre propriété <code>message</code>, pour <a href="/fr/docs/SpiderMonkey">SpiderMonkey</a>, celle-ci est héritée depuis {{jsxref("Error.prototype.message")}}.</dd> + <dt>{{jsxref("Error.prototype.name", "WebAssembly.CompileError.prototype.name")}}</dt> + <dd>Le nom de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "WebAssembly.CompileError.prototype.fileName")}}</dt> + <dd>Le chemin vers le fichier qui a entraîné l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "WebAssembly.CompileError.prototype.lineNumber")}}</dt> + <dd>Le numéro de la ligne dans le fichier qui a entraîné l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "WebAssembly.CompileError.prototype.columnNumber")}}</dt> + <dd>Le numéro de la colonne dans la ligne du fichier qui a entraîné l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "WebAssembly.CompileError.prototype.stack")}}</dt> + <dd>La pile d'appel. Cette propriété est héritée via {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<p><em>Le constructeur <code>CompileError</code> ne contient aucune méthode qui lui soit propre. En revanche, il hérite de certaines méthodes grâce à sa chaîne de prototypes.</em></p> + +<dl> + <dt>{{jsxref("Error.prototype.toSource", "WebAssembly.CompileError.prototype.toSource()")}}</dt> + <dd>Cette méthode renvoie un code qui pourrait provoquer la même erreur. Elle est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.toString", "WebAssembly.CompileError.prototype.toString()")}}</dt> + <dd>Cette méthode renvoie une chaîne de caractères qui représente l'objet de l'erreur. Elle est héritée via {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>Le fragment de code qui suit crée une instance de <code>CompileError</code> puis imprime ses détails dans la console :</p> + +<pre class="brush: js">try { + throw new WebAssembly.CompileError('Coucou', 'unFichier', 10); +} catch (e) { + console.log(e instanceof CompileError); // true + console.log(e.message); // "Coucou" + console.log(e.name); // "CompileError" + console.log(e.fileName); // "unFichier" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // la pile d'appel pour le code +}</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#constructor-properties-of-the-webassembly-object', 'WebAssembly constructors')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon pour la définition Initiale de WebAssembly.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard', 'NativeError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Définition des types standards pour <code>NativeError</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.CompileError")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html new file mode 100644 index 0000000000..8dfca177d4 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html @@ -0,0 +1,81 @@ +--- +title: WebAssembly.compileStreaming() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/compileStreaming +tags: + - API + - JavaScript + - Méthode + - Object + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +--- +<div>{{JSRef}}</div> + +<p>La fonction <strong><code>WebAssembly.compileStreaming()</code></strong> permet de compiler un module WebAssembly (c'est-à-dire un objet {{jsxref("WebAssembly.Module")}}) depuis un flux source. Cette fonction est utile si on doit compiler un module avant de l'instancier séparement, sinon on utilisera plutôt {{jsxref("WebAssembly.instantiateStreaming()")}}.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">Promise<WebAssembly.Module> WebAssembly.compileStreaming(<em>source</em>);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>source</code></dt> + <dd>Un objet {{domxref("Response")}} ou une promesse qui sera résolue avec un objet {{domxref("Response")}} qui représentee la source du module .wasm qu'on souhaite manipuler comme un flux et compiler.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un objet <code>Promise</code> dont la valeur de résolution est un objet {{jsxref("WebAssembly.Module")}} qui représente le module compilé.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>Si la compilation échoue, la promesse est rejetée avec une exception {{jsxref("WebAssembly.CompileError")}}.</li> +</ul> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple suivant (également disponible sur GitHub : <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/compile-streaming.html">compile-streaming.html</a> et avec <a href="https://mdn.github.io/webassembly-examples/js-api-examples/compile-streaming.html">le résultat <em>live</em></a>), on récupère un flux dedpuis un module .wasm puis on le compile en un objet {{jsxref("WebAssembly.Module")}}. La fonction <code>compileStreaming()</code> acceptant une promesse pour un objet {{domxref("Response")}}, on peut directement passer l'appel à {{domxref("WindowOrWorkerGlobalScope.fetch()")}} qui transfèrera la réponse dès que la promesse sera tenue.</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.compileStreaming(fetch('simple.wasm')) +.then(module => WebAssembly.instantiate(module, importObject)) +.then(instance => instance.exports.exported_func());</pre> + +<p>Le module est ensuite instancié grâce à la fonction {{jsxref("WebAssembly.instantiate()")}}. Enfin, on appelle la fonction exportée.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly Embedding', '#webassemblycompilestreaming', 'compileStreaming()')}}</td> + <td>{{Spec2('WebAssembly Embedding')}}</td> + <td>Brouillon pour la définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2> + +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.compileStreaming")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">La page d'aperçu de WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript de WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/global/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/global/index.html new file mode 100644 index 0000000000..94ae405b8e --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/global/index.html @@ -0,0 +1,117 @@ +--- +title: WebAssembly.Global +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Global +tags: + - API + - Constructor + - JavaScript + - Reference + - TopicStub + - WebAssembly + - global +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Global +--- +<div>{{JSRef}}</div> + +<p>Un objet <strong><code>WebAssembly.Global</code></strong> représente une instance d'une variable globale, accessible depuis le code JavaScript et importable/exportable pour un ou plusieurs modules WebAssembly ({{jsxref("WebAssembly.Module")}}). Cela permet de lier dynamiquement plusieurs modules.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">var maGlobale = new WebAssembly.Global(<em>descripteur</em>, <em>valeur</em>);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>descripteur</code></dt> + <dd>Un dictionnaire <code>GlobalDescriptor</code> qui contient deux propriétés : + <ul> + <li><code>value</code> : une valeur {{domxref("USVString")}} qui représente le type de donnée de la variable globale. Ce type peut être <code>i32</code>, <code>i64</code>, <code>f32</code> ou <code>f64</code>.</li> + <li><code>mutable</code> : un booléen qui indique si la variable globale peut être modifiée ou non. Par défaut, cette propriété vaut <code>false</code>.</li> + </ul> + </dd> + <dt><code>valeur</code></dt> + <dd>La valeur que la variable doit contenir. Ce peut être n'importe quelle valeur qui respecte le type de donnée de la variable. Si aucune valeur n'est indiquée, c'est une valeur nulle typée qui est utilisée, tel qu'indiqué dans l'<a href="https://webassembly.github.io/spec/js-api/#defaultvalue">algorithme <code>DefaultValue</code></a>.</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<p>Aucune.</p> + +<h2 id="Instances_de_WebAssembly.Global">Instances de <code>WebAssembly.Global</code></h2> + +<p>Toutes les instances de <code>Global</code> héritent du <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/prototype">prototype </a>du constructeur <code>Global()</code>. Ce prototype peut être modifié afin d'avoir un impact sur l'ensemble des instances de <code>Global</code>.</p> + +<h3 id="Propriétés_des_instances">Propriétés des instances</h3> + +<p>{{page('/fr/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/prototype', 'Propriétés')}}</p> + +<h3 id="Méthodes_des_instances">Méthodes des instances</h3> + +<p>{{page('/fr/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/prototype', 'Méthodes')}}</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple suivant, on montre comment créer une nouvelle instance globale grâce au constructeur <code>WebAssembly.Global()</code>. Cette instance globale est définie avec le type <code>i32</code> et est indiquée comme modifiable. Sa valeur initiale est 0.</p> + +<p>On change ensuite la valeur de la variable globale en la passant à 42 grâce à la propriété <code>Global.value</code> puis en la passant à 43 grâce à la fonction <code>incGlobal()</code> qui a été exportée depuis le module <code>global.wasm</code> (cette fonction ajoute 1 à n'imorte quelle valeur puis renvoie cette nouvelle valeur).</p> + +<pre class="brush: js notranslate">const output = document.getElementById('output'); + +function assertEq(msg, got, expected) { + output.innerHTML += `Testing ${msg}: `; + if (got !== expected) + output.innerHTML += `FAIL!<br>Got: ${got}<br>Expected: ${expected}<br>`; + else + output.innerHTML += `SUCCESS! Got: ${got}<br>`; +} + +assertEq("WebAssembly.Global exists", typeof WebAssembly.Global, "function"); + +const global = new WebAssembly.Global({value:'i32', mutable:true}, 0); + +WebAssembly.instantiateStreaming(fetch('global.wasm'), { js: { global } }) +.then(({instance}) => { + assertEq("getting initial value from wasm", instance.exports.getGlobal(), 0); + global.value = 42; + assertEq("getting JS-updated value from wasm", instance.exports.getGlobal(), 42); + instance.exports.incGlobal(); + assertEq("getting wasm-updated value from JS", global.value, 43); +});</pre> + +<div class="note"> +<p><strong>Note</strong> : Cet exemple est<a href="https://mdn.github.io/webassembly-examples/js-api-examples/global.html"> utilisable sur GitHub</a> et <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/global.html">son code source est également disponible</a>.</p> +</div> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#globals', 'WebAssembly.Global()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de spécification initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Global")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Page principale pour la section WebAssembly de MDN</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Concepts WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> + <li><a href="https://github.com/WebAssembly/mutable-global/blob/master/proposals/mutable-global/Overview.md">La proposition pour l'import/export de variables globales modifiables</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/index.html new file mode 100644 index 0000000000..b5932b027c --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/index.html @@ -0,0 +1,106 @@ +--- +title: WebAssembly +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly +tags: + - API + - JavaScript + - Object + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly +--- +<div>{{JSRef}}</div> + +<p>L'objet JavaScript <strong><code>WebAssembly</code></strong> est un objet global qui agit comme un espace de noms (<em>namespace</em>) pour les différentes fonctionnalités JavaScript relatives à <a href="/fr/docs/WebAssembly">WebAssembly</a>.</p> + +<p>À la différence des autres objets globaux, <code>WebAssembly</code> n'est pas un constructeur (au même titre que {{jsxref("Math")}} qui agit comme un espace de noms pour les constantes et fonctions mathématiques ou comme {{jsxref("Intl")}} qui centralise les constructeurs et les opérations relatives à l'internationalisation).</p> + +<h2 id="Description">Description</h2> + +<p>L'objet <code>WebAssembly</code> est notamment utilisé pour :</p> + +<ul> + <li>Charger du code WebAssembly grâce à la fonction {{jsxref("WebAssembly.instantiate()")}}</li> + <li>Créer des zones mémoires et des instances de tableaux grâce aux constructeurs {{jsxref("WebAssembly.Memory()")}}/{{jsxref("WebAssembly.Table()")}}.</li> + <li>Fournir des outils de gestion d'erreur WebAssembly grâce aux constructeurs {{jsxref("WebAssembly.CompileError()")}}/{{jsxref("WebAssembly.LinkError()")}}/{{jsxref("WebAssembly.RuntimeError()")}}.</li> +</ul> + +<h2 id="Méthodes">Méthodes</h2> + +<dl> + <dt>{{jsxref("WebAssembly.instantiate()")}}</dt> + <dd>La méthode qu'on utilisera la plupart du temps pour compiler et instancier du code WebAssembly, elle renvoie une promesse qui est résolue en une <code>Instance</code> ou en une <code>Instance</code> et un <code>Module</code>.</dd> + <dt>{{jsxref("WebAssembly.instantiateStreaming()")}}</dt> + <dd>Cette méthode peremet de compiler et d'instancier un module WebAssembly à partir d'un flux source (<em>streamed source</em>). Elle renvoie à la fois un objet <code>Module</code> et sa première <code>Instance</code>.</dd> + <dt>{{jsxref("WebAssembly.compile()")}}</dt> + <dd>Cette méthode permet de compiler un {{jsxref("WebAssembly.Module")}} à partir de <em>bytecode</em> WebAssembly, l'instanciation doit alors être effectuée dans une autre étape.</dd> + <dt>{{jsxref("WebAssembly.compileStreaming()")}}</dt> + <dd>Cette méthode permet de compiler un module {{jsxref("WebAssembly.Module")}} à partir d'un flux source (<em>streamed source</em>). L'instanciation devra alors être réalisée avec une autre étape.</dd> + <dt>{{jsxref("WebAssembly.validate()")}}</dt> + <dd>Cette méthode permet de valider un tableau typé censé contenir du <em>bytecode</em> WebAssembly : elle renvoie <code>true</code> si les octets forment un code WebAssembly valide ou <code>false</code> sinon.</dd> +</dl> + +<h2 id="Constructeurs">Constructeurs</h2> + +<dl> + <dt>{{jsxref("WebAssembly.Global()")}}</dt> + <dd>Ce constructeur permet de créer un nouvel objet WebAssembly <code>Global</code>.</dd> + <dt>{{jsxref("WebAssembly.Module()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>Module</code>.</dd> + <dt>{{jsxref("WebAssembly.Instance()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>Instance</code>.</dd> + <dt>{{jsxref("WebAssembly.Memory()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>Memory</code>.</dd> + <dt>{{jsxref("WebAssembly.Table()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>Table</code>.</dd> + <dt>{{jsxref("WebAssembly.CompileError()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>CompileError</code>.</dd> + <dt>{{jsxref("WebAssembly.LinkError()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>LinkError</code>.</dd> + <dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt> + <dd>Ce constructeur permet de créer un objet WebAssembly <code>RuntimeError</code>.</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>L'exemple suivant (cf. le fichier <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/instantiate-streaming.html">instantiate-streaming.html</a></code> sur GitHub et <a href="https://mdn.github.io/webassembly-examples/js-api-examples/instantiate-streaming.html">le résultat obtenu</a>) permet de récupérer le module WebAssembly via un flux depuis une source, de le compiler, puis de l'instancier. La promesse est résolue avec un objet <code>ResultObject</code>. La méthode <code>instantiateStreaming()</code> accepte une promesse pour l'argument {{domxref("Response")}}, on peut lui passer directement un appel à {{domxref("WindowOrWorkerGlobalScope.fetch()")}} qui passera ensuite la réponse à la fonction lors de la complétion de la promesse.</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject) +.then(obj => obj.instance.exports.exported_func());</pre> + +<p>On accède alors à la propriété de l'instance <code>ResultObject</code> puis on appelle la fonction exportée.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#the-webassembly-object', 'WebAssembly')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/instance/exports/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/instance/exports/index.html new file mode 100644 index 0000000000..cec4fddea3 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/instance/exports/index.html @@ -0,0 +1,71 @@ +--- +title: WebAssembly.Instance.prototype.exports +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Instance/exports +tags: + - API + - Experimental + - JavaScript + - Propriété + - Reference + - WebAssembly + - instance +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance/exports +--- +<div>{{JSRef}}</div> + +<p>La propriété <strong><code>exports</code></strong> du prototype de {{jsxref("WebAssembly.Instance")}} est une propriété en lecture seul qui renvoie un objet dont les propriétés sont les différentes fonctions exportées depuis l'instance du module WebAssembly. Cela permet d'y accéder et de les manipuler en JavaScript.</p> + +<pre class="syntaxbox">instance.exports</pre> + +<h2 id="Exemples">Exemples</h2> + +<p>Après avoir récupéré le <em>bytecode</em> WebAssembly grâce à la méthode <code>fetch()</code>, on le compile et on instancie le module grâce à la fonction {{jsxref("WebAssembly.instantiateStreaming()")}}. Lorsqu'on utilise cette fonction, on importe une fonction dans le module. Ensuite, on appelle <a href="/fr/docs/WebAssembly/Exported_functions">une fonction WebAssembly exportée</a> qui est exposée via l'instance.</p> + +<pre class="brush: js">var importObject = { + imports: { + imported_func: function(arg) { + console.log(arg); + } + } +}; +WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject) +.then(obj => obj.instance.exports.exported_func());</pre> + +<div class="note"> +<p><strong>Note :</strong> Voir le fichier <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index.html">index.html</a> sur GitHub (ainsi que <a href="https://mdn.github.io/webassembly-examples/js-api-examples/">la démonstration</a>) pour un exemple.</p> +</div> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyinstance-objects', 'WebAssembly.Instance objects')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Instance.exports")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/instance/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/instance/index.html new file mode 100644 index 0000000000..93c6a9b324 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/instance/index.html @@ -0,0 +1,81 @@ +--- +title: WebAssembly.Instance() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Instance +tags: + - API + - Constructeur + - JavaScript + - Reference + - WebAssembly + - instance +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance +--- +<div>{{JSRef}}</div> + +<p>Un objet <strong><code>WebAssembly.Instance</code></strong> représente un objet exécutable, avec un état, qui est une instance d'un <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module">module WebAssembly</a>. Un objet <code>Instance</code> contient l'ensemble <a href="/fr/docs/WebAssembly/Exported_functions">des fonctions WebAssembly exportées</a> qui permettent d'invoquer du code WebAssembly depuis du code JavaScript.</p> + +<p>Le constructeur <code>WebAssembly.Instance()</code> peut être appelé afin de créer, de façon synchrone, une instance d'un {{jsxref("WebAssembly.Module")}} donné. Toutefois, pour obtenir une instance, on utilisera généralement la fonction asynchrone {{jsxref("WebAssembly.instantiateStreaming()")}}.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<div class="warning"> +<p><strong>Important </strong>: L'instanciation de modules volumineux peut être coûteuse en temps/ressource. <code>Instance()</code> ne doit être utilisée que lorsqu'une instanciation synchrone est nécessaire. Pour tous les autres cas, c'est la méthode {{jsxref("WebAssembly.instantiateStreaming()")}} qui devrait être utilisée.</p> +</div> + +<pre class="syntaxbox">var monInstance = new WebAssembly.Instance(<em>module</em>, <em>importObject</em>);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>module</code></dt> + <dd>L'objet <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module" title="The Module() constructor of the WebAssembly global object creates a new Module object instance."><code>WebAssembly.Module</code></a> qu'on souhaite instancier.</dd> + <dt><code>importObject</code> {{optional_inline}}</dt> + <dd>Un objet qui contient des valeurs à importer dans l'instance. Ce peuvent être des fonctions ou des objets <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory" title="The Memory() constructor of the WebAssembly global object creates a new Memory object instance, which represents a WebAssembly memory. These can be thought of as resizeable array buffers, wrappers around WebAssembly memories."><code>WebAssembly.Memory</code></a>. Il doit exister une propriété correspondante pour chaque import, si ce n'est pas le cas, un exception <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/LinkError">WebAssembly.LinkError</a></code> sera levée.</dd> +</dl> + +<h2 id="Instances_d'Instance">Instances d'<code>Instance</code></h2> + +<p>Toutes les instances du type <code>Instance</code> héritent du prototype du constructeur <code>Instance()</code>. Celui-ci peut être modifié afin de modifier l'ensemble des instances de <code>Instance</code>.</p> + +<h3 id="Propriétés">Propriétés</h3> + +<p>{{page('/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Instance/prototype', 'Propriétés')}}</p> + +<h3 id="Méthodes">Méthodes</h3> + +<p>{{page('/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Instance/prototype', 'Méthodes')}}</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyinstance-objects', 'Instance')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Définition initiale dans un brouillon de spécification.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Instance")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/instantiate/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/instantiate/index.html new file mode 100644 index 0000000000..3c5f54f844 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/instantiate/index.html @@ -0,0 +1,175 @@ +--- +title: WebAssembly.instantiate() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/instantiate +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate +--- +<div>{{JSRef}}</div> + +<p>La fonction <strong><code>WebAssembly.instantiate()</code></strong> permet de compiler et d'instancier du code WebAssembly. Cette fonction possède deux formes :</p> + +<ul> + <li>La première forme prend un code binaire WebAssembly sous forme d'un <a href="/fr/docs/Web/JavaScript/Tableaux_typés">tableau typé</a> ou d'un {{jsxref("ArrayBuffer")}} et effectue les étapes de compilation et d'instanciation en une fois. La valeur de résolution de la promesse renvoyée se compose d'un module {{jsxref("WebAssembly.Module")}} compilé et de sa première instance {{jsxref("WebAssembly.Instance")}}.</li> + <li>La seconde forme prend un module ({{jsxref("WebAssembly.Module")}}) déjà compilé et renvoie une promesse dont la valeur de résolution est une instance de ce module. Cette forme s'avère utile lorsque le module a déjà été compilé.</li> +</ul> + +<div class="warning"> +<p><strong>Attention !</strong> Tant que faire se peut, utiliser la méthode {{jsxref("WebAssembly.instantiateStreaming()")}} car elle est plus efficace et récupère, compile et instancie un module en une seule étape à partir du <em>bytecode</em> et il n'est pas nécessaire de passer par une conversion en {{jsxref("ArrayBuffer")}}.</p> +</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<h3 id="Première_forme_utiliser_le_bytecode_WebAssembly">Première forme : utiliser le <em>bytecode</em> WebAssembly</h3> + +<pre class="syntaxbox">Promise<ResultObject> WebAssembly.instantiate(bufferSource, importObject); +</pre> + +<h4 id="Paramètres">Paramètres</h4> + +<dl> + <dt><code>bufferSource</code></dt> + <dd>Un <a href="/fr/docs/Web/JavaScript/Tableaux_typés">tableau typé</a> ou un {{jsxref("ArrayBuffer")}} qui contient le <em>bytecode</em> du module WebAssembly qu'on souhaite compiler.</dd> + <dt><code>importObject</code> {{optional_inline}}</dt> + <dd>Un objet qui contient les valeurs à importer dans l'instance qui sera créée. Ces valeurs peuvent être des fonctions ou des objets {{jsxref("WebAssembly.Memory")}}. Il doit y avoir une propriété correspondante au sein du module compilé pour chacun des imports, si ce n'est pas le cas, une exception {{jsxref("WebAssembly.LinkError")}} sera levée.</dd> +</dl> + +<h4 id="Valeur_de_retour">Valeur de retour</h4> + +<p>Une promesse qui est résoluee en un objet qui contient deux champs :</p> + +<ul> + <li><code>module</code> : un objet {{jsxref("WebAssembly.Module")}} qui représente le module WebAssembly compilé. Ce module peut être instancié à nouveau grâce à {{domxref("Worker.postMessage", "postMessage()")}} ou via <a href="/fr/docs/WebAssembly/Caching_modules">un cache IndexedDB</a>.</li> + <li><code>instance</code> : un objet {{jsxref("WebAssembly.Instance")}} qui contient l'ensemble <a href="/fr/docs/WebAssembly/Exported_functions">des fonctions WebAssembly exportées</a>.</li> +</ul> + +<h4 id="Exceptions">Exceptions</h4> + +<ul> + <li>Si l'un des paramètres n'a pas le bon type ou la bonne structure, une exception {{jsxref("TypeError")}} sera levée.</li> + <li>Si l'opération échoue, la promesse est rompue avec une exception {{jsxref("WebAssembly.CompileError")}}, {{jsxref("WebAssembly.LinkError")}} ou {{jsxref("WebAssembly.RuntimeError")}} selon l'origine de l'échec.</li> +</ul> + +<h3 id="Seconde_forme_utiliser_une_instance_d'un_module">Seconde forme : utiliser une instance d'un module</h3> + +<pre class="syntaxbox">Promise<WebAssembly.Instance> WebAssembly.instantiate(module, importObject); +</pre> + +<h4 id="Paramètres_2">Paramètres</h4> + +<dl> + <dt><code>module</code></dt> + <dd>L'objet {{jsxref("WebAssembly.Module")}} qui doit être instancié.</dd> + <dt><code>importObject</code> {{optional_inline}}</dt> + <dd>Un objet qui contient les valeurs à importer dans l'instance qui sera créée. Ces valeurs peuvent être des fonctions ou des objets {{jsxref("WebAssembly.Memory")}}. Il doit y avoir une propriété correspondante au sein du module compilé pour chacun des imports, si ce n'est pas le cas, une exception {{jsxref("WebAssembly.LinkError")}} sera levée.</dd> +</dl> + +<h4 id="Valeur_de_retour_2">Valeur de retour</h4> + +<p>Une promesse qui est résolue en un objet {{jsxref("WebAssembly.Instance")}}.</p> + +<h4 id="Exceptions_2">Exceptions</h4> + +<ul> + <li>Si l'un des paramètres n'est pas du bon type ou n'a pas la bonne structure, une exception {{jsxref("TypeError")}} est levée.</li> + <li>Si l'opération échoue, la promesse sera rompue avec une exception {{jsxref("WebAssembly.CompileError")}}, {{jsxref("WebAssembly.LinkError")}} ou {{jsxref("WebAssembly.RuntimeError")}} selon l'origine de l'échec.</li> +</ul> + +<h2 id="Exemples">Exemples</h2> + +<div class="blockIndicator note"> +<p><strong>Note :</strong> Dans la plupart des cas, on utilisera plus vraisemblablement {{jsxref("WebAssembly.instantiateStreaming()")}} qui est plus efficace que <code>instantiate()</code>.</p> +</div> + +<h3 id="Première_forme">Première forme</h3> + +<p>Après avoir récupéré le <em>bytecode</em> WebAssembly grâce à <code>fetch()</code>, on compile et on instancie le module grâce à la fonction {{jsxref("WebAssembly.instantiate()")}} et on importe une fonction JavaScript dans le module lors de cette étape. Ensuite, on invoque <a href="/fr/docs/WebAssembly/Exported_functions">une fonction WebAssembly exportée</a> via l'instance.</p> + +<pre class="brush: js">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() +);</pre> + +<div class="note"> +<p><strong>Note </strong>: Voir le fichier <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index.html">index.html</a> sur GitHub (<a href="https://mdn.github.io/webassembly-examples/js-api-examples/">ainsi que la démonstration associée</a>) qui contient un exemple analogue et qui utilise la fonction utilitaire <code><a href="https://github.com/mdn/webassembly-examples/blob/master/wasm-utils.js#L1">fetchAndInstantiate()</a></code>.</p> +</div> + +<h3 id="Seconde_forme">Seconde forme</h3> + +<p>Dans l'exemple qui suit (tiré du fichier <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index-compile.html">index-compile.html</a></code> sur GitHub et qui dispose d'<a href="https://mdn.github.io/webassembly-examples/js-api-examples/index-compile.html">une démonstration</a>), on compile le <em>bytecode</em> du module chargé <code>simple.wasm</code> grâce à la fonction {{jsxref("WebAssembly.compileStreaming()")}} puis on envoie le résultat à un <em><a href="/fr/docs/Web/API/Web_Workers_API">worker</a></em> grâce à la méthode {{domxref("Worker.postMessage", "postMessage()")}}.</p> + +<pre class="brush: js">var worker = new Worker("wasm_worker.js"); + +WebAssembly.compileStreaming(fetch('simple.wasm')) +.then(mod => + worker.postMessage(mod) +);</pre> + +<p>Dans le <em>worker</em> (cf. <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/wasm_worker.js">wasm_worker.js</a></code>), on définit un objet d'import qui sera utilisé par le module puis on paramètre un gestionnaire d'évènement afin de recevoir le module depuis le <em>thread</em> principal. Lorsqu'on reçoit le module, on en crée une instance grâce à la méthode {{jsxref("WebAssembly.instantiate()")}} puis on appelle une fonction exportée depuis le module.</p> + +<pre class="brush: js">var importObject = { + imports: { + imported_func: function(arg) { + console.log(arg); + } + } +}; + +onmessage = function(e) { + console.log('module reçu depuis le thread principal'); + var mod = e.data; + + WebAssembly.instantiate(mod, importObject).then(function(instance) { + instance.exports.exported_func(); + }); +};</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyinstantiate', 'instantiate()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.instantiate")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/instantiatestreaming/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/instantiatestreaming/index.html new file mode 100644 index 0000000000..a53701dd6d --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/instantiatestreaming/index.html @@ -0,0 +1,90 @@ +--- +title: WebAssembly.instantiateStreaming() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/instantiateStreaming +tags: + - API + - JavaScript + - Méthode + - Object + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiateStreaming +--- +<div>{{JSRef}}</div> + +<p>La fonction <strong><code>WebAssembly.instantiateStreaming()</code></strong> permet de compiler et d'instancier un module WebAssembly depuis un flux source. C'est la méthode la plus efficace, et la plus optimisée, permettant de charger du code WebAssembly.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">Promise<ResultObject> WebAssembly.instantiateStreaming(<em>source</em>, <em>importObject</em>);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>source</code></dt> + <dd>Un objet {{domxref("Response")}} ou une promesse qui sera tenue avec une valeur {{domxref("Response")}} qui représente la source du module .wasm dont on souhaite récupérer le flux, la compiler puis l'instanciere.</dd> + <dt><code>importObject</code> {{optional_inline}}</dt> + <dd>Un objet qui contient les valeurs qui doivent être importées dans le nouvel objet <code>Instance</code> résultant. Cela peut être des fonctions ou des objets {{jsxref("WebAssembly.Memory")}}. Il est nécessaire qu'il y ait une propriété correspondante pour chaque import déclaré dans le module compilé, sinon, une exception <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/LinkError">WebAssembly.LinkError</a></code> sera levée.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un objet <code>Promise</code> dont la valeur de résolution est un objet <code>ResultObject</code> contenant deux champs :</p> + +<ul> + <li><code>module</code> : un objet {{jsxref("WebAssembly.Module")}} qui représente le module WebAssembly compilé. Ce module pourra être instancié à nouveau, partagé avec <code><a href="/fr/docs/Web/API/Worker/postMessage">postMessage()</a></code>.</li> + <li><code>instance</code> : un objet {{jsxref("WebAssembly.Instance")}} qui contient l'ensemble <a href="/fr/docs/WebAssembly/Exported_functions">des fonctions WebAssembly exportées</a>.</li> +</ul> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>Si l'un des paramètres n'est pas du bon type ou ne possède pas la bonne structure, une exception {{jsxref("TypeError")}} est déclenchée.</li> + <li>Si l'opération échoue, la promesse lève une exception {{jsxref("WebAssembly.CompileError")}}, {{jsxref("WebAssembly.LinkError")}} ou {{jsxref("WebAssembly.RuntimeError")}} selon la cause de l'échec.</li> +</ul> + +<h2 id="Examples">Examples</h2> + +<p>Dans l'exemple suivant (également disponible sur GitHub : <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/instantiate-streaming.html">instantiate-streaming.html</a> et avec <a href="https://mdn.github.io/webassembly-examples/js-api-examples/instantiate-streaming.html">le résultat <em>live</em></a>), on récupère le flux d'un module .wasm depuis une source, on le compile et on l'instancie. La promesse est alors résolue avec un objet <code>ResultObject</code>. La méthode <code>instantiateStreaming()</code> acceptant une promesse fournissant un objet {{domxref("Response")}}, on peut directement l'appel de {{domxref("WindowOrWorkerGlobalScope.fetch()")}} en argument qui transfèrera la réponse lorsque la promesse résultante sera tenue.</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject) +.then(obj => obj.instance.exports.exported_func());</pre> + +<p>Ensuite, on accède au champ <code>instance</code> de l'objet <code>ResultObject</code> afin de pouvoir invoquer une des fonctions exportées.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly Embedding', '#webassemblyinstantiatestreaming', 'instantiateStreaming()')}}</td> + <td>{{Spec2('WebAssembly Embedding')}}</td> + <td>Brouillon de définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.instantiateStreaming")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">La page d'aperçu de WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript de WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/linkerror/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/linkerror/index.html new file mode 100644 index 0000000000..be70427e74 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/linkerror/index.html @@ -0,0 +1,119 @@ +--- +title: WebAssembly.LinkError() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/LinkError +tags: + - API + - Constructeur + - JavaScript + - LinkError + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/LinkError +--- +<div>{{JSRef}}</div> + +<p>Le constructeur <code><strong>WebAssembly.LinkError()</strong></code> permet de créer un nouvel objet WebAssembly <code>LinkError</code> qui indique qu'une erreur s'est produite lors de l'instanciation du module (en plus <a href="http://webassembly.org/docs/semantics/#traps">des trappes</a> provenant de la fonction initiale).</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">new WebAssembly.LinkError(<var>message</var>, <var>nomFichier</var>, <var>numeroLigne</var>)</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>Une description, compréhensible par un humain, de l'erreur qui s'est produite.</dd> + <dt><code>nomFichier</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>Le nom du fichier qui contient le code à l'origine de l'exception.</dd> + <dt><code>numeroLigne</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>Le numéro de ligne dans le fichier contenant le code à l'origine de l'exception.</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<p><em>Le constructeur <code>LinkError</code> ne contient pas de propriétés qui lui soient propres. Il hérite cependant de certaines propriétés via sa chaîne de prototypes.</em></p> + +<dl> + <dt><code>WebAssembly.LinkError.prototype.constructor</code></dt> + <dd>Cette propriété est la fonction qui permet de créer le prototype de l'instance.</dd> + <dt>{{jsxref("Error.prototype.message", "WebAssembly.LinkError.prototype.message")}}</dt> + <dd>Le message d'erreur. Bien qu'ECMA-262 indique que l'objet doive fournir sa propre propriété <code>message</code>, dans <a href="/fr/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, celle-ci est héritée depuis {{jsxref("Error.prototype.message")}}.</dd> + <dt>{{jsxref("Error.prototype.name", "WebAssembly.LinkError.prototype.name")}}</dt> + <dd>Le nom de l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "WebAssembly.LinkError.prototype.fileName")}}</dt> + <dd>Le chemin du fichier qui a entraîné l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "WebAssembly.LinkError.prototype.lineNumber")}}</dt> + <dd>Le numéro de ligne dans le fichier qui a entraîné l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "WebAssembly.LinkError.prototype.columnNumber")}}</dt> + <dd>Le numéro de la colonne dans la ligne du fichier qui a entraîné l'erreur. Cette propriété est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "WebAssembly.LinkError.prototype.stack")}}</dt> + <dd>La pile d'appels à l'origine de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<p><em>Le constructeur <code>LinkError</code> ne contient pas de méthodes qui lui soient propres. Il hérite toutefois de méthodes grâce à sa chaîne de prototypes.</em></p> + +<dl> + <dt>{{jsxref("Error.prototype.toSource", "WebAssembly.LinkError.prototype.toSource()")}}</dt> + <dd>Cette méthode renvoie un code qui pourrait être évalué et causere la même erreur. Elle est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.toString", "WebAssembly.LinkError.prototype.toString()")}}</dt> + <dd>Cette méthode renvoie une chaîne de caractères qui représente l'objet de l'erreur. Elle est héritée via {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans le fragment de code qui suit, on crée un nouvelle instance de <code>LinkError</code> puis on imprime les détails dans la console :</p> + +<pre class="brush: js">try { + throw new WebAssembly.LinkError('Coucou', 'unFichier', 10); +} catch (e) { + console.log(e instanceof LinkError); // true + console.log(e.message); // "Coucou" + console.log(e.name); // "LinkError" + console.log(e.fileName); // "unFichier" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // renvoie la pile d'appels + // à l'origine de l'erreur +}</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#constructor-properties-of-the-webassembly-object', 'WebAssembly constructors')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard', 'NativeError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Définition des types standards <code>NativeError</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.LinkError")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/memory/buffer/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/memory/buffer/index.html new file mode 100644 index 0000000000..e7c8674713 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/memory/buffer/index.html @@ -0,0 +1,67 @@ +--- +title: WebAssembly.Memory.prototype.buffer +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory/buffer +tags: + - API + - JavaScript + - Propriété + - Reference + - WebAssembly + - memory +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory/buffer +--- +<div>{{JSRef}}</div> + +<p>La propriété <strong><code>buffer</code></strong>, rattachée au prototype de l'objet <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory">Memory</a></code>, renvoie le tampon (<em>buffer</em>) contenu dans l'espace mémoire.</p> + +<pre class="syntaxbox">memory.buffer +</pre> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple suivant (cf. le fichier <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/memory.html">memory.html</a> sur GitHub ainsi que <a href="https://mdn.github.io/webassembly-examples/js-api-examples/memory.html">le résultat obtenu</a>), on récupère puis on instancie le <em>bytecode</em> <code>memory.wasm</code> grâce à la méthode {{jsxref("WebAssembly.instantiateStreaming()")}} tout en important la mémoire créée à la ligne précédente. Ensuite, on enregistre certaines valeurs dans cette mémoire puis on exporte une fonction afin de l'utiliser pour additionner certaines valeurs.</p> + +<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('memory.wasm'), { js: { mem: memory } }) +.then(obj => { + var i32 = new Uint32Array(memory.buffer); + for (var i = 0; i < 10; i++) { + i32[i] = i; + } + var sum = obj.instance.exports.accumulate(0, 10); + console.log(sum); +});</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymemoryprototypebuffer', 'buffer')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Memory.buffer")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/memory/grow/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/memory/grow/index.html new file mode 100644 index 0000000000..89a98ecbed --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/memory/grow/index.html @@ -0,0 +1,81 @@ +--- +title: WebAssembly.Memory.prototype.grow() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory/grow +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly + - memory +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory/grow +--- +<div>{{JSRef}}</div> + +<p>La méthode <strong><code>grow()</code></strong>, rattachée au prototype de l'objet <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory">Memory</a></code>, permet d'augmenter la taille de l'espace mémoire correspondant d'un nombre de pages WebAssembly.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">memory.grow(<em>nombre</em>); +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>nombre</code></dt> + <dd>Le nombre de pages WebAssembly duquel on veut augmenter l'espace mémoire correspondant à l'objet courant (une page mémoire WebAssembly correspond à 64 Ko).</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>La taille de l'espace mémoire avant l'extension, exprimée en nombre de pages WebAssembly.</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans le code qui suit, on crée une instance de <code>Memory</code> qui mesure initialement 1 page (soit 64 Ko) et dont la taille maximale est de 10 pages (soit 6,4 Mo).</p> + +<pre class="brush: js">var memory = new WebAssembly.Memory({initial:10, maximum:100});</pre> + +<p>Ensuite, on augmente la taille de l'espace mémoire d'une page grâce à la méthode :</p> + +<pre class="brush: js">const bytesPerPage = 64 * 1024; +console.log(memory.buffer.byteLength / bytesPerPage); // "1" +console.log(memory.grow(1)); // "1" +console.log(memory.buffer.byteLength / bytesPerPage); // "2"</pre> + +<p>On voit ici que la valeur de <code>grow()</code> indique l'espace utilisé avant l'agrandissement de la mémoire.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymemoryprototypegrow', 'grow()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Memory.grow")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/memory/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/memory/index.html new file mode 100644 index 0000000000..b6469924d1 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/memory/index.html @@ -0,0 +1,123 @@ +--- +title: WebAssembly.Memory() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory +tags: + - API + - Constructeur + - JavaScript + - Object + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory +--- +<div>{{JSRef}}</div> + +<p>Le constructeur <code><strong>WebAssembly.Memory()</strong></code> crée un nouvel objet <code>Memory</code> dont la propriété {{jsxref("WebAssembly/Memory/buffer","buffer")}} est un {{jsxref("ArrayBuffer")}} redimensionnable qui contient les octets de mémoire bruts accessibles par une instance WebAssembly.</p> + +<p>Un espace mémoire créé depuis du code JavaScript ou depuis du code WebAssembly sera accessible et modifiable (<em>mutable</em>) depuis JavaScript <strong>et</strong> depuis WebAssembly.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var maMemoire = new WebAssembly.Memory(descripteurMemoire);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>descripteurMemoire</code></dt> + <dd>Un objet qui contient les propriétés suivantes : + <dl> + <dt><code>initial</code></dt> + <dd>La taille initiale de cet espace mémoire WebAssembly, exprimée en nombre de pages WebAssembly.</dd> + <dt><code>maximum</code> {{optional_inline}}</dt> + <dd>La taille maximale autorisée pour cet espace mémoire WebAssembly, exprimée en nombre de pages WebAssembly. Lorsque ce paramètre est utilisé, il est fournit comme indication au moteur pour que celui-ci réserve l'espace mémoire correspondant. Toutefois, le moteur peut choisir d'ignorer cette indication. Dans la plupart des cas, il n'est pas nécessaire d'indiquer un maximum pour les modules WebAssembly.</dd> + </dl> + </dd> +</dl> + +<div class="note"> +<p><strong>Note : </strong>Une page mémoire WebAssembly correspond à une taille fixe de 65 536 octets, soit environ 64 Ko.</p> +</div> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>Si <code>descripteurMemoire</code> n'est pas un objet, une exception {{jsxref("TypeError")}} sera levée.</li> + <li>Si <code>maximum</code> est indiqué et qu'il est inférieur à <code>initial</code>, une exception {{jsxref("RangeError")}} sera levée.</li> +</ul> + +<h2 id="Méthodes_du_constructeur_Memory">Méthodes du constructeur <code>Memory</code></h2> + +<p>Aucune.</p> + +<h2 id="Instances_de_Memory">Instances de <code>Memory</code></h2> + +<p>Toutes les instances de <code>Memory</code> héritent des propriétés du <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Memory/prototype">prototype du constructeur</a> <code>Memory()</code> qui peut être utilisé afin de modifier le comportement de l'ensemble des instances de <code>Memory</code>.</p> + +<h3 id="Propriétés">Propriétés</h3> + +<dl> + <dt><code>Memory.prototype.constructor</code></dt> + <dd>Renvoie la fonction qui a créé l'instance de l'objet. Par défaut, c'est le constructeur {{jsxref("WebAssembly.Memory()")}}.</dd> + <dt>{{jsxref("WebAssembly/Memory/buffer","Memory.prototype.buffer")}}</dt> + <dd>Une propriété d'accesseur qui renvoie le tampon contenu dans l'espace mémoire.</dd> +</dl> + +<h3 id="Méthodes">Méthodes</h3> + +<dl> + <dt>{{jsxref("WebAssembly/Memory/grow","Memory.prototype.grow()")}}</dt> + <dd>Cette méthode permet d'augmenter la taille de l'espace mémoire d'un nombre de pages donné (dont chacune mesure 64 Ko).</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>Il existe deux façons de créer un objet <code>WebAssembly.Memory</code>. La première consiste à le créer explicitement en JavaScript. Avec l'instruction qui suit, on crée un espace mémoire avec une taille initiale de 10 pages (soit 640 Ko) et une taille maximale de 100 pages (soit 6,4 Mo).</p> + +<pre class="brush: js">var memoire = new WebAssembly.Memory({initial:10, maximum:100});</pre> + +<p>La seconde méthode permettant d'obtenir un objet <code>WebAssembly.Memory</code> est de l'exporter depuis un module WebAssembly. Dans l'exemple suivant (cf. le fichier <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/memory.html">memory.html</a> sur GitHub ainsi que <a href="https://mdn.github.io/webassembly-examples/js-api-examples/memory.html">le résultat obtenu</a>) on récupère et on instancie le <em>bytecode</em> <code>memory.wasm</code> grâce à la méthode {{jsxref("WebAssembly.instantiateStreaming()")}} tout en important la mémoire créée à la ligne précédente. Ensuite, on enregistre des valeurs au sein de cette mémoire puis on exporte une fonction qu'on utilise pour additionner certaines valeurs.</p> + +<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('memory.wasm'), { js: { mem: memory } }) +.then(obj => { + var i32 = new Uint32Array(memory.buffer); + for (var i = 0; i < 10; i++) { + i32[i] = i; + } + var sum = obj.instance.exports.accumulate(0, 10); + console.log(sum); +});</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymemory-objects', 'Memory')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Memory")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/module/customsections/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/module/customsections/index.html new file mode 100644 index 0000000000..5b9185d4f6 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/module/customsections/index.html @@ -0,0 +1,98 @@ +--- +title: WebAssembly.Module.customSections() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module/customSections +tags: + - API + - Constructeur + - JavaScript + - Module + - Méthode + - Object + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Module/customSections +--- +<div>{{JSRef}}</div> + +<p>La méthode <strong><code>WebAssembly.customSections()</code></strong> renvoie un tableau qui contient les sections personnalisées (<em>custom sections</em>) disponibles dans un module WebAssembly et qui ont un nom donné.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var custSec = WebAssembly.Module.customSections(<em>module</em>, <em>nomSection</em>);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>module</code></dt> + <dd>L'objet {{jsxref("WebAssembly.Module")}} pour lequel on veut obtenir les sections personnalisées.</dd> + <dt><code>nomSection</code></dt> + <dd>Le nom de la section personnalisée qu'on souhaite obtenir.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un tableau contenant des {{domxref("ArrayBuffer")}} dont chacun contient les données d'une section personnalisée du module qui correspond à <code>nomSection</code>.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<p>Si le module passé en argument n'est pas une instance de {{jsxref("WebAssembly.Module")}}, la méthode lèvera une exception {{jsxref("TypeError")}}.</p> + +<h2 id="Les_sections_personnalisées">Les sections personnalisées</h2> + +<p>Un module wasm contient une série de <strong>sections</strong>. La plupart de ces sections sont spécifiées et validées par la spécification WebAssembly mais les modules peuvent contenir certaines sections « personnalisées » (<em>custom sections</em>) qui sont ignorées lors de la phase de validation. Pour plus d'informations, consulter<a href="https://github.com/WebAssembly/design/blob/master/BinaryEncoding.md#high-level-structure"> l'article sur les structures de haut niveau</a> qui détaille la structure des sections et les différences entre les sections normales (« connues ») et les sections personnalisées.</p> + +<p>Cela permet aux développeurs d'inclure des données personnalisées dans un module WebAssembly pour d'autres desseins. Par exemple, on peut avoir <a href="https://github.com/WebAssembly/design/blob/master/BinaryEncoding.md#name-section">une section personnalisée <code>name</code></a>, qui permet aux développeurs de fournir des noms pour les fonctions et les variables locales du module (à la façon des « symboles » utilisé pour les programmes compilés).</p> + +<p>Le format WebAssembly ne possède actuellement aucune syntaxe pour ajouter une section personnalisée. Il est toutefois possible d'ajouter une section nommée au module wasm pendant la conversion du texte vers .wasm. La commande <code>wast2wasm</code>, disponible avec l'outil <code><a href="https://github.com/webassembly/wabt">wabt</a></code>, possède une option <code>--debug-names</code> qui permet de créer un module <code>.wasm</code> avec une section personnalisée <code>name</code> :</p> + +<pre class="brush: bash">wast2wasm simple-name-section.was -o simple-name-section.wasm --debug-names</pre> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple qui suit (tiré de <a href="https://github.com/mdn/webassembly-examples/blob/master/other-examples/custom-section.html">ce fichier source</a> et de <a href="https://mdn.github.io/webassembly-examples/other-examples/custom-section.html">cette démonstration</a>), on compile et on instancie le bytecode <code>simple-name-section.wasm</code> et on importe une fonction JavaScript dans le module lors de cette étape. Ensuite, on exporte une fonction depuis le module grâce à <code>Instance.exports</code>.</p> + +<p>On faut aussi une vérification sur <code>WebAssembly.Module.customSections</code> pour vérifier si celle-ci contient une section personnalisée <code>"name"</code> dont on vérifie si la longueur est supérieure à 0. Ce module contenant une section <code>name</code>, les appels à <code>console.log()</code> sont exécutés et montrent que le tableau renvoyé par la méthode contient des objets {{domxref("ArrayBuffer")}}.</p> + +<pre class="brush: js">WebAssembly.compileStreaming(fetch('simple-name-section.wasm')) +.then(function(mod) { + var nameSections = WebAssembly.Module.customSections(mod, "name"); + if (nameSections.length != 0) { + console.log("Le module contient une section nommée"); + console.log(nameSections[0]); + }; +});</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymodulecustomsections', 'customSections()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Module.customSections")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/module/exports/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/module/exports/index.html new file mode 100644 index 0000000000..9f30c87b7d --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/module/exports/index.html @@ -0,0 +1,108 @@ +--- +title: WebAssembly.Module.exports() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module/exports +tags: + - API + - Constructeur + - JavaScript + - Module + - Méthode + - Object + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Module/exports +--- +<div>{{JSRef}}</div> + +<p>La fonction <strong><code>WebAssembly.Module.exports()</code></strong> renvoie un tableau qui contient les descriptions des exports déclarés pour un module donné.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var exports = WebAssembly.Module.exports(module);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>module</code></dt> + <dd>Un objet {{jsxref("WebAssembly.Module")}}.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un tableau qui contient des objets représentants les fonctions exportés du module passé en argument.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<p>Si l'argument n'est pas une instance de {{jsxref("WebAssembly.Module")}}, une exception {{jsxref("TypeError")}} sera levée.</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple suivant (basé sur le fichier <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index-compile.html">index-compile.html</a></code> disponible sur GitHub avec <a href="https://mdn.github.io/webassembly-examples/js-api-examples/index-compile.html">la démonstration correspondante</a>), on compile le <em>bytecode</em> <code>simple.wasm</code> grâce à la fonction {{jsxref("WebAssembly.compileStreaming()")}} puis on envoie le résultat à un <em><a href="/fr/docs/Web/API/Web_Workers_API">worker</a></em> grâce à la méthode <code><a href="/fr/docs/Web/API/Worker/postMessage">postMessage()</a></code>.</p> + +<pre class="brush: js">var worker = new Worker("wasm_worker.js"); + +WebAssembly.compileStreaming(fetch("simple.wasm")) +.then(mod => + worker.postMessage(mod) +);</pre> + +<p>Dans le <em>worker</em> (cf. <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/wasm_worker.js">wasm_worker.js</a></code>), on définit un objet d'import pour le module puis on paramètre un gestionnaire d'évènement afin de recevoir le module depuis le <em>thread</em> principal. Lorsqu'on reçoit le module, on en crée une instance via la méthode {{jsxref("WebAssembly.Instantiate()")}} puis on appelle une fonction exportée et enfin, on affiche les informations relatives aux exports disponibles grâce à <code>WebAssembly.Module.exports</code>.</p> + +<pre class="brush: js">var importObject = { + imports: { + imported_func: function(arg) { + console.log(arg); + } + } +}; + +onmessage = function(e) { + console.log('module reçu du thread principal'); + var mod = e.data; + + WebAssembly.instantiate(mod, importObject).then(function(instance) { + instance.exports.exported_func(); + }); + + var exports = WebAssembly.Module.exports(mod); + console.log(exports[0]); +};</pre> + +<p>La valeur <code>exports[0]</code> ressemblera alors à :</p> + +<pre class="brush: js">{ name: "exported_func", kind: "function" }</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymoduleexports', 'exports()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Module.exports")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/module/imports/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/module/imports/index.html new file mode 100644 index 0000000000..c486bbf8ae --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/module/imports/index.html @@ -0,0 +1,84 @@ +--- +title: WebAssembly.Module.imports() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module/imports +tags: + - API + - JavaScript + - Module + - Méthode + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Module/imports +--- +<div>{{JSRef}}</div> + +<p>La méthode <strong><code>WebAssembly.imports()</code></strong> renvoie un tableau qui contient les références des fonctions importées qui sont disponibles dans un module WebAssembly donné.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var arrImport = WebAssembly.Module.imports(module);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>module</code></dt> + <dd>Une instance de {{jsxref("WebAssembly.Module")}}.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un tableau qui contient des objets représentant les fonctions importées du module passé en argument.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<p>Si <code>module</code> n'est pas une instance de {{jsxref("WebAssembly.Module")}}, une exception {{jsxref("TypeError")}} sera levée.</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple qui suit, on compile le module <code>simple.wasm</code> puis on parcourt ses imports (cf. aussi <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/imports.html">le code sur GitHub</a> et <a href="https://mdn.github.io/webassembly-examples/js-api-examples/imports.html">l'exemple <em>live</em></a>)</p> + +<pre class="brush: js">WebAssembly.compileStreaming(fetch('simple.wasm')) +.then(function(mod) { + var imports = WebAssembly.Module.imports(mod); + console.log(imports[0]); +}); +</pre> + +<p>Le résultat affiché dans la console ressemble alors à :</p> + +<pre class="brush: js">{ module: "imports", name: "imported_func", kind: "function" }</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymoduleimports', 'imports()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initial pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Module.imports")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/module/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/module/index.html new file mode 100644 index 0000000000..7802ae2206 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/module/index.html @@ -0,0 +1,89 @@ +--- +title: WebAssembly.Module() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module +tags: + - Constructeur + - JavaScript + - Module + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Module +--- +<div>{{JSRef}}</div> + +<p>Un objet <strong><code>WebAssembly.Module</code></strong> contient du code WebAssembly, sans état et qui a déjà été compilé par le navigateur. Ce code peut être <a href="/fr/docs/Web/API/Worker/postMessage">partagé avec des <em>web worker</em></a> et être instancié à plusieurs reprises. Pour instancier le module, on pourra appeler la forme secondaire de {{jsxref("WebAssembly.instantiate()")}}.</p> + +<p>Le constructeur <code>WebAssembly.Module()</code> peut être appelé de façon synchrone pour compiler du code WebAssembly. Toutefois, on utilisera généralement la fonction asynchrone {{jsxref("WebAssembly.compile()")}} qui permet de compiler du <em>bytecode</em>.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<div class="warning"> +<p><strong>Important </strong>: La compilation de modules volumineux peut être consommatrice de ressources et de temps. Le constructeur <code>Module()</code> doit uniqument être utilisé lorsqu'il faut absolument avoir une compilation synchrone. Pour tous les autres cas de figures, on privilégiera la méthode asynchrone {{jsxref("WebAssembly.compileStreaming()")}}.</p> +</div> + +<pre class="syntaxbox">var monModule = new WebAssembly.Module(bufferSource);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>bufferSource</code></dt> + <dd>Un <a href="/fr/docs/Web/JavaScript/Tableaux_typés">tableau typé</a> ou un {{jsxref("ArrayBuffer")}} qui contient le <em>bytecode</em> du module WebAssembly qu'on souhaite compiler.</dd> +</dl> + +<h2 id="Méthodes_du_constructeur_Module">Méthodes du constructeur <code>Module</code></h2> + +<dl> + <dt>{{jsxref("Objets_globaux/WebAssembly/Module/customSections", "WebAssembly.Module.customSections()")}}</dt> + <dd>Pour un module donné et une chaîne de caractères donnée, cette méthode renvoie une copie des sections personnalisées (<em>custom sections</em>) du module qui ont le nom correspondant à la chaîne.</dd> + <dt>{{jsxref("Objets_globaux/WebAssembly/Module/exports", "WebAssembly.Module.exports()")}}</dt> + <dd>Pour un module donné, cette méthode renvoie un tableau dont les éléments sont des descriptions des exports déclarés.</dd> + <dt>{{jsxref("Objets_globaux/WebAssembly/Module/imports", "WebAssembly.Module.imports()")}}</dt> + <dd>Pour un module donné, cette méthode renvoie un tableau dont les éléments sont des descriptions des imports déclarés.</dd> +</dl> + +<h2 id="Instances_de_Module">Instances de <code>Module</code></h2> + +<p>Toutes les instances de <code>Module</code> héritent du prototype du constructeur <code>Module()</code>, celui-ci peut être modifié afin de moifier le comportement de l'ensemble des instances de <code>Module</code>.</p> + +<h3 id="Propriétés">Propriétés</h3> + +<p>{{page('/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Module/prototype', 'Propriétés')}}</p> + +<h3 id="Méthodes">Méthodes</h3> + +<p>Les instances de <code>Module</code> ne disposent pas de méthodes en propre.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymodule-objects', 'WebAssembly.Module()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Module")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/runtimeerror/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/runtimeerror/index.html new file mode 100644 index 0000000000..b35e50e466 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/runtimeerror/index.html @@ -0,0 +1,119 @@ +--- +title: WebAssembly.RuntimeError() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/RuntimeError +tags: + - API + - Constructeur + - JavaScript + - Reference + - RuntimeError + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/RuntimeError +--- +<div>{{JSRef}}</div> + +<p>Le constructeur <code><strong>WebAssembly.RuntimeError()</strong></code> permet de créer un nouvel objet WebAssembly <code>RuntimeError</code>. C'est ce type d'exception qui est déclenchée lorsque WebAssembly définit <a href="http://webassembly.org/docs/semantics/#traps">une trappe</a>.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">new WebAssembly.RuntimeError(<var>message</var>, <var>nomFichier</var>, <var>numeroLigne</var>)</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>Une description, compréhensible par un humain, de l'erreur qui s'est produite.</dd> + <dt><code>fileName</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>Le nom du fichier qui contient le code à l'origine de l'exception.</dd> + <dt><code>lineNumber</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>Le numéro de la ligne de code à l'origine de l'exception.</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<p><em>Le constructeur <code>RuntimeError</code> ne contient aucune propriété qui lui soit propre. En revanche, il hérite de certaines propriétés grâce à sa chaîne de prototypes.</em></p> + +<dl> + <dt><code>WebAssembly.RuntimeError.prototype.constructor</code></dt> + <dd>La fonction qui a créé le prototype de l'instance.</dd> + <dt>{{jsxref("Error.prototype.message", "WebAssembly.RuntimeError.prototype.message")}}</dt> + <dd>Le message qui décrit l'erreur. Bien qu'ECMA-262 indique que chaque instance doit fournir sa propre propriété <code>message</code>, dans <a href="/fr/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, elle est héritée depuis {{jsxref("Error.prototype.message")}}.</dd> + <dt>{{jsxref("Error.prototype.name", "WebAssembly.RuntimeError.prototype.name")}}</dt> + <dd>Le nom de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "WebAssembly.RuntimeError.prototype.fileName")}}</dt> + <dd>Le chemin du fichier à l'origine de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "WebAssembly.RuntimeError.prototype.lineNumber")}}</dt> + <dd>Le numéro de la ligne à l'origine de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "WebAssembly.RuntimeError.prototype.columnNumber")}}</dt> + <dd>Le numéro de la colonne dans la ligne qui est à l'origine de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "WebAssembly.RuntimeError.prototype.stack")}}</dt> + <dd>La pile d'appels à l'origine de l'erreur. Cette propriété est héritée depuis {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<p><em>Le constructeur <code>RuntimeError</code> ne contient aucune méthode qui lui soit propre. En revanche, il hérite de certaines méthodes grâce à sa chaîne de prototypes.</em></p> + +<dl> + <dt>{{jsxref("Error.prototype.toSource", "WebAssembly.RuntimeError.prototype.toSource()")}}</dt> + <dd>Cette méthode renvoie un code qui, évalué, entraînerait la même erreur. Elle est héritée via {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.toString", "WebAssembly.RuntimeError.prototype.toString()")}}</dt> + <dd>Cette méthode renvoie une chaîne de caractères qui représente l'objet <code>Error</code>. Elle est héritée via {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans le fragment de code qui suit, on crée une instance de <code>RuntimeError</code> et on imprime les détails de cette erreur dans la console :</p> + +<pre class="brush: js">try { + throw new WebAssembly.RuntimeError('Coucou', 'unFichier', 10); +} catch (e) { + console.log(e instanceof RuntimeError); // true + console.log(e.message); // "Coucou" + console.log(e.name); // "RuntimeError" + console.log(e.fileName); // "unFichier" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // renvoie la pile d'appels + // à l'origine de l'erreur +}</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#constructor-properties-of-the-webassembly-object', 'WebAssembly constructors')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initial pour WebAssembly.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard', 'NativeError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Définition des types standards <code>NativeError</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.RuntimeError")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/table/get/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/table/get/index.html new file mode 100644 index 0000000000..25c8ec97db --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/table/get/index.html @@ -0,0 +1,83 @@ +--- +title: WebAssembly.Table.prototype.get() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Table/get +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly + - table +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/get +--- +<div>{{JSRef}}</div> + +<p>La méthode <code><strong>get()</strong></code>, rattachéee au prototype de {{jsxref("WebAssembly.Table()")}}, permet de récupérer une référence à une fonction stockée dans le tableau WebAssembly grâce à sa position. dans le tableau.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var funcRef = table.get(<em>index</em>); +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>index</code></dt> + <dd>L'index de la référence de fonction qu'on souhaite récupérer.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Une référence de fonction, c'est-à-dire <a href="/fr/docs/WebAssembly/Exported_functions">une fonction WebAssembly exportée</a> qui est une enveloppe JavaScript pour manipuler la fonction WebAssembly sous-jacente.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<p>Si <code>index</code> est supérieur ou égal à {{jsxref("WebAssembly/Table/length","Table.prototype.length")}}, la méthode lèvera une exception {{jsxref("RangeError")}}.</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple suivant (cf. le fichier <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table.html">table.html</a></code> sur GitHub ainsi que <a href="https://mdn.github.io/webassembly-examples/js-api-examples/table.html">le résultat obtenu</a>), on compile et on instancie le <em>bytecode</em> chargé, <code>table.wasm</code>, grâce à la méthode {{jsxref("WebAssembly.instantiateStreaming()")}}. On récupère ensuite les références stockées dans le tableau d'export.</p> + +<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('table.wasm')) +.then(function(obj) { + var tbl = obj.instance.exports.tbl; + console.log(tbl.get(0)()); // 13 + console.log(tbl.get(1)()); // 42 +});</pre> + +<p>On note ici qu'il est nécessaire d'avoir un deuxième opérateur d'appel après l'accesseur pour récupérer le valeur stockée dans la référence (autrement dit, on utilise <code>get(0)()</code> plutôt que <code>get(0)</code>). La valeur exportée est une fonction plutôt qu'une valeur simple.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblytableprototypeget', 'get()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initial pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.Table.get")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/table/grow/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/table/grow/index.html new file mode 100644 index 0000000000..4e90a70f22 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/table/grow/index.html @@ -0,0 +1,83 @@ +--- +title: WebAssembly.Table.prototype.grow() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Table/grow +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly + - table +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/grow +--- +<div>{{JSRef}}</div> + +<p>La méthode <code><strong>grow()</strong></code>, rattachée au prototype de {{jsxref("WebAssembly.Table")}}, permet d'augmenter la taille du tableau WebAssembly d'un nombre d'éléments donné.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">table.grow(<em>nombre</em>); +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>nombre</code></dt> + <dd>Le nombre d'éléments qu'on souhaite ajouter au tableau.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>La taille du tableau avant l'agrandissement.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<p>Si l'opération <code>grow()</code> échoue, pour quelque raison que ce soit, une exception {{jsxref("RangeError")}} sera levée.</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple qui suit, on crée une instance de <code>Table</code> pour représenter un tableau WebAssembly avec une taille initiale de 2 et une taille maximale de 10.</p> + +<pre class="brush: js">var table = new WebAssembly.Table({ element: "anyfunc", initial: 2, maximum: 10 });</pre> + +<p>On étend ensuite le tableau d'une unité en utilisant la méthode <code>grow()</code> :</p> + +<pre class="brush: js">console.log(table.length); // "2" +console.log(table.grow(1)); // "2" +console.log(table.length); // "3" +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblytableprototypegrow', 'grow()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Table.grow")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/table/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/table/index.html new file mode 100644 index 0000000000..ab26074ab6 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/table/index.html @@ -0,0 +1,137 @@ +--- +title: WebAssembly.Table() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Table +tags: + - API + - Constructeur + - JavaScript + - Reference + - WebAssembly + - table +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table +--- +<div>{{JSRef}}</div> + +<p>Le constructeur <code><strong>WebAssembly.Table()</strong></code> permet de créer un nouvel objet <code>Table</code>.</p> + +<p>Cet objet est une enveloppe JavaScript qui représente un tableau WebAssembly et qui contient des références à des fonctions. Un tableau créé en JavaScript ou dans du code WebAssembly sera accessible et modifiable depuis du code JavaScript et depuis du code WebAssembly.</p> + +<div class="note"> +<p><strong>Note :</strong> Actuellement, les tableaux WebAssembly peuvent uniquement stocker des références à des fonctions. Cette fonctionnalité sera vraisemblablement étendue par la suite.</p> +</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var monTableau = new WebAssembly.Table(descripteurTableau);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>descripteurTableau</code></dt> + <dd>Un objet composé des propriétés qui suivent : + <dl> + <dt><code>element</code></dt> + <dd>Une chaîne de caractères qui représente le type de référence enregistrée dans le tableau. Actuellement, la seule valeur possible est <code>"anyfunc"</code> (pour indiquer des fonctions).</dd> + <dt><code>initial</code></dt> + <dd>La longueur initiale du tableau WebAssembly. Cela correspond au nombre d'éléments contenus dans le tableau.</dd> + <dt><code>maximum {{optional_inline}}</code></dt> + <dd>La taille maximale que pourra avoir tableau WebAssembly s'il est étendu.</dd> + </dl> + </dd> +</dl> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>Si <code>tableDescriptor</code> n'est pas un objet, une exception {{jsxref("TypeError")}} sera levée.</li> + <li>Si <code>maximum</code> est défini et est inférieur à <code>initial</code>, une exception {{jsxref("RangeError")}} sera levée.</li> +</ul> + +<h2 id="Instances_de_Table">Instances de <code>Table</code></h2> + +<p>Toutes les instances <code>Table</code> héritent des propriétés <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/WebAssembly/Table/prototype">du prototype du constructeur</a> <code>Table()</code>. Ce dernier peut être utilisé afin de modifier l'ensemble des instances <code>Table</code>.</p> + +<h3 id="Propriétés">Propriétés</h3> + +<dl> + <dt><code>Table.prototype.constructor</code></dt> + <dd>Renvoie la fonction qui a créé l'instance. Par défaut, c'est le constructeur {{jsxref("WebAssembly.Table()")}}.</dd> + <dt>{{jsxref("WebAssembly/Table/length","Table.prototype.length")}}</dt> + <dd>Renvoie la longueur du tableau, c'est-à-dire le nombre de références qui sont enregistrées dans le tableau.</dd> +</dl> + +<h3 id="Méthodes">Méthodes</h3> + +<dl> + <dt>{{jsxref("WebAssembly/Table/get","Table.prototype.get()")}}</dt> + <dd>Une fonction d'accès qui permet d'obtenir l'élément du tableau situé à une position donnée.</dd> + <dt>{{jsxref("WebAssembly/Table/grow","Table.prototype.grow()")}}</dt> + <dd>Cette méthode permet d'augmenter la taille du tableau <code>Tabl</code><code>e</code> d'un incrément donné.</dd> + <dt>{{jsxref("WebAssembly/Table/set","Table.prototype.set()")}}</dt> + <dd>Cette méthode permet de modifier un élément du tableau situé à une position donnée.</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple qui suit (tiré du fichier <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.html">table2.html</a> et qui dispose <a href="https://mdn.github.io/webassembly-examples/js-api-examples/table2.html">d'une démonstration</a>), on crée une nouvelle instance d'un tableau WebAssembly avec une taille initiale permettant de stocker 2 références. Ensuite, on imprime la longueur du tableau et le contenu des deux éléments (obtenus grâce à la méthode {{jsxref("WebAssembly/Table/get", "Table.prototype.get()")}} afin de montrer que la longueur vaut 2 et que le tableau ne contient encore aucune référence de fonction (pour les deux positions, on a la valeur {{jsxref("null")}}).</p> + +<pre class="brush: js">var tbl = new WebAssembly.Table({initial:2, element:"anyfunc"}); +console.log(tbl.length); +console.log(tbl.get(0)); +console.log(tbl.get(1));</pre> + +<p>Ensuite, on crée un objet d'import qui contient une référence au tableau :</p> + +<pre class="brush: js">var importObj = { + js: { + tbl:tbl + } +};</pre> + +<p>Enfin, on charge et on instancie un module WebAssembly (table2.wasm) grâce à la fonction {{jsxref("WebAssembly.instantiateStreaming()")}}. Le module <code>table2.wasm</code> a ajouté deux références de fonctions (cf. <a href="https://github.com/mdn/webassembly-examples/blob/0991effbbf2e2cce38a7dbadebd2f3495e3f4e07/js-api-examples/table2.wat">sa représentation textuelle</a>). Chacune de ces fonctions fournit une valeur simple :</p> + +<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('table2.wasm'), importObject) +.then(function(obj) { + console.log(tbl.length); // "2" + console.log(tbl.get(0)()); // "42" + console.log(tbl.get(1)()); // "83" +});</pre> + +<p>On voit ici qu'il faut d'abord récupérer la fonction puis effectuer une invocation pour obtenir la valeur correspondante à partir de l'accesseur (autrement dit, on écrit <code>get(0)()</code> plutôt que <code>get(0)</code> pour obtenir le résultat de la fonction) .</p> + +<p>Dans cet exemple, on voit comment créer et manipuler le tableau depuis du code JavaScript mais ce même tableau est également accessible depuis l'instance WebAssembly.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblytable-objects', 'Table')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initial pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Table")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/table/length/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/table/length/index.html new file mode 100644 index 0000000000..d573097bc0 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/table/length/index.html @@ -0,0 +1,68 @@ +--- +title: WebAssembly.Table.prototype.length +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Table/length +tags: + - API + - JavaScript + - Propriété + - Reference + - WebAssembly + - table +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/length +--- +<div>{{JSRef}}</div> + +<p>La propriété <code><strong>length</strong></code>, rattachée au prototype de l'objet {{jsxref("WebAssembly.Table")}}, renvoie la longueur du tableau WebAssembly, c'est-à-dire le nombre d'éléments qui y sont stockées.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">table.length; +</pre> + +<h2 id="Exemples">Exemples</h2> + +<p>Avec l'instruction qui suit, on crée un tableau WebAssembly avec une taille initiale de 2 éléments et avec une taille maximale de 10.</p> + +<pre class="brush: js">var table = new WebAssembly.Table({ element: "anyfunc", initial: 2, maximum: 10 });</pre> + +<p>On peut ensuite étendre le tableau d'un élément :</p> + +<pre class="brush: js">console.log(table.length); // "2" +console.log(table.grow(1)); // "2" +console.log(table.length); // "3" +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblytableprototypelength', 'length')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Table.length")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/table/set/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/table/set/index.html new file mode 100644 index 0000000000..c7b57a88b8 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/table/set/index.html @@ -0,0 +1,105 @@ +--- +title: WebAssembly.Table.prototype.set() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/Table/set +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly + - table +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/set +--- +<div>{{JSRef}}</div> + +<p>La méthode <code><strong>set()</strong></code>, rattachée au prototype de {{jsxref("WebAssembly.Table")}}, permet de modifier une référence de fonction stockée dans un tableau WebAssembly.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">table.set(<em>index</em>, <em>valeur</em>); +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>index</code></dt> + <dd>L'index de la référence de la fonction qu'on souhaite modifier.</dd> + <dt><code>valeur</code></dt> + <dd>La valeur par laquelle on souhaite remplacer la référence. Cette valeur doit être <a href="/fr/docs/WebAssembly/Exported_functions">une fonction exportée WebAssembly</a> (c'est-à-dire une enveloppe JavaScript représentant une fonction WebAssembly sous-jacente).</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Aucune.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>Si <code>index</code> est supérieur ou égal à {{jsxref("WebAssembly/Table/length","Table.prototype.length")}}, une exception {{jsxref("RangeError")}} sera levée.</li> + <li>Si <code>valeur</code> n'est pas une fonction WebAssembly exportée ou la valeur {{jsxref("null")}}, une exception {{jsxref("TypeError")}} sera levée.</li> +</ul> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple qui suit (basé sur le <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.html">code source de <code>table2.html</code></a> et qui dispose <a href="https://mdn.github.io/webassembly-examples/js-api-examples/table2.html">d'une démonstration</a>), on crée ue nouvelle instance d'un tableau WebAssembly (<code>Table</code>) qui permet initialement de stocker 2 référence. On imprime alors la longueur du tableau dans la console ainsi que le contenu pour les deux premiers index (obtenus grâce à la méthode {{jsxref("WebAssembly/Table/get","Table.prototype.get()")}}) afin de montrer qu la longueur vaut 2 et qu'initialement, les deux éléments du tableau ne contiennent aucune référence (ils ont tous les deux la valeur {{jsxref("null")}}).</p> + +<pre class="brush: js">var tbl = new WebAssembly.Table({initial:2, element:"anyfunc"}); +console.log(tbl.length); +console.log(tbl.get(0)); +console.log(tbl.get(1));</pre> + +<p>On crée ensuite un objet d'import qui contient une référence au tableau :</p> + +<pre class="brush: js">var importObj = { + js: { + tbl:tbl + } +};</pre> + +<p>Enfin, on charge et on instancie le module WebAssembly (<code>table2.wasm</code>) grâce à la méthode {{jsxref("WebAssembly.instantiateStreaming()")}}, on logge la longueur du tableau et on appelle les deux fonctions référencées qui sont désormais dans le tableau (le module <code>table2.wasm</code> (cf. <a href="https://github.com/mdn/webassembly-examples/blob/master/text-format-examples/table2.was">la représentation textuelle</a>) ajoute deux références de fonctions au tableau et chacune affiche une valeur simple) :</p> + +<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('table2.wasm'), importObject) +.then(function(obj) { + console.log(tbl.length); + console.log(tbl.get(0)()); + console.log(tbl.get(1)()); +});</pre> + +<p>On voit ici qu'il faut appeler la fonction après avoir appeler l'opérateur sur l'accesseur (autrement dit, on écrit <code>get(0)()</code> plutôt que <code>get(0)</code>) .</p> + +<p>Dans cet exemple, on montre comment créer et manipuler un tableau en JavaScript mais ce tableau est également accessible et manipulable depuis l'instance WebAssembly.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblytableprototypeset', 'set()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Table.set")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> diff --git a/files/fr/web/javascript/reference/global_objects/webassembly/validate/index.html b/files/fr/web/javascript/reference/global_objects/webassembly/validate/index.html new file mode 100644 index 0000000000..c00eb54e12 --- /dev/null +++ b/files/fr/web/javascript/reference/global_objects/webassembly/validate/index.html @@ -0,0 +1,81 @@ +--- +title: WebAssembly.validate() +slug: Web/JavaScript/Reference/Objets_globaux/WebAssembly/validate +tags: + - API + - JavaScript + - Méthode + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/validate +--- +<div>{{JSRef}}</div> + +<p>La fonction <strong><code>WebAssembly.validate()</code></strong> permet de valider un <a href="/fr/docs/Web/JavaScript/Tableaux_typés">tableau typé</a> de <em>bytecode</em> WebAssembly et renvoie un booléen qui indique si le contenu du tableau forme un module WebAssembly valide (<code>true</code>) ou non (<code>false</code>).</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">WebAssembly.validate(bufferSource);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>bufferSource</code></dt> + <dd>Un <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/TypedArray">tableau typé</a> ou un {{jsxref("ArrayBuffer")}} qui contient le <em>bytecode</em> du module qu'on souhaite valider.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un booléen qui indique si la source est un code WebAssembly valide (<code>true</code>) ou non (<code>false</code>).</p> + +<h3 id="Exceptions">Exceptions</h3> + +<p>Si la valeur passée en argument n'est pas un tableau typé ou un {{jsxref("ArrayBuffer")}}, une exception {{jsxref("TypeError")}} sera levée.</p> + +<h2 id="Exemples">Exemples</h2> + +<p>Dans l'exemple suivant, (cf. le fichier <code>validate.html</code> du <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/validate.html">code source</a>, ainsi que <a href="https://mdn.github.io/webassembly-examples/js-api-examples/validate.html">l'exemple <em>live</em></a>), on récupère un module .wasm et on le convertit en un tableau typé. Ensuite, on appelle la méthode <code>validate()</code> afin de vérifier si le module est valide.</p> + +<pre class="brush: js">fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(function(bytes) { + var valid = WebAssembly.validate(bytes); + console.log("Les octets forment un module " + + (valid ? "" : "in") + "valide."); +}); +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyvalidate', 'validate()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Brouillon de définition initiale pour WebAssembly.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.WebAssembly.validate")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/WebAssembly">Le portail WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Concepts">Les concepts relatifs à WebAssembly</a></li> + <li><a href="/fr/docs/WebAssembly/Using_the_JavaScript_API">Utiliser l'API JavaScript WebAssembly</a></li> +</ul> |