From 1a4be8c32441258acc4a8f3cc052b2f58c2ebc68 Mon Sep 17 00:00:00 2001 From: "Queen Vinyl Da.i'gyu-Kazotetsu" Date: Fri, 28 Jul 2023 01:49:33 -0700 Subject: [PATCH] fr: Format /web/javascript using Prettier (part 10) (#14649) --- .../operators/comma_operator/index.md | 14 +- .../operators/conditional_operator/index.md | 51 +++---- .../reference/operators/delete/index.md | 56 +++---- .../destructuring_assignment/index.md | 122 ++++++++------- .../reference/operators/division/index.md | 14 +- .../operators/division_assignment/index.md | 12 +- .../reference/operators/equality/index.md | 38 ++--- .../operators/exponentiation/index.md | 22 +-- .../exponentiation_assignment/index.md | 8 +- .../reference/operators/function/index.md | 18 +-- .../operators/function_star_/index.md | 4 +- .../reference/operators/greater_than/index.md | 52 +++---- .../operators/greater_than_or_equal/index.md | 48 +++--- .../reference/operators/grouping/index.md | 8 +- .../reference/operators/import.meta/index.md | 2 +- .../reference/operators/import/index.md | 6 +- .../reference/operators/in/index.md | 44 +++--- .../reference/operators/inequality/index.md | 42 +++--- .../reference/operators/instanceof/index.md | 10 +- .../reference/operators/left_shift/index.md | 2 +- .../operators/left_shift_assignment/index.md | 4 +- .../reference/operators/less_than/index.md | 52 +++---- .../operators/less_than_or_equal/index.md | 48 +++--- .../reference/operators/logical_and/index.md | 47 +++--- .../operators/logical_and_assignment/index.md | 2 +- .../reference/operators/logical_not/index.md | 26 ++-- .../reference/operators/logical_or/index.md | 49 +++--- .../operators/logical_or_assignment/index.md | 4 +- .../operators/multiplication/index.md | 12 +- .../multiplication_assignment/index.md | 8 +- .../reference/operators/new.target/index.md | 12 +- .../reference/operators/new/index.md | 40 ++--- .../reference/operators/null/index.md | 24 +-- .../operators/nullish_coalescing/index.md | 35 +++-- .../nullish_coalescing_assignment/index.md | 2 +- .../operators/object_initializer/index.md | 80 +++++----- .../operators/operator_precedence/index.md | 4 +- .../operators/optional_chaining/index.md | 31 ++-- .../operators/property_accessors/index.md | 19 ++- .../reference/operators/remainder/index.md | 26 ++-- .../operators/remainder_assignment/index.md | 10 +- .../reference/operators/right_shift/index.md | 4 +- .../operators/right_shift_assignment/index.md | 8 +- .../operators/spread_syntax/index.md | 53 ++++--- .../operators/strict_equality/index.md | 34 ++--- .../operators/strict_inequality/index.md | 38 ++--- .../reference/operators/subtraction/index.md | 8 +- .../operators/subtraction_assignment/index.md | 8 +- .../reference/operators/super/index.md | 25 ++-- .../reference/operators/this/index.md | 87 ++++++----- .../reference/operators/typeof/index.md | 96 ++++++------ .../operators/unary_negation/index.md | 2 +- .../reference/operators/unary_plus/index.md | 12 +- .../operators/unsigned_right_shift/index.md | 4 +- .../unsigned_right_shift_assignment/index.md | 8 +- .../reference/operators/void/index.md | 34 ++--- .../reference/operators/yield/index.md | 4 +- .../reference/operators/yield_star_/index.md | 7 +- .../unicode_character_class_escape/index.md | 76 +++++----- .../statements/async_function/index.md | 84 ++++++----- .../statements/async_function_star_/index.md | 17 ++- .../reference/statements/break/index.md | 27 ++-- .../reference/statements/class/index.md | 12 +- .../reference/statements/continue/index.md | 46 +++--- .../reference/statements/debugger/index.md | 6 +- .../reference/statements/do...while/index.md | 7 +- .../reference/statements/empty/index.md | 23 ++- .../reference/statements/export/index.md | 36 ++--- .../statements/for-await...of/index.md | 16 +- .../reference/statements/for...in/index.md | 8 +- .../reference/statements/for...of/index.md | 43 +++--- .../reference/statements/for/index.md | 46 ++++-- .../reference/statements/function/index.md | 26 +++- .../statements/function_star_/index.md | 30 ++-- .../reference/statements/if...else/index.md | 12 +- .../reference/statements/import/index.md | 53 ++++--- .../reference/statements/label/index.md | 45 +++--- .../reference/statements/let/index.md | 67 +++++---- .../reference/statements/return/index.md | 21 +-- .../reference/statements/switch/index.md | 141 +++++++++--------- .../reference/statements/throw/index.md | 134 +++++++++-------- .../reference/statements/try...catch/index.md | 79 ++++------ .../reference/statements/var/index.md | 103 ++++++------- .../reference/statements/while/index.md | 6 +- .../reference/statements/with/index.md | 21 ++- .../javascript/reference/strict_mode/index.md | 98 ++++++------ .../reference/template_literals/index.md | 61 ++++---- .../reference/trailing_commas/index.md | 26 ++-- 88 files changed, 1491 insertions(+), 1419 deletions(-) diff --git a/files/fr/web/javascript/reference/operators/comma_operator/index.md b/files/fr/web/javascript/reference/operators/comma_operator/index.md index 67beeef75b2426..d636899af1b9e0 100644 --- a/files/fr/web/javascript/reference/operators/comma_operator/index.md +++ b/files/fr/web/javascript/reference/operators/comma_operator/index.md @@ -32,7 +32,7 @@ L'opérateur virgule est à différencier de la virgule utilisée pour séparer SI on a un tableau à 2 dimensions appelé `monTableau`, qui possède 10 éléments ayant chacun 10 éléments, on peut utiliser le code suivant avec l'opérateur virgule afin d'incrémenter deux variables (`i` et `j`) à la fois. Attention, la virgule utilisée au sein de l'instruction `var` **n'est pas** l'opérateur virgule (car il ne peut exister au sein d'une expression) ; ici c'est un caractère spécial de l'instruction {{jsxref("Instructions/var","var")}}. Le code qui suit affiche les éléments présents sur la diagonale de cette matrice : ```js -for (var i = 0, j = 9; i <= 9; i++, j--){ +for (var i = 0, j = 9; i <= 9; i++, j--) { console.log("monTableau[" + i + "][" + j + "] = " + monTableau[i][j]); } ``` @@ -41,16 +41,16 @@ Dans le code suivant, `a` est défini avec la valeur de `b = 3` (qui est 3) et l ```js var a, b, c; -a = b = 3, c = 4; // Renvoie 4 dans la console -console.log(a); // 3 +(a = b = 3), (c = 4); // Renvoie 4 dans la console +console.log(a); // 3 ``` Pour isoler la précédence de l'opérateur, on peut utiliser des parenthèses : ```js var x, y, z; -x = (y = 5, z = 6); // Renvoie 6 dans la console -console.log(x); // 6 +x = ((y = 5), (z = 6)); // Renvoie 6 dans la console +console.log(x); // 6 ``` ### Effectuer un traitement puis renvoyer une valeur @@ -58,10 +58,10 @@ console.log(x); // 6 Un autre exemple consiste à effectuer un certain traitement sur la variable puis à renvoyer le résultat. Par définition, seul le dernier élément sera renvoyé mais les instructions précédentes seront bien exécutées. AInsi, on pourrait avoir : ```js -function maFonction () { +function maFonction() { var x = 0; - return (x += 1, x); // ce qui revient à renvoyer ++x + return (x += 1), x; // ce qui revient à renvoyer ++x } ``` diff --git a/files/fr/web/javascript/reference/operators/conditional_operator/index.md b/files/fr/web/javascript/reference/operators/conditional_operator/index.md index 06a20919b9b73f..688d285401caa3 100644 --- a/files/fr/web/javascript/reference/operators/conditional_operator/index.md +++ b/files/fr/web/javascript/reference/operators/conditional_operator/index.md @@ -13,7 +13,7 @@ L'**opérateur (ternaire) conditionnel** est le seul opérateur JavaScript qui c ## Syntaxe ```js -condition ? exprSiVrai : exprSiFaux +condition ? exprSiVrai : exprSiFaux; ``` ### Paramètres @@ -30,7 +30,7 @@ condition ? exprSiVrai : exprSiFaux SI `condition` vaut `true`, l'opérateur renverra la valeur d'`exprSiVrai;` dans le cas contraire, il renverra la valeur de `exprSiFaux`. Par exemple, on peut afficher un message différent en fonction d'une variable `estMembre` avec cette déclaration : ```js -"Le prix est : " + (estMembre ? "15 €" : "30 €") +"Le prix est : " + (estMembre ? "15 €" : "30 €"); ``` On peut également affecter des variables dont la valeur dépendra du test : @@ -43,8 +43,12 @@ On peut enchaîner plusieurs évaluations ternaires l'une à la suite de l'autre ```js var premierControle = false, - secondControle = false, - acces = premierControle ? "Accès refusé" : secondControle ? "Accès refusé" : "Accès autorisé"; + secondControle = false, + acces = premierControle + ? "Accès refusé" + : secondControle + ? "Accès refusé" + : "Accès autorisé"; console.log(acces); // "Accès autorisé" ``` @@ -52,23 +56,21 @@ console.log(acces); // "Accès autorisé" Il est également possible d'utiliser cet opérateur pour effectuer l'une ou l'autre expression selon le cas de figure qui se présente : ```js -var stop = false, age = 16; +var stop = false, + age = 16; -age > 18 ? location.assign("continue.html") : stop = true; +age > 18 ? location.assign("continue.html") : (stop = true); ``` en utilisant l'{{jsxref("Opérateurs/L_opérateur_virgule","opérateur virgule")}}, on peut même y placer plusieurs instructions (attention toutefois à la lisibilité et à se demander si un {{jsxref("Instructions/if...else","if...else")}} n'est pas plus approprié). ```js -var stop = false, age = 23; - -age > 18 ? ( - console.log("OK, accès autorisé."), - location.assign("continue.html") -) : ( - stop = true, - console.log("Accès refusé !") -); +var stop = false, + age = 23; + +age > 18 + ? (console.log("OK, accès autorisé."), location.assign("continue.html")) + : ((stop = true), console.log("Accès refusé !")); ``` De la même façon, on peut effectuer plusieurs opérations, encadrées par des parenthèses, avant d'affecter le résultat de l'opérateur à une variable. Conformément à l'opérateur virgule, ce sera **_la dernière valeur qui sera affectée_**. Ici aussi, attention à la lisibilité du code relativement à un `if...else`. @@ -76,16 +78,15 @@ De la même façon, on peut effectuer plusieurs opérations, encadrées par des ```js var age = 16; -var url = age > 18 ? ( - console.log("Accès autorisé."), - // console.log renvoie "undefined", mais cela importe peu car - // ce n'est pas le dernier élément de l'expression - "continue.html" // la valeur à affecter si âge > 18 -) : ( - console.log("Accès refusé !"), - // etc. - "stop.html" // la valeur à affecter si âge <= 18 -); +var url = + age > 18 + ? (console.log("Accès autorisé."), + // console.log renvoie "undefined", mais cela importe peu car + // ce n'est pas le dernier élément de l'expression + "continue.html") // la valeur à affecter si âge > 18 + : (console.log("Accès refusé !"), + // etc. + "stop.html"); // la valeur à affecter si âge <= 18 location.assign(url); // "stop.html" ``` diff --git a/files/fr/web/javascript/reference/operators/delete/index.md b/files/fr/web/javascript/reference/operators/delete/index.md index 9f504fe5cb8ccc..864b97e9766486 100644 --- a/files/fr/web/javascript/reference/operators/delete/index.md +++ b/files/fr/web/javascript/reference/operators/delete/index.md @@ -13,14 +13,14 @@ L'opérateur **`delete`** permet de retirer une propriété d'un objet. ## Syntaxe ```js -delete expression +delete expression; ``` où _expression_ est évaluée comme une référence à une propriété : ```js -delete objet.propriete -delete objet['propriete'] +delete objet.propriete; +delete objet["propriete"]; ``` ### Paramètres @@ -59,12 +59,12 @@ Voici un fragment de code qui illustre certains cas : ```js var Employe = { age: 28, - nom: 'abc', - designation: 'developpeur' -} + nom: "abc", + designation: "developpeur", +}; -console.log(delete Employe.nom); // renvoie true -console.log(delete Employe.age); // renvoie true +console.log(delete Employe.nom); // renvoie true +console.log(delete Employe.age); // renvoie true // Lorsqu'on souhaite supprimer une propriété // inexistante, on obtient true @@ -77,19 +77,19 @@ Lorsqu'une propriété est marquée comme non-configurable, `delete` n'aura aucu ```js var Employe = {}; -Object.defineProperty(Employe, 'nom', {configurable: false}); +Object.defineProperty(Employe, "nom", { configurable: false }); -console.log(delete Employe.nom); // renvoie false +console.log(delete Employe.nom); // renvoie false ``` {{jsxref("Instructions/var","var")}} (ou `let` ou `const`) crée des propriétés non-configurables qui ne peuvent pas être supprimées via `delete` : ```js -var autreNom = 'XYZ'; +var autreNom = "XYZ"; // On peut accéder à la description de cette // propriété globale grâce à : -Object.getOwnPropertyDescriptor(window, 'autreNom') +Object.getOwnPropertyDescriptor(window, "autreNom"); /* Object {value: "XYZ", writable: true, @@ -100,7 +100,7 @@ Object.getOwnPropertyDescriptor(window, 'autreNom') // On voit que "autreNom", ajouté avec var // est marquée comme "non-configurable" -delete autreNom; // renvoie false +delete autreNom; // renvoie false ``` En mode strict, cela aurait déclenché une exception. @@ -126,7 +126,7 @@ Voyons comment ce code se comporte en mode strict : au lieu de renvoyer false, l "use strict"; function Employe() { - delete salaire; // SyntaxError + delete salaire; // SyntaxError var salaire; } @@ -144,25 +144,25 @@ delete DemoFunction; // SyntaxError ```js // on crée la propriété adminName sur la portée globale -adminName = 'xyz'; +adminName = "xyz"; // on crée la propriété empCount sur la portée globale // On utilise var, elle est donc non-configurable var empCount = 43; EmployeeDetails = { - name: 'xyz', + name: "xyz", age: 5, - designation: 'Developer' + designation: "Developer", }; // adminName est une propriété de la portée globale // qui peut être supprimée car configurable. -delete adminName; // renvoie true +delete adminName; // renvoie true // En revanche empCount n'est pas configurable // car c'est var qui a été utilisée. -delete empCount; // renvoie false +delete empCount; // renvoie false // delete peut être utilisé pour retirer des propriétés // d'objets @@ -178,14 +178,14 @@ delete Math.PI; // renvoie false // EmployeeDetails est une propriété de la portée globale // définie sans var, elle est donc configurable -delete EmployeeDetails; // renvoie true +delete EmployeeDetails; // renvoie true function f() { var z = 44; // delete n'a pas d'impact sur les noms // des variables locales - delete z; // returns false + delete z; // returns false } ``` @@ -194,7 +194,7 @@ function f() { Dans l'exemple qui suit, on supprime une propriété directement rattachée à un objet (une propriété « propre ») alors qu'une propriété du même nom existe sur la chaîne de prototypes : ```js -function Toto(){ +function Toto() { this.truc = 10; } @@ -228,17 +228,17 @@ Lorsqu'on supprime un élément d'un tableau, la longueur du tableau n'est pas m Lorsqu'on utilise `delete` pour retirer un élément du tableau, cet élément n'est plus dans le tableau. Dans l'exemple suivant, on retire `arbres[3]` grâce à `delete`. ```js -var arbres = ["cèdre","pin","chêne","érable","sapin"]; +var arbres = ["cèdre", "pin", "chêne", "érable", "sapin"]; delete arbres[3]; if (3 in arbres) { - // Le code ici ne sera pas exécuté + // Le code ici ne sera pas exécuté } ``` Si on veut conserver l'existence d'un élément du tableau avec une valeur indéfinie, on pourra affecter la valeur `undefined` à cet élément. Ainsi, contrairement à l'exemple précédent, en utilisant `undefined`, `arbres[3]` continue d'être présent : ```js -var arbres = ["cèdre","pin","chêne","érable","sapin"]; +var arbres = ["cèdre", "pin", "chêne", "érable", "sapin"]; arbres[3] = undefined; if (3 in arbres) { // Le code ici sera bien exécuté @@ -248,14 +248,14 @@ if (3 in arbres) { Si on souhaite plutôt retirer un élément du tableau en changeant le contenu du tableau, on pourra utiliser la méthode {{jsxref("Array.splice()")}}. Dans l'exemple qui suit, la valeur actuelle de `arbres[3]` est retirée du tableau grâce à `splice()` mais l'index suivant se décale et arbres\[4] devient arbres\[3] : ```js -var arbres = ["cèdre","pin","chêne","érable","sapin"]; +var arbres = ["cèdre", "pin", "chêne", "érable", "sapin"]; if (3 in arbres) { - // Le code ici sera exécuté + // Le code ici sera exécuté } arbres.splice(3, 1); console.log(arbres); // ["cèdre","pin","chêne","sapin"]; if (3 in arbres) { - // Le code ici sera également exécuté + // Le code ici sera également exécuté } ``` diff --git a/files/fr/web/javascript/reference/operators/destructuring_assignment/index.md b/files/fr/web/javascript/reference/operators/destructuring_assignment/index.md index ca88ebdd3ea4ca..7b1872b4241501 100644 --- a/files/fr/web/javascript/reference/operators/destructuring_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/destructuring_assignment/index.md @@ -23,12 +23,12 @@ console.log(a); // 10 console.log(b); // 20 console.log(rest); // [30, 40, 50] -({a, b} = {a: 10, b: 20}); +({ a, b } = { a: 10, b: 20 }); console.log(a); // 10 console.log(b); // 20 // Proposition de syntaxe (niveau 4) -({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40}); +({ a, b, ...rest } = { a: 10, b: 20, c: 30, d: 40 }); console.log(a); // 10 console.log(b); // 20 console.log(rest); // {c: 30, d: 40} @@ -61,8 +61,8 @@ Cette syntaxe est semblable aux fonctionnalités offertes par des langages tels const toto = ["un", "deux", "trois"]; // sans utiliser la décomposition -const un = toto[0]; -const deux = toto[1]; +const un = toto[0]; +const deux = toto[1]; const trois = toto[2]; // en utilisant la décomposition @@ -76,8 +76,8 @@ L'affectation par décomposition peut être effectuée sans qu'il y ait de décl ```js let a, b; [a, b] = [1, 2]; -console.log(a); // 1 -console.log(b); // 2 +console.log(a); // 1 +console.log(b); // 2 ``` ### Valeurs par défaut @@ -150,7 +150,7 @@ console.log("A vaut " + a + " B vaut " + b); Après avoir exécuté ce code, on aura a égal à 1 et b égal à 3. La valeur 2 est ignorée. On peut ignorer n'importe laquelle des valeurs (voire toutes). Par exemple : ```js -[,,] = f(); +[, ,] = f(); ``` ### Exploiter les résultats d'une expression rationnelle @@ -169,7 +169,9 @@ function parseProtocol(url) { return protocol; } -console.log(parseProtocol('https://developer.mozilla.org/en-US/Web/JavaScript')); // "https" +console.log( + parseProtocol("https://developer.mozilla.org/en-US/Web/JavaScript"), +); // "https" ``` ### Affecter le reste d'un tableau à une variable @@ -184,8 +186,8 @@ console.log(b); // [2, 3] Un exception {{jsxref("SyntaxError")}} sera levée si une virgule est laissée à la fin de l'élément du reste du tableau de gauche : -```js example-bad -const [a, ...b,] = [1, 2, 3] +```js-nolint example-bad +const [a, ...b,] = [1, 2, 3]; // SyntaxError : un élément du reste ne peut pas avoir // de virgule à la fin ``` @@ -195,14 +197,14 @@ const [a, ...b,] = [1, 2, 3] ### Exemple simple ```js -const o = {p: 42, q: true}; -const {p, q} = o; +const o = { p: 42, q: true }; +const { p, q } = o; console.log(p); // 42 console.log(q); // true // Assign new variable names -const {p: toto, q: truc} = o; +const { p: toto, q: truc } = o; console.log(toto); // 42 console.log(truc); // true @@ -214,7 +216,7 @@ Il est possible d'effectuer une affectation par décomposition même si aucune d ```js let a, b; -({a, b} = {a:1, b:2}); +({ a, b } = { a: 1, b: 2 }); ``` > **Note :** Les parenthèses `( ... )` utilisées autour de l'instruction sont nécessaires pour que la partie gauche soit bien interprétée comme un objet littéral et non comme un bloc. Il est également nécessaire d'avoir un point-virgule avant les parenthèses de l'instruction car sinon, ces parenthèses peuvent être interprétées comme un appel de fonction. @@ -224,8 +226,8 @@ let a, b; Lorsqu'on décompose un objet, on peut affecter la variable obtenue sur une variable qui possède un autre nom (que celui de la propriété) : ```js -const o = {p: 42, q: true}; -const {p: toto, q: truc} = o; +const o = { p: 42, q: true }; +const { p: toto, q: truc } = o; console.log(toto); // 42 console.log(truc); // true @@ -238,7 +240,7 @@ Ici, par exemple, `const {p: toto} = o` prend la propriété `p` de l'objet `o` Une variable peut recevoir une valeur par défaut lors de la décomposition si la propriété correspondante de l'objet vaut `undefined`. ```js -const {a = 10, b = 5} = {a: 3}; +const { a = 10, b = 5 } = { a: 3 }; console.log(a); // 3 console.log(b); // 5 @@ -249,7 +251,7 @@ console.log(b); // 5 Il est possible d'extraitre une valeur d'un objet pour lui affecter un nouveau nom et lui affecter une valeur par défaut au cas où la valeur extraite vaut `undefined`. ```js -const {a: aa = 10, b: bb = 5} = {a: 3}; +const { a: aa = 10, b: bb = 5 } = { a: 3 }; console.log(aa); // 3 console.log(bb); // 5 @@ -262,7 +264,7 @@ console.log(bb); // 5 ```js function dessinGrapheES5(options) { options = options === undefined ? {} : options; - var size = options.size === undefined ? 'big' : options.size; + var size = options.size === undefined ? "big" : options.size; var coords = options.coords === undefined ? { x: 0, y: 0 } : options.coords; var radius = options.radius === undefined ? 25 : options.radius; console.log(size, coords, radius); @@ -271,22 +273,25 @@ function dessinGrapheES5(options) { dessinGrapheES5({ coords: { x: 18, y: 30 }, - radius: 30 + radius: 30, }); ``` #### Version ES2015 ```js -function dessinGrapheES2015({size = 'big', coords = { x: 0, y: 0 }, radius = 25} = {}) -{ +function dessinGrapheES2015({ + size = "big", + coords = { x: 0, y: 0 }, + radius = 25, +} = {}) { console.log(size, coords, radius); // on dessine le graphe } dessinGrapheES2015({ coords: { x: 18, y: 30 }, - radius: 30 + radius: 30, }); ``` @@ -296,23 +301,26 @@ dessinGrapheES2015({ ```js const metadata = { - title: "Scratchpad", - translations: [ - { - locale: "de", - localization_tags: [ ], - last_edit: "2014-04-14T08:43:37", - url: "/de/docs/Tools/Scratchpad", - title: "JavaScript-Umgebung" - } - ], - url: "/fr/docs/Tools/Scratchpad" + title: "Scratchpad", + translations: [ + { + locale: "de", + localization_tags: [], + last_edit: "2014-04-14T08:43:37", + url: "/de/docs/Tools/Scratchpad", + title: "JavaScript-Umgebung", + }, + ], + url: "/fr/docs/Tools/Scratchpad", }; -let { title: englishTitle, translations: [{ title: localeTitle }] } = metadata; +let { + title: englishTitle, + translations: [{ title: localeTitle }], +} = metadata; console.log(englishTitle); // "Scratchpad" -console.log(localeTitle); // "JavaScript-Umgebung" +console.log(localeTitle); // "JavaScript-Umgebung" ``` ### Décomposition et utilisation de [for of](/fr/docs/JavaScript/Référence_JavaScript/Instructions/for...of) @@ -324,22 +332,25 @@ const personnes = [ famille: { mere: "Isabelle Dupont", pere: "Jean Dupont", - soeur: "Laure Dupont" + soeur: "Laure Dupont", }, - age: 35 + age: 35, }, { nom: "Luc Marchetoile", famille: { mere: "Patricia Marchetoile", pere: "Antonin Marchetoile", - frere: "Yann Marchetoile" + frere: "Yann Marchetoile", }, - age: 25 - } + age: 25, + }, ]; -for (const {nom: n, famille: { pere: f } } of personnes) { +for (const { + nom: n, + famille: { pere: f }, +} of personnes) { console.log("Nom : " + n + ", Père : " + f); } @@ -355,19 +366,20 @@ const user = { displayName: "jbiche", fullName: { firstName: "Jean", - lastName: "Biche" - } + lastName: "Biche", + }, }; -function userId({id}) { +function userId({ id }) { return id; } -function whois({displayName: displayName, fullName: {firstName: name}}){ +function whois({ displayName: displayName, fullName: { firstName: name } }) { console.log(displayName + " est " + name); } -console.log("userId: " + userId(user)); w// "userId: 42" +console.log("userId: " + userId(user)); +w; // "userId: 42" whois(user); // "jbiche est Jean" ``` @@ -389,7 +401,7 @@ console.log(toto); // "truc" [La proposition de décomposition des propriétés et de la syntaxe du reste dans ECMAScript](https://github.com/tc39/proposal-object-rest-spread) ajoute [la syntaxe du reste](/fr/docs/Web/JavaScript/Reference/Fonctions/paramètres_du_reste) pour la décomposition. La propriété du reste permet de collecter les propriétés énumérables restantes qui n'auraient pas été extraites par la décomposition : ```js -let {a, b, ...reste } = {a: 10, b: 20, c: 30, d: 40}; +let { a, b, ...reste } = { a: 10, b: 20, c: 30, d: 40 }; a; // 10 b; // 20 reste; // { c: 30, d: 40 } @@ -400,10 +412,10 @@ reste; // { c: 30, d: 40 } Si besoin, on peut également utiliser la décomposition pour fournir un alias à des noms de propriétés qui ne seraient pas des identifiants valides. Par exemple : ```js -const toto = {'truc-bidule': true} -const {'truc-bidule': trucBidule } = toto; +const toto = { "truc-bidule": true }; +const { "truc-bidule": trucBidule } = toto; -console.log(trucBidule); // "true" +console.log(trucBidule); // "true" ``` ### Combiner la décomposition de tableaux et d'objets @@ -412,12 +424,12 @@ Il est possible de décomposer un tableau et un objet simultanément. Dans l'exe ```js const props = [ - { id: 1, nom: "Toto"}, - { id: 2, nom: "Truc"}, - { id: 3, nom: "Bidule"} + { id: 1, nom: "Toto" }, + { id: 2, nom: "Truc" }, + { id: 3, nom: "Bidule" }, ]; -const [,, {nom}] = props; +const [, , { nom }] = props; console.log(nom); // Bidule ``` diff --git a/files/fr/web/javascript/reference/operators/division/index.md b/files/fr/web/javascript/reference/operators/division/index.md index 8790d4d7484d0b..3e465ac5877709 100644 --- a/files/fr/web/javascript/reference/operators/division/index.md +++ b/files/fr/web/javascript/reference/operators/division/index.md @@ -12,7 +12,7 @@ L'opérateur de division (`/`) fournit le quotient de l'opérande gauche (le num ## Syntaxe ```js -Opérateur : x / y +Opérateur: x / y; ``` ## Exemples @@ -20,17 +20,17 @@ Opérateur : x / y ### Divisions simples ```js -1 / 2 // 0.5 -Math.floor(3 / 2) // 1 -1.0 / 2.0 // 0.5 +1 / 2; // 0.5 +Math.floor(3 / 2); // 1 +1.0 / 2.0; // 0.5 ``` ### Division par zéro ```js -2.0 / 0 // Infinity -2.0 / 0.0 // Infinity, because 0.0 === 0 -2.0 / -0.0 // -Infinity +2.0 / 0; // Infinity +2.0 / 0.0; // Infinity, because 0.0 === 0 +2.0 / -0.0; // -Infinity ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/division_assignment/index.md b/files/fr/web/javascript/reference/operators/division_assignment/index.md index de9d7e4821e068..f093712bc3551e 100644 --- a/files/fr/web/javascript/reference/operators/division_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/division_assignment/index.md @@ -12,8 +12,8 @@ L'opérateur de division et d'affectation (`/=`) divise la variable fournie par ## Syntaxe ```js -Opérateur : x /= y -Signification: x = x / y +Opérateur: x /= y; +Signification: x = x / y; ``` ## Exemples @@ -22,10 +22,10 @@ Signification: x = x / y ```js let truc = 5; -truc /= 2; // 2.5 -truc /= 2; // 1.25 -truc /= 0; // Infinity -truc /= 'toto'; // NaN +truc /= 2; // 2.5 +truc /= 2; // 1.25 +truc /= 0; // Infinity +truc /= "toto"; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/equality/index.md b/files/fr/web/javascript/reference/operators/equality/index.md index dc8b236ee53c7f..408e34d0e17b73 100644 --- a/files/fr/web/javascript/reference/operators/equality/index.md +++ b/files/fr/web/javascript/reference/operators/equality/index.md @@ -12,7 +12,7 @@ L'opérateur d'égalité (`==`) vérifie si ses deux opérandes sont égaux et r ## Syntaxe ```js -x == y +x == y; ``` ## Description @@ -40,36 +40,36 @@ La différence fondamentale entre cet opérateur et [l'opérateur d'égalité st ### Comparaison sans conversion de types ```js -1 == 1; // true -"coucou" == "coucou"; // true +1 == 1; // true +"coucou" == "coucou"; // true ``` ### Comparaison avec conversion de types ```js -"1" == 1; // true -1 == "1"; // true -0 == false; // true -0 == null; // false -0 == undefined; // false -0 == !!null; // true, voir la documentation pour !! -0 == !!undefined; // true, voir la documentation pour !! -null == undefined; // true +"1" == 1; // true +1 == "1"; // true +0 == false; // true +0 == null; // false +0 == undefined; // false +0 == !!null; // true, voir la documentation pour !! +0 == !!undefined; // true, voir la documentation pour !! +null == undefined; // true const nombre1 = new Number(3); const nombre2 = new Number(3); -nombre1 == 3; // true -nombre1 == nombre2; // false +nombre1 == 3; // true +nombre1 == nombre2; // false ``` ### Comparaison d'objets ```js -const objet1 = {"clé": "valeur"} -const objet2 = {"clé": "valeur"}; +const objet1 = { clé: "valeur" }; +const objet2 = { clé: "valeur" }; -objet1 == objet2 // false -objet2 == objet2 // true +objet1 == objet2; // false +objet2 == objet2; // true ``` ### Comparaison entre des chaînes de caractères et des objets String @@ -92,9 +92,9 @@ console.log(string4 == string4); // true ### Comparaison entre les dates et les chaînes de caractères ```js -const d = new Date('December 17, 1995 03:24:00'); +const d = new Date("December 17, 1995 03:24:00"); const s = d.toString(); // par exemple : "Sun Dec 17 1995 03:24:00 GMT-0800 (Pacific Standard Time)" -console.log(d == s); //true +console.log(d == s); //true ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/exponentiation/index.md b/files/fr/web/javascript/reference/operators/exponentiation/index.md index 097591322eda2d..1313f3b18f5005 100644 --- a/files/fr/web/javascript/reference/operators/exponentiation/index.md +++ b/files/fr/web/javascript/reference/operators/exponentiation/index.md @@ -12,7 +12,7 @@ L'opérateur d'exponentiation (`**`) fournit le résultat obtenu lorsqu'on élè ## Syntaxe ```js -Opérateur : var1 ** var2 +Opérateur: var1 ** var2; ``` ## Description @@ -39,19 +39,19 @@ Attnetion, certains langages de programmation utilisent l'accent circonflexe `) renvoie `true` si l'opérande gauche est st ## Syntaxe ```js -x > y +x > y; ``` ## Description @@ -24,57 +24,57 @@ Les opérandes sont comparés avec l'algorithme de [comparaison abstraite relati ### Comparaison numérique ```js -console.log(5 > 3); // true -console.log(3 > 3); // false -console.log(3 > 5); // false +console.log(5 > 3); // true +console.log(3 > 3); // false +console.log(3 > 5); // false ``` ### Comparaison entre un nombre et un BigInt ```js -console.log(5n > 3); // true -console.log(3 > 5n); // false +console.log(5n > 3); // true +console.log(3 > 5n); // false ``` ### Comparaison entre chaînes de caractères ```js -console.log("a" > "b"); // false -console.log("a" > "a"); // false -console.log("a" > "3"); // true +console.log("a" > "b"); // false +console.log("a" > "a"); // false +console.log("a" > "3"); // true ``` ### Comparaison entre nombres et chaînes de caractères ```js -console.log("5" > 3); // true -console.log("3" > 3); // false -console.log("3" > 5); // false +console.log("5" > 3); // true +console.log("3" > 3); // false +console.log("3" > 5); // false -console.log("coucou" > 5); // false -console.log(5 > "coucou"); // false +console.log("coucou" > 5); // false +console.log(5 > "coucou"); // false -console.log("5" > 3n); // true -console.log("3" > 5n); // false +console.log("5" > 3n); // true +console.log("3" > 5n); // false ``` ### Comparaison avec des booléens, null, undefined, NaN ```js -console.log(true > false); // true -console.log(false > true); // false +console.log(true > false); // true +console.log(false > true); // false -console.log(true > 0); // true -console.log(true > 1); // false +console.log(true > 0); // true +console.log(true > 1); // false -console.log(null > 0); // false -console.log(1 > null); // true +console.log(null > 0); // false +console.log(1 > null); // true -console.log(undefined > 3); // false -console.log(3 > undefined); // false +console.log(undefined > 3); // false +console.log(3 > undefined); // false -console.log(3 > NaN); // false -console.log(NaN > 3); // false +console.log(3 > NaN); // false +console.log(NaN > 3); // false ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/greater_than_or_equal/index.md b/files/fr/web/javascript/reference/operators/greater_than_or_equal/index.md index 04a93eb956921e..5b3823917d61bf 100644 --- a/files/fr/web/javascript/reference/operators/greater_than_or_equal/index.md +++ b/files/fr/web/javascript/reference/operators/greater_than_or_equal/index.md @@ -12,7 +12,7 @@ L'opérateur supérieur ou égal (`>=`) renvoie `true` si l'opérande gauche est ## Syntaxe ```js -x >= y +x >= y; ``` ## Description @@ -24,56 +24,56 @@ Les opérandes sont comparés avec l'algorithme de [comparaison abstraite relati ### Comparaison numérique ```js -console.log(5 >= 3); // true -console.log(3 >= 3); // true -console.log(3 >= 5); // false +console.log(5 >= 3); // true +console.log(3 >= 3); // true +console.log(3 >= 5); // false ``` ### Comparaison entre un nombre et un BigInt ```js -console.log(5n >= 3); // true -console.log(3 >= 3n); // true -console.log(3 >= 5n); // false +console.log(5n >= 3); // true +console.log(3 >= 3n); // true +console.log(3 >= 5n); // false ``` ### Comparaison entre chaînes de caractères ```js -console.log("a" >= "b"); // false -console.log("a" >= "a"); // true -console.log("a" >= "3"); // true +console.log("a" >= "b"); // false +console.log("a" >= "a"); // true +console.log("a" >= "3"); // true ``` ### Comparaison entre nombres et chaînes de caractères ```js -console.log("5" >= 3); // true -console.log("3" >= 3); // true -console.log("3" >= 5); // false +console.log("5" >= 3); // true +console.log("3" >= 3); // true +console.log("3" >= 5); // false -console.log("coucou" >= 5); // false -console.log(5 >= "coucou"); // false +console.log("coucou" >= 5); // false +console.log(5 >= "coucou"); // false ``` ### Comparaison avec des booléens, null, undefined, NaN ```js -console.log(true >= false); // true -console.log(true >= true); // true -console.log(false >= true); // false +console.log(true >= false); // true +console.log(true >= true); // true +console.log(false >= true); // false -console.log(true >= 0); // true -console.log(true >= 1); // true +console.log(true >= 0); // true +console.log(true >= 1); // true -console.log(null >= 0); // true -console.log(1 >= null); // true +console.log(null >= 0); // true +console.log(1 >= null); // true console.log(undefined >= 3); // false console.log(3 >= undefined); // false -console.log(3 >= NaN); // false -console.log(NaN >= 3); // false +console.log(3 >= NaN); // false +console.log(NaN >= 3); // false ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/grouping/index.md b/files/fr/web/javascript/reference/operators/grouping/index.md index d04665e9fe102d..d7685fc0523658 100644 --- a/files/fr/web/javascript/reference/operators/grouping/index.md +++ b/files/fr/web/javascript/reference/operators/grouping/index.md @@ -30,16 +30,16 @@ var b = 2; var c = 3; // précédence normale -a + b * c // 7 +a + b * c; // 7 // l'évaluation est effectuée de cette façon -a + (b * c) // 7 +a + (b * c); // 7 // précédence surchargée avec le groupement // on additionne avant de multiplier -(a + b) * c // 9 +(a + b) * c; // 9 // mathématiquement, cela est équivalent à -a * c + b * c // 9 +a * c + b * c; // 9 ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/import.meta/index.md b/files/fr/web/javascript/reference/operators/import.meta/index.md index 89e3ace8d35d29..5b9675e4b707d6 100644 --- a/files/fr/web/javascript/reference/operators/import.meta/index.md +++ b/files/fr/web/javascript/reference/operators/import.meta/index.md @@ -11,7 +11,7 @@ L'objet **`import.meta`** est une méta-propriété qui expose des métadonnées ## Syntaxe ```js -import.meta +import.meta; ``` ## Description diff --git a/files/fr/web/javascript/reference/operators/import/index.md b/files/fr/web/javascript/reference/operators/import/index.md index 475d563dede19d..afc7878051fabe 100644 --- a/files/fr/web/javascript/reference/operators/import/index.md +++ b/files/fr/web/javascript/reference/operators/import/index.md @@ -14,7 +14,7 @@ L'appel `import()`, généralement appelé _import dynamique_, est une expressio ## Syntaxe ```js -import(nomModule) +import(nomModule); ``` L'appel `import()` a une syntaxe qui ressemble à celle d'un appel de fonction, mais `import` est bien un mot-clé et pas une fonction. On ne peut pas créer de synonyme comme avec `const monImport = import`, cela déclenchera une exception [`SyntaxError`](/fr/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError). @@ -118,8 +118,8 @@ Ici, on charge 10 modules, `/modules/module-0.js`, `/modules/module-1.js`, etc., ```js Promise.all( Array.from({ length: 10 }).map((_, index) => - import(`/modules/module-${index}.js`) - ) + import(`/modules/module-${index}.js`), + ), ).then((modules) => modules.forEach((module) => module.load())); ``` diff --git a/files/fr/web/javascript/reference/operators/in/index.md b/files/fr/web/javascript/reference/operators/in/index.md index d451be6b695b29..3e3dc9ab76f5ff 100644 --- a/files/fr/web/javascript/reference/operators/in/index.md +++ b/files/fr/web/javascript/reference/operators/in/index.md @@ -13,7 +13,7 @@ L'**opérateur `in`** renvoie `true` si une propriété donnée appartient à l' ## Syntaxe ```js -propriété in nomObjet +propriété in nomObjet; ``` ### Paramètres @@ -30,33 +30,33 @@ Les exemples suivants illustrent certaines utilisation de l'opérateur `in`. ```js // Tableaux var arbres = ["sapin", "hêtre", "cèdre", "chêne", "érable"]; -0 in arbres // renvoie true -3 in arbres // renvoie true -6 in arbres // renvoie false -"hêtre" in arbres // renvoie false (l'indice doit être spécifié, pas la valeur à cet indice) -"length" in arbres // renvoie true (length est une propriété des objets Array) -Symbol.iterator in arbres // renvoie true (les tableaux sont itérables, à partir d'ES6) +0 in arbres; // renvoie true +3 in arbres; // renvoie true +6 in arbres; // renvoie false +"hêtre" in arbres; // renvoie false (l'indice doit être spécifié, pas la valeur à cet indice) +"length" in arbres; // renvoie true (length est une propriété des objets Array) +Symbol.iterator in arbres; // renvoie true (les tableaux sont itérables, à partir d'ES6) // Objets prédéfinis -"PI" in Math // renvoie true +"PI" in Math; // renvoie true var ma_chaine = new String("corail"); -"length" in ma_chaine // renvoie true +"length" in ma_chaine; // renvoie true // Objets personnalisés -var voiture = {marque: "Honda", modèle: "Accord", année: 1998}; -"marque" in voiture // renvoie true -"modèle" in voiture // renvoie true -"marque" in voiture // renvoie true -"Accord" in voiture // renvoie false +var voiture = { marque: "Honda", modèle: "Accord", année: 1998 }; +"marque" in voiture; // renvoie true +"modèle" in voiture; // renvoie true +"marque" in voiture; // renvoie true +"Accord" in voiture; // renvoie false ``` L'opérande droit doit toujours être du type objet (et pas un autre type primitif). Par exemple, on peut utiliser une chaîne créée avec le constructeur `String`, mais pas une chaîne littérale. ```js var couleur1 = new String("vert"); -"length" in couleur1 // renvoie true +"length" in couleur1; // renvoie true var couleur2 = "corail"; -"length" in couleur2 // génère une erreur (couleur n'est pas un objet String) +"length" in couleur2; // génère une erreur (couleur n'est pas un objet String) ``` ### Utilisation de l'opérateur `in` avec des propriétés supprimées ou indéfinies @@ -64,25 +64,25 @@ var couleur2 = "corail"; Si une propriété est supprimée avec l'opérateur [`delete`](/fr/Référence_de_JavaScript_1.5_Core/Opérateurs/Opérateurs_spéciaux/L'opérateur_delete), l'opérateur `in` renvoie `false` pour cette propriété. ```js -var voiture = {marque: "Honda", modèle: "Accord", année: 1998}; +var voiture = { marque: "Honda", modèle: "Accord", année: 1998 }; delete voiture.marque; -"marque" in voiture // renvoie false +"marque" in voiture; // renvoie false var arbres = new Array("sapin", "hêtre", "cèdre", "chêne", "érable"); delete arbres[3]; -3 in arbres // renvoie false +3 in arbres; // renvoie false ``` Si une propriété est définie à {{jsxref("Objets_globaux/undefined", "undefined")}} mais n'est pas supprimée, l'opérateur `in` renverra `true` pour cette propriété. ```js -var voiture = {marque: "Honda", modèle: "Accord", année: 1998}; +var voiture = { marque: "Honda", modèle: "Accord", année: 1998 }; voiture.marque = undefined; -"marque" in voiture // renvoie true +"marque" in voiture; // renvoie true var arbres = new Array("sapin", "hêtre", "cèdre", "chêne", "érable"); arbres[3] = undefined; -3 in arbres // renvoie true +3 in arbres; // renvoie true ``` ### Propriétés héritées diff --git a/files/fr/web/javascript/reference/operators/inequality/index.md b/files/fr/web/javascript/reference/operators/inequality/index.md index 2396cdc42ba5d7..e5cad356d4a226 100644 --- a/files/fr/web/javascript/reference/operators/inequality/index.md +++ b/files/fr/web/javascript/reference/operators/inequality/index.md @@ -12,7 +12,7 @@ L'opérateur d'inégalité (`!=`) vérifie si ses deux opérandes ne sont pas é ## Syntaxe ```js -x != y +x != y; ``` ## Description @@ -20,8 +20,8 @@ x != y L'opérateur d'inégalité vérifie si ses deux opérandes ne sont pas égaux. Il s'agit de la négation de [l'opérateur d'égalité](/fr/docs/Web/JavaScript/Reference/Operators/Equality) et les deux lignes suivantes fourniront donc toujours le même résultat : ```js -x != y -!(x == y) +x != y; +!(x == y); ``` Pour plus de détails sur l'algorithme de comparaison utilisé, voir [la page relative à l'opérateur d'égalité](/fr/docs/Web/JavaScript/Reference/Operators/Equality). @@ -43,39 +43,39 @@ Si cette conversion implicite n'est pas souhaitable et qu'on souhaite considére ### Comparaison sans conversion de types ```js -1 != 2; // true -"hello" != "hola"; // true +1 != 2; // true +"hello" != "hola"; // true -1 != 1; // false -"hello" != "hello"; // false +1 != 1; // false +"hello" != "hello"; // false ``` ### Comparaison avec conversion de types ```js -"1" != 1; // false -1 != "1"; // false -0 != false; // false -0 != null; // true -0 != undefined; // true -0 != !!null; // false, voir la documentation pour !! -0 != !!undefined; // false, voir la documentation pour !! -null != undefined; // false +"1" != 1; // false +1 != "1"; // false +0 != false; // false +0 != null; // true +0 != undefined; // true +0 != !!null; // false, voir la documentation pour !! +0 != !!undefined; // false, voir la documentation pour !! +null != undefined; // false const number1 = new Number(3); const number2 = new Number(3); -number1 != 3; // false -number1 != number2; // true +number1 != 3; // false +number1 != number2; // true ``` ### Comparaison d'objets ```js -const objet1 = {"clé": "valeur"} -const objet2 = {"clé": "valeur"}; +const objet1 = { clé: "valeur" }; +const objet2 = { clé: "valeur" }; -objet1 != objet2 // true -objet2 != objet2 // false +objet1 != objet2; // true +objet2 != objet2; // false ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/instanceof/index.md b/files/fr/web/javascript/reference/operators/instanceof/index.md index f5cfe64f4fd9ce..07ae3bb0c1f49b 100644 --- a/files/fr/web/javascript/reference/operators/instanceof/index.md +++ b/files/fr/web/javascript/reference/operators/instanceof/index.md @@ -13,7 +13,7 @@ L'**opérateur `instanceof`** permet de tester si un objet possède, dans sa cha ## Syntaxe ```js -objet instanceof constructeur +objet instanceof constructeur; ``` ### Paramètres @@ -28,8 +28,8 @@ objet instanceof constructeur L'opérateur `instanceof` teste la présence de `constructeur.prototype` dans la chaîne de prototypes d'`objet`. ```js -function C(){} // Définition du constructeur -function D(){} // Définition d'un autre constructeur +function C() {} // Définition du constructeur +function D() {} // Définition d'un autre constructeur var o = new C(); @@ -40,7 +40,7 @@ o instanceof C; o instanceof D; o instanceof Object; // true, car: -C.prototype instanceof Object // true +C.prototype instanceof Object; // true C.prototype = {}; var o2 = new C(); @@ -110,7 +110,7 @@ function Voiture(fabricant, modele, annee) { } var mavoiture = new Voiture("Citroën", "C3", 2006); var a = mavoiture instanceof Voiture; // retourne true -var b = mavoiture instanceof Object; // retourne true +var b = mavoiture instanceof Object; // retourne true ``` ### Attention à la précédence des opérateurs diff --git a/files/fr/web/javascript/reference/operators/left_shift/index.md b/files/fr/web/javascript/reference/operators/left_shift/index.md index 7e0216f0955e79..dc7530ebee8282 100644 --- a/files/fr/web/javascript/reference/operators/left_shift/index.md +++ b/files/fr/web/javascript/reference/operators/left_shift/index.md @@ -12,7 +12,7 @@ L'opérateur de **décalage binaire à gauche (`<<`)** décale la séquence de b ## Syntaxe ```js -a << b +a << b; ``` ## Description diff --git a/files/fr/web/javascript/reference/operators/left_shift_assignment/index.md b/files/fr/web/javascript/reference/operators/left_shift_assignment/index.md index 25804b8ddf3832..9c6b461a85d9c0 100644 --- a/files/fr/web/javascript/reference/operators/left_shift_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/left_shift_assignment/index.md @@ -12,8 +12,8 @@ L'opérateur de décalage à gauche et d'affectation (`<<=`) décale la séquenc ## Syntaxe ```js -Opérateur : x <<= y -Signification : x = x << y +Opérateur: x <<= y; +Signification: x = x << y; ``` ## Exemples diff --git a/files/fr/web/javascript/reference/operators/less_than/index.md b/files/fr/web/javascript/reference/operators/less_than/index.md index 5d55544a672e95..e3f477a123298a 100644 --- a/files/fr/web/javascript/reference/operators/less_than/index.md +++ b/files/fr/web/javascript/reference/operators/less_than/index.md @@ -12,7 +12,7 @@ L'opérateur inférieur strict (`<`) renvoie `true` si son opérande gauche est ## Syntaxe ```js -x < y +x < y; ``` ## Description @@ -36,57 +36,57 @@ Les opérandes sont comparés avec l'algorithme de [comparaison abstraite relati ### Comparaison numérique ```js -console.log(5 < 3); // false -console.log(3 < 3); // false -console.log(3 < 5); // true +console.log(5 < 3); // false +console.log(3 < 3); // false +console.log(3 < 5); // true ``` ### Comparaison entre un nombre et un BigInt ```js -console.log(5n < 3); // false -console.log(3 < 5n); // true +console.log(5n < 3); // false +console.log(3 < 5n); // true ``` ### Comparaison entre chaînes de caractères ```js -console.log("a" < "b"); // true -console.log("a" < "a"); // false -console.log("a" < "3"); // false +console.log("a" < "b"); // true +console.log("a" < "a"); // false +console.log("a" < "3"); // false ``` ### Comparaison entre nombres et chaînes de caractères ```js -console.log("5" < 3); // false -console.log("3" < 3); // false -console.log("3" < 5); // true +console.log("5" < 3); // false +console.log("3" < 3); // false +console.log("3" < 5); // true -console.log("coucou" < 5); // false -console.log(5 < "coucou"); // false +console.log("coucou" < 5); // false +console.log(5 < "coucou"); // false -console.log("5" < 3n); // false -console.log("3" < 5n); // true +console.log("5" < 3n); // false +console.log("3" < 5n); // true ``` ### Comparaison avec des booléens, null, undefined, NaN ```js -console.log(true < false); // false -console.log(false < true); // true +console.log(true < false); // false +console.log(false < true); // true -console.log(0 < true); // true -console.log(true < 1); // false +console.log(0 < true); // true +console.log(true < 1); // false -console.log(null < 0); // false -console.log(null < 1); // true +console.log(null < 0); // false +console.log(null < 1); // true -console.log(undefined < 3); // false -console.log(3 < undefined); // false +console.log(undefined < 3); // false +console.log(3 < undefined); // false -console.log(3 < NaN); // false -console.log(NaN < 3); // false +console.log(3 < NaN); // false +console.log(NaN < 3); // false ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/less_than_or_equal/index.md b/files/fr/web/javascript/reference/operators/less_than_or_equal/index.md index 84be92ff157ee5..119efad75c52f2 100644 --- a/files/fr/web/javascript/reference/operators/less_than_or_equal/index.md +++ b/files/fr/web/javascript/reference/operators/less_than_or_equal/index.md @@ -12,7 +12,7 @@ L'opérateur inférieur ou égal (`<=`) renvoie `true` si l'opérande gauche est ## Syntaxe ```js -x <= y +x <= y; ``` ## Description @@ -24,56 +24,56 @@ Les opérandes sont comparés avec l'algorithme de [comparaison abstraite relati ### Comparaison numérique ```js -console.log(5 <= 3); // false -console.log(3 <= 3); // true -console.log(3 <= 5); // true +console.log(5 <= 3); // false +console.log(3 <= 3); // true +console.log(3 <= 5); // true ``` ### Comparaison entre un nombre et un BigInt ```js -console.log(5n <= 3); // false -console.log(3 <= 3n); // true -console.log(3 <= 5n); // true +console.log(5n <= 3); // false +console.log(3 <= 3n); // true +console.log(3 <= 5n); // true ``` ### Comparaison entre chaînes de caractères ```js -console.log("a" <= "b"); // true -console.log("a" <= "a"); // true -console.log("a" <= "3"); // false +console.log("a" <= "b"); // true +console.log("a" <= "a"); // true +console.log("a" <= "3"); // false ``` ### Comparaison entre nombres et chaînes de caractères ```js -console.log("5" <= 3); // false -console.log("3" <= 3); // true -console.log("3" <= 5); // true +console.log("5" <= 3); // false +console.log("3" <= 3); // true +console.log("3" <= 5); // true -console.log("coucou" <= 5); // false -console.log(5 <= "coucou"); // false +console.log("coucou" <= 5); // false +console.log(5 <= "coucou"); // false ``` ### Comparaison avec des booléens, null, undefined, NaN ```js -console.log(true <= false); // false -console.log(true <= true); // true -console.log(false <= true); // true +console.log(true <= false); // false +console.log(true <= true); // true +console.log(false <= true); // true -console.log(true <= 0); // false -console.log(true <= 1); // true +console.log(true <= 0); // false +console.log(true <= 1); // true -console.log(null <= 0); // true -console.log(1 <= null); // false +console.log(null <= 0); // true +console.log(1 <= null); // false console.log(undefined <= 3); // false console.log(3 <= undefined); // false -console.log(3 <= NaN); // false -console.log(NaN <= 3); // false +console.log(3 <= NaN); // false +console.log(NaN <= 3); // false ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/logical_and/index.md b/files/fr/web/javascript/reference/operators/logical_and/index.md index 795765efd83083..fbe29329d2d7cf 100644 --- a/files/fr/web/javascript/reference/operators/logical_and/index.md +++ b/files/fr/web/javascript/reference/operators/logical_and/index.md @@ -12,7 +12,7 @@ L'opérateur ET logique (`&&`) (conjonction logique) renvoie vrai si et uniqueme ## Syntaxe ```js -expr1 && expr2 +expr1 && expr2; ``` ## Description @@ -40,17 +40,17 @@ L'expression utilisant un ET logique est évaluée de gauche à droite. Le moteu Cette notion de court-circuit indique que la partie `expr` ci-avant **n'est pas évaluée**, tout effet de bord lié à cette évaluation n'aura pas lieu (par exemple, si `expr` est un appel de fonction, la fonction n'est pas appelée). Ce fonctionnement a lieu, car la valeur du résultat peut d'office être déterminée par l'évaluation du premier opérande. Par exemple : ```js -function A(){ - console.log('A a été appelée'); +function A() { + console.log("A a été appelée"); return false; } -function B(){ - console.log('B a été appelée'); +function B() { + console.log("B a été appelée"); return true; } -console.log( A() && B() ); +console.log(A() && B()); // affichera "A a été appelée" dans la console via l'appel de la fonction // puis affichera false (la valeur du résultat de l'expression avec l'opérateur) // on voit que la fonction B n'est pas du tout appelée @@ -61,9 +61,8 @@ console.log( A() && B() ); Les expressions suivantes peuvent sembler équivalentes mais ne le sont pas. En effet, l'opérateur `&&` est exécuté avant l'opérateur `||` (voir [l'article sur la précédence des opérateurs](/fr/docs/Web/JavaScript/Reference/Operators/Operator_Precedence)). ```js -true || false && false // renvoie true, car && est exécuté en premier -(true || false) && false // renvoie false, car la précédence par défaut ne s'applique pas - // avec les parenthèses +true || false && false; // renvoie true, car && est exécuté en premier +(true || false) && false; // renvoie false, car la précédence par défaut ne s'applique pas avec les parenthèses ``` ## Exemples @@ -73,15 +72,15 @@ true || false && false // renvoie true, car && est exécuté en premier Le code suivant illustre quelques usages de l'opérateur ET logique `&&`. ```js -a1 = true && true // t && t renvoie true -a2 = true && false // t && f renvoie false -a3 = false && true // f && t renvoie false -a4 = false && (3 == 4) // f && f renvoie false -a5 = 'Chat' && 'Chien' // t && t renvoie "Chien" -a6 = false && 'Chat' // f && t renvoie false -a7 = 'Chat' && false // t && f renvoie false -a8 = '' && false // f && f renvoie "" -a9 = false && '' // f && f renvoie false +a1 = true && true; // t && t renvoie true +a2 = true && false; // t && f renvoie false +a3 = false && true; // f && t renvoie false +a4 = false && 3 == 4; // f && f renvoie false +a5 = "Chat" && "Chien"; // t && t renvoie "Chien" +a6 = false && "Chat"; // f && t renvoie false +a7 = "Chat" && false; // t && f renvoie false +a8 = "" && false; // f && f renvoie "" +a9 = false && ""; // f && f renvoie false ``` ### Règles de conversion booléennes @@ -91,13 +90,13 @@ a9 = false && '' // f && f renvoie false L'opération suivante, utilisant des **booléens** : ```js -bCondition1 && bCondition2 +bCondition1 && bCondition2; ``` sera toujours équivalente à : ```js -!(!bCondition1 || !bCondition2) +!(!bCondition1 || !bCondition2); ``` #### Convertir OU en ET @@ -105,13 +104,13 @@ sera toujours équivalente à : L'opération suivante, utilisant des **booléens** : ```js -bCondition1 || bCondition2 +bCondition1 || bCondition2; ``` sera toujours équivalente à : ```js -!(!bCondition1 && !bCondition2) +!(!bCondition1 && !bCondition2); ``` ### Retrait des parenthèses imbriquées @@ -121,13 +120,13 @@ Les expressions logiques sont évaluées de gauche à droite, il est donc possib L'opération composite suivant, qui utilise des **booléens** : ```js -bCondition1 || (bCondition2 && bCondition3) +bCondition1 || (bCondition2 && bCondition3); ``` sera toujours égale à : ```js -bCondition1 || bCondition2 && bCondition3 +bCondition1 || (bCondition2 && bCondition3); ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/logical_and_assignment/index.md b/files/fr/web/javascript/reference/operators/logical_and_assignment/index.md index 5a596af7aeccd8..8168ba5d92e614 100644 --- a/files/fr/web/javascript/reference/operators/logical_and_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/logical_and_assignment/index.md @@ -12,7 +12,7 @@ L'opérateur d'affectation après ET logique (`x &&= y`) n'affecte la valeur de ## Syntaxe ```js -expr1 &&= expr2 +expr1 &&= expr2; ``` ## Description diff --git a/files/fr/web/javascript/reference/operators/logical_not/index.md b/files/fr/web/javascript/reference/operators/logical_not/index.md index 6ab3d8307c3f9f..3ffb3612ef8c4f 100644 --- a/files/fr/web/javascript/reference/operators/logical_not/index.md +++ b/files/fr/web/javascript/reference/operators/logical_not/index.md @@ -12,7 +12,7 @@ L'opérateur logique NON (`!`) prend l'opposé logique de la valeur fournie par ## Syntaxe ```js -!expr +!expr; ``` ## Description @@ -38,10 +38,10 @@ Bien que l'opérateur `!` puisse être utilisé avec des opérandes non booléen Le code suivant illustre l'utilisation de l'opérateur `!` pour le NON logique. ```js -let n1 = !true // !t renvoie false -let n2 = !false // !f renvoie true -let n3 = !'' // !f renvoie true -let n4 = !'Cat' // !t renvoie false +let n1 = !true; // !t renvoie false +let n2 = !false; // !f renvoie true +let n3 = !""; // !f renvoie true +let n4 = !"Cat"; // !t renvoie false ``` ### Double NON (`!!`) @@ -51,12 +51,12 @@ Il est possible d'utiliser deux opérateurs NON à la suite pour convertir n'imp Une conversion équivalente pourra être obtenue avec le constructeur [`Boolean`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Boolean). ```js -let n1 = !!true // !!truthy renvoie true -let n2 = !!{} // !!truthy renvoie true : tout objet est truthy -let n3 = !!(new Boolean(false)) // Attention, un objet Boolean est toujours truthy ! -let n4 = !!false // !!falsy renvoie false -let n5 = !!"" // !!falsy renvoie false -let n6 = !!Boolean(false) // !!falsy renvoie false +let n1 = !!true; // !!truthy renvoie true +let n2 = !!{}; // !!truthy renvoie true : tout objet est truthy +let n3 = !!new Boolean(false); // Attention, un objet Boolean est toujours truthy ! +let n4 = !!false; // !!falsy renvoie false +let n5 = !!""; // !!falsy renvoie false +let n6 = !!Boolean(false); // !!falsy renvoie false ``` ### Équivalence booléenne de la double négation @@ -64,13 +64,13 @@ let n6 = !!Boolean(false) // !!falsy renvoie false L'expression qui suit, utilisée avec des booléens : ```js -!!bCondition +!!bCondition; ``` est toujours égale à : ```js -bCondition +bCondition; ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/logical_or/index.md b/files/fr/web/javascript/reference/operators/logical_or/index.md index a75d4ef6a09467..4c49f840e6b7bf 100644 --- a/files/fr/web/javascript/reference/operators/logical_or/index.md +++ b/files/fr/web/javascript/reference/operators/logical_or/index.md @@ -12,7 +12,7 @@ L'opérateur OU logique (`||`) (disjonction logique) renvoie vrai si et seulemen ## Syntaxe ```js -expr1 || expr2 +expr1 || expr2; ``` ## Description @@ -40,17 +40,17 @@ L'expression utilisant un OU logique est évaluée de gauche à droite. Le moteu Cette notion de court-circuit indique que la partie `expr` ci-avant **n'est pas évaluée**, tout effet de bord lié à cette évaluation n'aura pas lieu (par exemple, si `expr` est un appel de fonction, la fonction n'est pas appelée). Ce fonctionnement a lieu, car la valeur du résultat peut d'office être déterminée par l'évaluation du premier opérande. Par exemple : ```js -function A(){ - console.log('A a été appelée'); +function A() { + console.log("A a été appelée"); return false; } -function B(){ - console.log('B a été appelée'); +function B() { + console.log("B a été appelée"); return true; } -console.log( B() || A() ); +console.log(B() || A()); // affichera "B a été appelée" dans la console via l'appel de la fonction // puis affichera true (la valeur du résultat de l'expression avec l'opérateur) // on voit que la fonction A n'est pas du tout appelée @@ -61,9 +61,8 @@ console.log( B() || A() ); Les expressions suivantes peuvent sembler équivalentes mais ne le sont pas. En effet, l'opérateur `&&` est exécuté avant l'opérateur `||` (voir [l'article sur la précédence des opérateurs](/fr/docs/Web/JavaScript/Reference/Operators/Operator_Precedence)). ```js -true || false && false // renvoie true, car && est exécuté en premier -(true || false) && false // renvoie false, car la précédence par défaut ne s'applique pas - // avec les parenthèses +true || false && false; // renvoie true, car && est exécuté en premier +(true || false) && false; // renvoie false, car la précédence par défaut ne s'applique pas avec les parenthèses ``` ## Exemples @@ -73,16 +72,16 @@ true || false && false // renvoie true, car && est exécuté en premier Le code suivant illustre quelques usages de l'opérateur OU logique `||`. ```js -o1 = true || true // t || t renvoie true -o2 = false || true // f || t renvoie true -o3 = true || false // t || f renvoie true -o4 = false || (3 == 4) // f || f renvoie false -o5 = 'Chat' || 'Chien' // t || t renvoie "Chat" -o6 = false || 'Chat' // f || t renvoie "Chat" -o7 = 'Chat' || false // t || f renvoie "Chat" -o8 = '' || false // f || f renvoie false -o9 = false || '' // f || f renvoie "" -o10 = false || varObject // f || object renvoie varObject +o1 = true || true; // t || t renvoie true +o2 = false || true; // f || t renvoie true +o3 = true || false; // t || f renvoie true +o4 = false || 3 == 4; // f || f renvoie false +o5 = "Chat" || "Chien"; // t || t renvoie "Chat" +o6 = false || "Chat"; // f || t renvoie "Chat" +o7 = "Chat" || false; // t || f renvoie "Chat" +o8 = "" || false; // f || f renvoie false +o9 = false || ""; // f || f renvoie "" +o10 = false || varObject; // f || object renvoie varObject ``` > **Note :** Si vous utilisez cet opérateur afin de fournir une valeur par défaut à une variable. Soyez conscient⋅e qu'une valeur équivalente à `false` ne pourra pas être utilisée ainsi. Si vous souhaitez uniquement écarter [`null`](/fr/docs/Web/JavaScript/Reference/Global_Objects/null) ou [`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined), privilégiez l'utilisation de [l'opérateur de coalescence des nuls](/fr/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator). @@ -94,13 +93,13 @@ o10 = false || varObject // f || object renvoie varObject L'opération suivante, utilisant des **booléens** : ```js -bCondition1 && bCondition2 +bCondition1 && bCondition2; ``` sera toujours équivalente à : ```js -!(!bCondition1 || !bCondition2) +!(!bCondition1 || !bCondition2); ``` #### Convertir OU en ET @@ -108,13 +107,13 @@ sera toujours équivalente à : L'opération suivante, utilisant des **booléens** : ```js -bCondition1 || bCondition2 +bCondition1 || bCondition2; ``` sera toujours équivalente à : ```js -!(!bCondition1 && !bCondition2) +!(!bCondition1 && !bCondition2); ``` ### Retrait des parenthèses imbriquées @@ -124,13 +123,13 @@ Les expressions logiques sont évaluées de gauche à droite, il est donc possib L'opération composite suivante, utilisant des **booléens** : ```js -bCondition1 && (bCondition2 || bCondition3) +bCondition1 && (bCondition2 || bCondition3); ``` sera toujours équivalente à : ```js -!(!bCondition1 || !bCondition2 && !bCondition3) +!(!bCondition1 || (!bCondition2 && !bCondition3)); ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/logical_or_assignment/index.md b/files/fr/web/javascript/reference/operators/logical_or_assignment/index.md index 4eb4eedd204630..a590b4b5e3533a 100644 --- a/files/fr/web/javascript/reference/operators/logical_or_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/logical_or_assignment/index.md @@ -12,7 +12,7 @@ L'opérateur d'affectation après OU logique (`x ||= y`) n'affecte la valeur de ## Syntaxe ```js -expr1 ||= expr2 +expr1 ||= expr2; ``` ## Description @@ -50,7 +50,7 @@ On notera que ce comportement est différent entre les opérateurs binaires et l Dans l'exemple qui suit, si `paroles` est vide, on y place une valeur par défaut : ```js -document.getElementById('paroles').textContent ||= 'Aucune parole.' +document.getElementById("paroles").textContent ||= "Aucune parole."; ``` Ici, la notion de court-circuit est utile, car l'élément ne sera pas mis à jour si ce n'est pas nécessaire. Il n'y aura pas d'effet de bord indésiré comme une autre étape de rendu ou la perte du focus, etc. diff --git a/files/fr/web/javascript/reference/operators/multiplication/index.md b/files/fr/web/javascript/reference/operators/multiplication/index.md index a0b8002ebea96b..99ea8beae383ee 100644 --- a/files/fr/web/javascript/reference/operators/multiplication/index.md +++ b/files/fr/web/javascript/reference/operators/multiplication/index.md @@ -12,7 +12,7 @@ L'opérateur de multiplication (`*`) fournit le produit de la multiplication des ## Syntaxe ```js -Opérateur : x * y +Opérateur: x * y; ``` ## Exemples @@ -20,21 +20,21 @@ Opérateur : x * y ### Avec des nombres ```js - 2 * 2 // 4 --2 * 2 // -4 +2 * 2; // 4 +-2 * 2; // -4 ``` ### Avec l'infini ```js -Infinity * 0 // NaN -Infinity * Infinity // Infinity +Infinity * 0; // NaN +Infinity * Infinity; // Infinity ``` ### Avec des valeurs non-numériques ```js -'foo' * 2 // NaN +"foo" * 2; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/multiplication_assignment/index.md b/files/fr/web/javascript/reference/operators/multiplication_assignment/index.md index 5ed8422a4ab6c5..7f168edb745f92 100644 --- a/files/fr/web/javascript/reference/operators/multiplication_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/multiplication_assignment/index.md @@ -12,8 +12,8 @@ L'opérateur de multiplication et d'affectation (`*=`) multiplie une variable fo ## Syntaxe ```js -Opérateur : x *= y -Signification : x = x * y +Opérateur: x *= y; +Signification: x = x * y; ``` ## Exemples @@ -22,8 +22,8 @@ Signification : x = x * y ```js let truc = 5; -truc *= 2; // 10 -truc *= 'toto'; // NaN +truc *= 2; // 10 +truc *= "toto"; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/new.target/index.md b/files/fr/web/javascript/reference/operators/new.target/index.md index a7279e9882b7ea..974d41f7293c44 100644 --- a/files/fr/web/javascript/reference/operators/new.target/index.md +++ b/files/fr/web/javascript/reference/operators/new.target/index.md @@ -13,7 +13,7 @@ La syntaxe **`new.target`** est disponible dans toutes les fonctions et permet e ## Syntaxe ```js -new.target +new.target; ``` ## Description @@ -29,8 +29,8 @@ La syntaxe `new.target` se compose du mot-clé `new`, suivi d'un point puis d'un Utilisé dans les appels de fonctions « classiques » (autrement dit pour les fonctions qui ne sont pas des constructeurs), `new.target` vaut {{jsxref("undefined")}}. Cela permet de détecter si une fonction a été appelée comme constructeur avec [`new`](/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_new) : ```js -function Toto(){ - if (!new.target) throw "Toto() doit être appelé avec new" +function Toto() { + if (!new.target) throw "Toto() doit être appelé avec new"; console.log("Toto instancié avec new"); } @@ -49,7 +49,11 @@ class A { } } -class B extends A { constructor() { super(); } } +class B extends A { + constructor() { + super(); + } +} var a = new A(); // affiche "A" var b = new B(); // affiche "B" diff --git a/files/fr/web/javascript/reference/operators/new/index.md b/files/fr/web/javascript/reference/operators/new/index.md index ab1c9cbe86bad1..3f6adcb519b374 100644 --- a/files/fr/web/javascript/reference/operators/new/index.md +++ b/files/fr/web/javascript/reference/operators/new/index.md @@ -19,8 +19,8 @@ Le mot-clé `new`, utilisé avec une fonction, applique les 4 étapes suivantes ## Syntaxe -```js -new constructeur[([arguments])] +```js-nolint +new constructeur[([arguments])]; ``` ### Paramètres @@ -54,18 +54,18 @@ function Voiture() {} voiture1 = new Voiture(); voiture2 = new Voiture(); -console.log(voiture1.couleur); // undefined +console.log(voiture1.couleur); // undefined Voiture.prototype.couleur = "couleur standard"; -console.log(voiture1.couleur); // couleur standard +console.log(voiture1.couleur); // couleur standard voiture1.couleur = "noir"; -console.log(voiture1.couleur); // noir +console.log(voiture1.couleur); // noir -console.log(voiture1.__proto__.couleur); // couleur standard -console.log(voiture2.__proto__.couleur); // couleur standard -console.log(voiture1.couleur); // noir -console.log(voiture2.couleur); // couleur standard +console.log(voiture1.__proto__.couleur); // couleur standard +console.log(voiture2.__proto__.couleur); // couleur standard +console.log(voiture1.couleur); // noir +console.log(voiture2.couleur); // couleur standard ``` > **Note :** Si on n'écrit pas l'appel du constructeur avec l'opérateur `new`, le constructeur est appelé comme une fonction normale et ne crée pas d'objet. Dans ce cas, la valeur de `this` sera différente. @@ -78,9 +78,9 @@ Supposons que vous vouliez créer un type d'objet pour les voitures. Vous voulez ```js function Voiture(marque, modèle, année) { - this.marque = marque; - this.modèle = modèle; - this.année = année; + this.marque = marque; + this.modèle = modèle; + this.année = année; } ``` @@ -104,9 +104,9 @@ Supposons que vous ayez défini un objet appelé `Personne` de la manière suiva ```js function Personne(nom, age, surnom) { - this.nom = nom; - this.age = age; - this.surnom = surnom; + this.nom = nom; + this.age = age; + this.surnom = surnom; } ``` @@ -121,10 +121,10 @@ Vous pouvez alors réécrire la définition de `Voiture` pour contenir une propr ```js function Voiture(marque, modèle, année, propriétaire) { - this.marque = marque; - this.modèle = modèle; - this.année = année; - this.propriétaire = propriétaire; + this.marque = marque; + this.modèle = modèle; + this.année = année; + this.propriétaire = propriétaire; } ``` @@ -138,7 +138,7 @@ voiture2 = new Voiture("Nissan", "300ZX", 1992, ken); Plutôt que de passer une chaîne littérale ou une valeur entière lors de la création des nouveaux objets, les instructions ci-dessus utilisent les objets `rand` et `ken` comme paramètres pour les propriétaires. Pour connaître le nom du propriétaire de `voiture2`, on peut alors accéder à la propriété suivante : ```js -voiture2.propriétaire.nom +voiture2.propriétaire.nom; ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/null/index.md b/files/fr/web/javascript/reference/operators/null/index.md index 97ab4fc99455b6..4c8610f1b97b36 100644 --- a/files/fr/web/javascript/reference/operators/null/index.md +++ b/files/fr/web/javascript/reference/operators/null/index.md @@ -1,5 +1,5 @@ --- -title: 'null' +title: "null" slug: Web/JavaScript/Reference/Operators/null translation_of: Web/JavaScript/Reference/Global_Objects/null --- @@ -13,7 +13,7 @@ La valeur **`null`** est un littéral JavaScript représentant la nullité au se ## Syntaxe ```js -null +null; ``` ## Description @@ -23,7 +23,7 @@ La valeur `null` est un littéral (et non pas une propriété de l'objet global ```js // toto n'existe pas, n'a pas été défini et n'a jamais été initialisé toto; -"ReferenceError: toto is not defined" +("ReferenceError: toto is not defined"); // toto existe mais n'a ni type ni valeur var toto = null; @@ -33,15 +33,15 @@ console.log(toto); // null ### Différence entre `null` et `undefined` ```js -typeof null; // "object" (pas null pour des raisons historiques) -typeof undefined; // "undefined" -null === undefined; // false -null == undefined; // true -null === null; // true -null == null; // true -!null; // true -isNaN(1 + null); // false -isNaN(1 + undefined); // true +typeof null; // "object" (pas null pour des raisons historiques) +typeof undefined; // "undefined" +null === undefined; // false +null == undefined; // true +null === null; // true +null == null; // true +!null; // true +isNaN(1 + null); // false +isNaN(1 + undefined); // true ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/nullish_coalescing/index.md b/files/fr/web/javascript/reference/operators/nullish_coalescing/index.md index 3abfc30be128f5..3b6ff64e65bf4d 100644 --- a/files/fr/web/javascript/reference/operators/nullish_coalescing/index.md +++ b/files/fr/web/javascript/reference/operators/nullish_coalescing/index.md @@ -15,7 +15,7 @@ Contrairement à [l'opérateur logique OU (`||`)](/fr/docs/Web/JavaScript/Refere ## Syntaxe ```js -leftExpr ?? rightExpr +leftExpr ?? rightExpr; ``` ## Exemples @@ -46,7 +46,7 @@ Auparavant, lorsque l'on voulait attribuer une valeur par défaut à une variabl let toto; // toto ne se voit jamais attribuer de valeur, il vaut donc undefined -let unTexteBateau = toto || 'Coucou !'; +let unTexteBateau = toto || "Coucou !"; ``` Cependant, parce que `||` est un opérateur logique booléen, l'opérande de gauche a été converti en un booléen pour l'évaluation et aucune valeur _falsy_ (`0`, `''`, `NaN`, `null`, `undefined`) n'a été renvoyée. Ce comportement peut entraîner des conséquences inattendues si on souhaite considérer `0`, `''` ou `NaN` comme des valeurs valides. @@ -57,19 +57,19 @@ let texte = ""; let qté = compteur || 42; let message = texte || "Coucou !"; -console.log(qté); // 42 et non 0 +console.log(qté); // 42 et non 0 console.log(message); // "Coucou !" et non "" ``` L'opérateur de coalescence des nuls évite ce risque en ne renvoyant le deuxième opérande que lorsque le premier vaut `null` ou `undefined` (mais pas d'autres valeurs _falsy_) : ```js -let monTexte = ''; // Un chaine vide (qui est donc une valeur falsy) +let monTexte = ""; // Un chaine vide (qui est donc une valeur falsy) -let notFalsyText = monTexte || 'Hello world'; +let notFalsyText = monTexte || "Hello world"; console.log(notFalsyText); // Hello world -let preservingFalsy = monTexte ?? 'Salut le voisin'; +let preservingFalsy = monTexte ?? "Salut le voisin"; console.log(preservingFalsy); // '' (car monTexte n'est ni null ni undefined) ``` @@ -78,15 +78,24 @@ console.log(preservingFalsy); // '' (car monTexte n'est ni null ni undefined) À l'instar des opérateurs logiques OR (`||`) et AND (`&&`), l'expression de droite n'est pas évaluée si celle de gauche ne vaut ni `null` ni `undefined`. ```js -function A() { console.log('A a été appelée'); return undefined; } -function B() { console.log('B a été appelée'); return false; } -function C() { console.log('C a été appelée'); return "toto"; } - -console.log( A() ?? C() ); +function A() { + console.log("A a été appelée"); + return undefined; +} +function B() { + console.log("B a été appelée"); + return false; +} +function C() { + console.log("C a été appelée"); + return "toto"; +} + +console.log(A() ?? C()); // Inscrit "A a été appelée" puis "C a été appelée" et enfin "toto" // puisque : A() retourne undefined, les deux expressions sont donc évaluées -console.log( B() ?? C() ); +console.log(B() ?? C()); // Inscrit "B a été appelée" puis false // puisque : B() retourne false (et non null ou undefined) et // l'opérande de droite n'est pas évaluée @@ -114,7 +123,7 @@ Tout comme l'opérateur de coalescence des nuls, l'[opérateur de chaînage opti ```js let toto = { uneProprieteToto: "coucou" }; -console.log(toto.uneProprieteToto?.toUpperCase()); // "COUCOU" +console.log(toto.uneProprieteToto?.toUpperCase()); // "COUCOU" console.log(toto.uneProprieteTiti?.toUpperCase()); // undefined ``` diff --git a/files/fr/web/javascript/reference/operators/nullish_coalescing_assignment/index.md b/files/fr/web/javascript/reference/operators/nullish_coalescing_assignment/index.md index 1343366318b57f..ed99571aae9fd4 100644 --- a/files/fr/web/javascript/reference/operators/nullish_coalescing_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/nullish_coalescing_assignment/index.md @@ -12,7 +12,7 @@ L'opérateur d'affectation après coalescence des nuls (`x ??= y`) effectue une ## Syntaxe ```js -expr1 ??= expr2 +expr1 ??= expr2; ``` ## Description diff --git a/files/fr/web/javascript/reference/operators/object_initializer/index.md b/files/fr/web/javascript/reference/operators/object_initializer/index.md index 7d2a2c296f628f..bd7919de56579b 100644 --- a/files/fr/web/javascript/reference/operators/object_initializer/index.md +++ b/files/fr/web/javascript/reference/operators/object_initializer/index.md @@ -16,13 +16,15 @@ Il est possible d'initialiser un objet en utilisant les notations [`new Object() var o = {}; var o = { a: "toto", b: 42, c: {} }; -var a = "toto", b = 42, c = {}; +var a = "toto", + b = 42, + c = {}; var o = { a: a, b: b, c: c }; var o = { property: function (paramètres) {}, get property() {}, - set property(valeur) {} + set property(valeur) {}, }; ``` @@ -32,12 +34,14 @@ ECMAScript 2015 (ES6) introduit de nouvelles notations. Pour plus d'informations ```js // Raccourcis pour les noms de propriétés (ES2015) -var a = "toto", b = 42, c = {}; +var a = "toto", + b = 42, + c = {}; var o = { a, b, c }; // Raccourcis pour les noms de méthodes(ES2015) var o = { - property(paramètres) {} + property(paramètres) {}, }; // Noms calculés pour les propriétés (ES2015) @@ -64,10 +68,10 @@ Cependant, en utilisant un littéral ou un initialisateur, on peut créer des ob ```js var object = { - toto: 'truc', + toto: "truc", âge: 42, machin: { maProp: 12 }, -} +}; ``` ### Accéder à des propriétés @@ -76,9 +80,9 @@ Après la création d'un objet, vous pourrez avoir besoin de consulter ou de mod ```js object.toto; // "truc" -object['âge']; // 42 +object["âge"]; // 42 -object.toto = 'machin'; +object.toto = "machin"; ``` ### Définir des propriétés @@ -86,29 +90,29 @@ object.toto = 'machin'; On a déjà vu comment on pouvait utiliser la syntaxe de l'initialisateur pour définir des propriétés. Il arrive souvent de vouloir utiliser des variables comme propriétés d'un objet. C'est pourquoi on peut trouver le code suivant : ```js -var a = 'toto', - b = 42, - c = {}; +var a = "toto", + b = 42, + c = {}; var o = { a: a, b: b, - c: c + c: c, }; ``` Avec ECMAScript 2015 (ES6), on peut utiliser une notation plus courte pour un résultat égal : ```js -var a = 'toto', - b = 42, - c = {}; +var a = "toto", + b = 42, + c = {}; // Raccourcis sur les noms de propriétés (ES2015) var o = { a, b, c }; // Autrement dit -console.log((o.a === { a }.a)); // true +console.log(o.a === { a }.a); // true ``` #### Les duplicatas et les noms de propriétés @@ -116,15 +120,15 @@ console.log((o.a === { a }.a)); // true Si le même nom est utilisé plusieurs fois pour différentes propriétés, ce sera la dernière propriété qui sera prise en compte : ```js -var a = {x: 1, x: 2}; +var a = { x: 1, x: 2 }; console.log(a); // { x: 2} ``` Le mode strict d'ECMAScript 5 renvoyait une exception {{jsxref("SyntaxError")}} lorsque plusieurs propriétés avaient le même nom. ECMAScript 2015 (ES6) permettant de créer des propriétés avec des noms qui sont calculés à l'exécution, cette restriction a été retirée. ```js -function vérifierSémantiqueES2015(){ - 'use strict'; +function vérifierSémantiqueES2015() { + "use strict"; try { ({ prop: 1, prop: 2 }); @@ -145,7 +149,7 @@ Une propriété d'un objet peut être une [function](/fr/docs/Web/JavaScript/Ref var o = { property: function (paramètres) {}, get property() {}, - set property(valeur) {} + set property(valeur) {}, }; ``` @@ -155,7 +159,7 @@ Avec ECMAScript 2015 (ES6), une notation raccourcie permet de ne plus utiliser l // Raccourci pour les noms de méthodes (ES2015) var o = { property(paramètres) {}, - *generator() {} + *generator() {}, }; ``` @@ -175,7 +179,7 @@ _(Il n'y a pas de function génératrice en ECMAScript5, mais l'exemple permet d ```js var o = { - generator: function* (){} + generator: function* () {}, }; ``` @@ -189,19 +193,19 @@ Avec ECMAScript 2015 (ES6), on peut utiliser un initialisateur et avoir des noms // Calcul des noms de propriétés (ES2015) var i = 0; var a = { - ['toto' + ++i]: i, - ['toto' + ++i]: i, - ['toto' + ++i]: i + ["toto" + ++i]: i, + ["toto" + ++i]: i, + ["toto" + ++i]: i, }; console.log(a.toto1); // 1 console.log(a.toto2); // 2 console.log(a.toto3); // 3 -var param = 'taille'; +var param = "taille"; var config = { [param]: 12, - ['mobile' + param.charAt(0).toUpperCase() + param.slice(1)]: 4 + ["mobile" + param.charAt(0).toUpperCase() + param.slice(1)]: 4, }; console.log(config); // { taille: 12, mobileTaille: 4 } @@ -214,8 +218,8 @@ La proposition de la décomposition des propriétés à ECMAScript (au niveau 4, Le clonage superficiel (sans rattacher le prototype) ou la fusion d'objets pourra désormais être écrite de façon plus concise qu'avec {{jsxref("Object.assign()")}}. ```js -var obj1 = { toto: 'truc', x: 42 }; -var obj2 = { toto: 'bidule', y: 13 }; +var obj1 = { toto: "truc", x: 42 }; +var obj2 = { toto: "bidule", y: 13 }; var clone = { ...obj1 }; // Object { toto: 'truc', x: 42 } @@ -238,7 +242,7 @@ var obj2 = { __proto__: null }; assert(Object.getPrototypeOf(obj2) === null); var protoObj = {}; -var obj3 = { '__proto__': protoObj }; +var obj3 = { __proto__: protoObj }; assert(Object.getPrototypeOf(obj3) === protoObj); var obj4 = { __proto__: "not an object or null" }; @@ -251,17 +255,21 @@ On ne peut modifier le prototype qu'une seule fois pour une même notation litt Les définitions de propriétés qui n'utilisent pas les deux points ne permettent pas de modifier le prototype, elles définieront une propriété de façon classique. ```js -var __proto__ = 'variable'; +var __proto__ = "variable"; var obj1 = { __proto__ }; assert(Object.getPrototypeOf(obj1) === Object.prototype); -assert(obj1.hasOwnProperty('__proto__')); -assert(obj1.__proto__ === 'variable'); +assert(obj1.hasOwnProperty("__proto__")); +assert(obj1.__proto__ === "variable"); -var obj2 = { __proto__() { return 'hello'; } }; -assert(obj2.__proto__() === 'hello'); +var obj2 = { + __proto__() { + return "hello"; + }, +}; +assert(obj2.__proto__() === "hello"); -var obj3 = { ['__prot' + 'o__']: 17 }; +var obj3 = { ["__prot" + "o__"]: 17 }; assert(obj3.__proto__ === 17); ``` diff --git a/files/fr/web/javascript/reference/operators/operator_precedence/index.md b/files/fr/web/javascript/reference/operators/operator_precedence/index.md index 50c89479395510..d104264120328b 100644 --- a/files/fr/web/javascript/reference/operators/operator_precedence/index.md +++ b/files/fr/web/javascript/reference/operators/operator_precedence/index.md @@ -31,10 +31,10 @@ avec le résultat attendu que `a` et `b` obtiennent la même valeur de 5. C'est ## Exemples ```js -3 > 2 && 2 > 1 +3 > 2 && 2 > 1; // renvoie true -3 > 2 > 1 +3 > 2 > 1; // renvoie false car 3 > 2 vaut true et que true > 1 vaut false // En ajoutant des parenthèses, on y voit plus clair (3 > 2) > 1 ``` diff --git a/files/fr/web/javascript/reference/operators/optional_chaining/index.md b/files/fr/web/javascript/reference/operators/optional_chaining/index.md index f41e3468ca44ee..073b14d51bbf5b 100644 --- a/files/fr/web/javascript/reference/operators/optional_chaining/index.md +++ b/files/fr/web/javascript/reference/operators/optional_chaining/index.md @@ -17,10 +17,10 @@ Le chainage optionnel ne peut pas être utilisé sur un objet initialement inexi ## Syntaxe ```js -obj?.prop -obj?.[expr] -arr?.[index] -func?.(args) +obj?.prop; +obj?.[expr]; +arr?.[index]; +func?.(args); ``` ## Description @@ -47,7 +47,7 @@ C'est équivalent à : ```js let temp = obj.premier; -let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.second); +let nestedProp = temp === null || temp === undefined ? undefined : temp.second; ``` ### Chaînage optionnel avec des appels de fonctions @@ -71,9 +71,9 @@ Si vous utilisez des fonctions ou des méthodes de recherche depuis un objet ave function doSomething(onContent, onError) { try { // ... faire quelque chose avec les données - } - catch (err) { - if (onError) { // vérifier que onError existe réellement + } catch (err) { + if (onError) { + // vérifier que onError existe réellement onError(err.message); } } @@ -84,9 +84,8 @@ function doSomething(onContent, onError) { // Utiliser le chaînage optionnel avec les appels de fonctions function doSomething(onContent, onError) { try { - // ... faire quelque chose avec les données - } - catch (err) { + // ... faire quelque chose avec les données + } catch (err) { onError?.(err.message); // pas d'exception si onError n'est pas défini } } @@ -97,7 +96,7 @@ function doSomething(onContent, onError) { Vous pouvez aussi utiliser l'opérateur de chaînage optionnel lorsque vous accédez aux propriétés avec une expression en utilisant [la notation avec crochets des accesseurs de propriétés](/fr/docs/Web/JavaScript/Reference/Operators/Property_Accessors#Bracket_notation) : ```js -let nestedProp = obj?.['propName']; +let nestedProp = obj?.["propName"]; ``` ### Chaînage optionnel invalide depuis le côté gauche d'une affectation @@ -121,7 +120,7 @@ Cet exemple cherche la valeur de la propriété `name` dans un objet stocké com ```js let monMap = new Map(); -monMap.set("foo", {name: "baz", desc: "inga"}); +monMap.set("foo", { name: "baz", desc: "inga" }); let nameBar = monMap.get("bar")?.name; ``` @@ -147,9 +146,9 @@ let client = { nom: "Carl", details: { age: 82, - localisation: "Paradise Falls" + localisation: "Paradise Falls", // adresse détaillée inconnue - } + }, }; let villeDuClient = client.details?.adresse?.ville; @@ -164,7 +163,7 @@ L'{{JSxRef("Opérateurs/Nullish_coalescing_operator", "Opérateur de coalescence ```js let client = { nom: "Carl", - details: { age: 82 } + details: { age: 82 }, }; const villeDuClient = client?.ville ?? "Ville Inconnue"; console.log(villeDuClient); // Ville inconnue diff --git a/files/fr/web/javascript/reference/operators/property_accessors/index.md b/files/fr/web/javascript/reference/operators/property_accessors/index.md index a9071dee8b91fd..4c3207518ff7b2 100644 --- a/files/fr/web/javascript/reference/operators/property_accessors/index.md +++ b/files/fr/web/javascript/reference/operators/property_accessors/index.md @@ -13,8 +13,8 @@ Les **accesseurs de propriété** permettent de fournir un accès aux propriét ## Syntaxe ```js -objet.propriété -objet["propriété"] +objet.propriété; +objet["propriété"]; ``` ## Description @@ -33,7 +33,7 @@ objet.propriété = définir; `propriété` doit être un identifiant JavaScript valide, c'est-à-dire une séquence de caractères alphanumériques, soulignés (« `_` ») et signes dollar (« `$` »), qui ne peut commencer par un nombre. Par exemple, `objet.$1` est valide, mais `objet.1` ne l'est pas. ```js -document.createElement('pre'); +document.createElement("pre"); ``` Ici, la méthode `createElement` est obtenue depuis l'objet `document` et est appelée. @@ -41,14 +41,13 @@ Ici, la méthode `createElement` est obtenue depuis l'objet `document` et est ap Si on utilise une méthode pour un littéral numérique et que celui-ci ne possède pas de point décimal ni d'exposant lié à la notation scientifique, il faudra laisser un ou plusieurs blancs afin que l'appel soit bien interprété comme un appel de méthode plutôt que comme un séparateur décimal : ```js -77 .toExponential(); +(77).toExponential(); // ou -77 -.toExponential(); +(77).toExponential(); // ou, mieux pour la lisibilité (77).toExponential(); // ou encore -77.0.toExponential(); +(77.0).toExponential(); // 77. correspond à 77.0 et là il n'y a aucun doute ``` @@ -64,7 +63,7 @@ objet[nom_de_propriété] = définir; #### Exemple ```js -document['createElement']('pre'); +document["createElement"]("pre"); ``` Cette ligne fait exactement la même chose que l'exemple précédent. @@ -77,7 +76,7 @@ Les noms de propriétés doivent être des chaînes de caractères ou des symbol ```js var objet = {}; -objet['1'] = 'valeur'; +objet["1"] = "valeur"; console.log(objet[1]); ``` @@ -102,7 +101,7 @@ Pour plus d'informations, consultez la page sur [l'opérateur `this` et les liai Les nouveaux venus en JavaScript font souvent l'erreur d'utiliser {{jsxref("eval", "eval()")}} alors que la notation avec crochets pourrait être utilisée. Par exemple, la syntaxe suivante est utilisée dans de nombreux scripts. ```js -x = eval('document.formulaire.' + controle + '.value'); +x = eval("document.formulaire." + controle + ".value"); ``` `eval` est lente et insécurisée et devrait être évitée dès que possible. Il est préférable d'utiliser la notation avec crochets : diff --git a/files/fr/web/javascript/reference/operators/remainder/index.md b/files/fr/web/javascript/reference/operators/remainder/index.md index 90ef274ca392f0..a7b208a7047364 100644 --- a/files/fr/web/javascript/reference/operators/remainder/index.md +++ b/files/fr/web/javascript/reference/operators/remainder/index.md @@ -14,7 +14,7 @@ Bien que dans la plupart des langages, `%` est un opérateur de reste, pour d'au ## Syntaxe ```js -Opérateur : var1 % var2 +Opérateur: var1 % var2; ``` ## Exemples @@ -22,33 +22,33 @@ Opérateur : var1 % var2 ### Reste avec numérateur positif ```js -12 % 5 // 2 - 1 % -2 // 1 - 1 % 2 // 1 - 2 % 3 // 2 -5.5 % 2 // 1.5 +12 % 5; // 2 +1 % -2; // 1 +1 % 2; // 1 +2 % 3; // 2 +5.5 % 2; // 1.5 ``` ### Reste avec numérateur négatif ```js --12 % 5 // -2 --1 % 2 // -1 --4 % 2 // -0 +-12 % 5; // -2 +-1 % 2; // -1 +-4 % 2; // -0 ``` ### Reste avec NaN ```js -NaN % 2 // NaN +NaN % 2; // NaN ``` ### Reste avec l'infini ```js -Infinity % 2 // NaN -Infinity % 0 // NaN -Infinity % Infinity // NaN +Infinity % 2; // NaN +Infinity % 0; // NaN +Infinity % Infinity; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/remainder_assignment/index.md b/files/fr/web/javascript/reference/operators/remainder_assignment/index.md index dc2331bd3b27df..add170ccf65799 100644 --- a/files/fr/web/javascript/reference/operators/remainder_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/remainder_assignment/index.md @@ -12,8 +12,8 @@ L'opérateur de reste et d'affectation (`%=`) calcule le reste de la division de ## Syntaxe ```js -Opérateur : x %= y -Signification : x = x % y +Opérateur: x %= y; +Signification: x = x % y; ``` ## Exemples @@ -22,9 +22,9 @@ Signification : x = x % y ```js let truc = 5; -truc %= 2; // 1 -truc %= 'toto'; // NaN -truc %= 0; // NaN +truc %= 2; // 1 +truc %= "toto"; // NaN +truc %= 0; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/right_shift/index.md b/files/fr/web/javascript/reference/operators/right_shift/index.md index d17d2e3570e106..3061752bc64c00 100644 --- a/files/fr/web/javascript/reference/operators/right_shift/index.md +++ b/files/fr/web/javascript/reference/operators/right_shift/index.md @@ -12,7 +12,7 @@ L'opérateur de **décalage binaire à droite (`>>`)** décale la séquence de b ## Syntaxe ```js -a >> b +a >> b; ``` ## Description @@ -40,7 +40,7 @@ De même, `-9 >> 2` donnera `-3`, car le signe est préservé : ### Utiliser le décalage à droite ```js - 9 >> 2; // 2 +9 >> 2; // 2 -9 >> 2; // -3 ``` diff --git a/files/fr/web/javascript/reference/operators/right_shift_assignment/index.md b/files/fr/web/javascript/reference/operators/right_shift_assignment/index.md index f4ad5f88d5c61e..06917a14ded419 100644 --- a/files/fr/web/javascript/reference/operators/right_shift_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/right_shift_assignment/index.md @@ -12,8 +12,8 @@ L'opérateur de décalage à droite et d'affectation (`>>=`) décale la séquenc ## Syntaxe ```js -Opérateur : x >>= y -Signification : x = x >> y +Opérateur: x >>= y; +Signification: x = x >> y; ``` ## Exemples @@ -22,10 +22,10 @@ Signification : x = x >> y ```js let a = 5; // (00000000000000000000000000000101) -a >>= 2; // 1 (00000000000000000000000000000001) +a >>= 2; // 1 (00000000000000000000000000000001) let b = -5; // (-00000000000000000000000000000101) -b >>= 2; // -2 (-00000000000000000000000000000010) +b >>= 2; // -2 (-00000000000000000000000000000010) ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/spread_syntax/index.md b/files/fr/web/javascript/reference/operators/spread_syntax/index.md index 7cc558a7640a69..ada1518cbdd3ce 100644 --- a/files/fr/web/javascript/reference/operators/spread_syntax/index.md +++ b/files/fr/web/javascript/reference/operators/spread_syntax/index.md @@ -21,7 +21,7 @@ f(...objetIterable); Pour les littéraux de tableaux : ```js -[...objetIterable, 4, 5, 6] +[...objetIterable, 4, 5, 6]; ``` Pour les littéraux objets (nouvelle fonctionnalité pour ECMAScript, actuellement en proposition de niveau 4, finalisée) : @@ -39,7 +39,7 @@ let objClone = { ...obj }; Il arrive souvent qu'on veuille utiliser {{jsxref( "Function.prototype.apply")}} avec un tableau parmi les arguments de la fonction utilisée : ```js -function f(x, y, z) { } +function f(x, y, z) {} var args = [0, 1, 2]; f.apply(null, args); ``` @@ -47,7 +47,7 @@ f.apply(null, args); avec la décomposition, on peut désormais écrire : ```js -function f(x, y, z) { } +function f(x, y, z) {} var args = [0, 1, 2]; f(...args); ``` @@ -55,7 +55,7 @@ f(...args); Tout argument passé à une fonction peut être décomposé grâce à cette syntaxe et cette syntaxe peut être utilisée pour plusieurs arguments. ```js -function f(v, w, x, y, z) { } +function f(v, w, x, y, z) {} var args = [0, 1]; f(-1, ...args, 2, ...[3]); ``` @@ -73,27 +73,26 @@ Afin d'utiliser `new` avec un tableau de paramètres, sans utiliser la décompos ```js function applyAndNew(constructor, args) { - function partial () { - return constructor.apply(this, args); - }; - if (typeof constructor.prototype === "object") { - partial.prototype = Object.create(constructor.prototype); - } - return partial; + function partial() { + return constructor.apply(this, args); + } + if (typeof constructor.prototype === "object") { + partial.prototype = Object.create(constructor.prototype); + } + return partial; } - -function monConstructeur () { - console.log("arguments.length: " + arguments.length); - console.log(arguments); - this.prop1="val1"; - this.prop2="val2"; -}; +function monConstructeur() { + console.log("arguments.length: " + arguments.length); + console.log(arguments); + this.prop1 = "val1"; + this.prop2 = "val2"; +} var mesArguments = ["bi", "bop", "bup", null]; var monConstructeurAvecArguments = applyAndNew(monConstructor, mesArguments); -console.log(new monConstructeurAvecArguments); +console.log(new monConstructeurAvecArguments()); // (log fourni par monConstructeur): arguments.length: 4 // (log fourni par monConstructeur): ["bi", "bop", "bup", null] // (log fourni par "new monConstructeurAvecArguments"): {prop1: "val1", prop2: "val2"} @@ -106,8 +105,8 @@ console.log(new monConstructeurAvecArguments); À l'heure actuelle, sans la décomposition, si on a un tableau et qu'on souhaite créer un nouveau tableau composé du premier, on ne peut pas utiliser un littéral de tableau et il faut utiliser des fonctions comme {{jsxref("Array.prototype.push", "push()")}}, {{jsxref("Array.prototype.splice", "splice()")}}, {{jsxref("Array.prototype.concat", "concat()")}}, etc. Avec la syntaxe de décomposition, cela devient plus succinct : ```js -var articulations = ['épaules', 'genoux']; -var corps = ['têtes', ...articulations, 'bras', 'pieds']; +var articulations = ["épaules", "genoux"]; +var corps = ["têtes", ...articulations, "bras", "pieds"]; // ["têtes", "épaules", "genoux", "bras", "pieds"] ``` @@ -121,7 +120,7 @@ var arr2 = [...arr]; arr2.push(4); console.log(arr2); // [1, 2, 3, 4] -console.log(arr); // [1, 2, 3] (inchangé) +console.log(arr); // [1, 2, 3] (inchangé) ``` > **Note :** Lorsqu'on utilise la décomposition pour copier un tableau, celle-ci ne s'applique qu'au premier niveau de profondeur. Par conséquent, il peut ne pas convenir pour la copie des tableaux multidimensionnels (des tableaux imbriqués dans d'autres tableaux) comme le montre l'exemple suivant (il en va de même avec {{jsxref("Object.assign()")}} et la décomposition). @@ -159,7 +158,7 @@ var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; // On ajoute tous les éléments // de arr2 au début de arr1 -Array.prototype.unshift.apply(arr1, arr2) // arr1 vaut [3, 4, 5, 0, 1, 2] +Array.prototype.unshift.apply(arr1, arr2); // arr1 vaut [3, 4, 5, 0, 1, 2] ``` Avec ES2015 et la décomposition, on peut écrire : @@ -180,8 +179,8 @@ arr1 = [...arr2, ...arr1]; Le clonage superficiel (qui ne rattache pas le prototype) ou la fusion d'objets peut donc être obtenue avec une syntaxe plus concise que celle utilisant {{jsxref("Object.assign()")}}. ```js -var profil = { prenom: 'Sarah', profilComplet: false }; -var profilMisAJour = { nom: 'Dupont', profilComplet: true }; +var profil = { prenom: "Sarah", profilComplet: false }; +var profilMisAJour = { nom: "Dupont", profilComplet: true }; var clone = { ...profil }; // Object { prenom: 'Sarah', profilComplet: false } @@ -213,13 +212,13 @@ Dans l'exemple précédent, la syntaxe de décomposition ne fonctionne pas comme Pour rappel : la syntaxe de décomposition ne s'applique qu'[aux objets itérables](/fr/docs/Web/JavaScript/Guide/iterable) : ```js -var obj = {"clé1" : "valeur1"}; +var obj = { clé1: "valeur1" }; function maFonction(x) { console.log(x); // undefined } maFonction(...obj); var args = [...obj]; -console.log(args, args.length) //[] 0 +console.log(args, args.length); //[] 0 ``` ### Utiliser la décomposition avec de nombreuses valeurs diff --git a/files/fr/web/javascript/reference/operators/strict_equality/index.md b/files/fr/web/javascript/reference/operators/strict_equality/index.md index de7437e7471ac0..62ff7554d9991a 100644 --- a/files/fr/web/javascript/reference/operators/strict_equality/index.md +++ b/files/fr/web/javascript/reference/operators/strict_equality/index.md @@ -12,7 +12,7 @@ L'opérateur d'égalité stricte (`===`) vérifie si ses deux opérandes sont é ## Syntaxe ```js -x === y +x === y; ``` ## Description @@ -36,41 +36,41 @@ La différence fondamentale avec [l'opérateur d'égalité](/fr/docs/Web/JavaScr ### Comparaison d'opérandes de même type ```js -console.log("hello" === "hello"); // true -console.log("hello" === "hola"); // false +console.log("hello" === "hello"); // true +console.log("hello" === "hola"); // false -console.log(3 === 3); // true -console.log(3 === 4); // false +console.log(3 === 3); // true +console.log(3 === 4); // false -console.log(true === true); // true -console.log(true === false); // false +console.log(true === true); // true +console.log(true === false); // false -console.log(null === null); // true +console.log(null === null); // true ``` ### Comparaison d'opérandes de types différents ```js -console.log("3" === 3); // false +console.log("3" === 3); // false -console.log(true === 1); // false +console.log(true === 1); // false -console.log(null === undefined); // false +console.log(null === undefined); // false ``` ### Comparaison d'objets ```js const objet1 = { - name: "coucou" -} + name: "coucou", +}; const objet2 = { - name: "coucou" -} + name: "coucou", +}; -console.log(objet1 === objet2); // false -console.log(objet1 === objet1); // true +console.log(objet1 === objet2); // false +console.log(objet1 === objet1); // true ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/strict_inequality/index.md b/files/fr/web/javascript/reference/operators/strict_inequality/index.md index bc959b26ad2820..fd6aee378ec4e1 100644 --- a/files/fr/web/javascript/reference/operators/strict_inequality/index.md +++ b/files/fr/web/javascript/reference/operators/strict_inequality/index.md @@ -12,7 +12,7 @@ L'opérateur d'inégalité stricte (`!==`) vérifie si ses deux opérandes ne so ## Syntaxe ```js -x !== y +x !== y; ``` ## Description @@ -20,8 +20,8 @@ x !== y L'opérateur d'inégalité stricte vérifie que ses deux opérandes ne sont pas égaux. Il s'agit de la négation de [l'opérateur d'égalité stricte](/fr/docs/Web/JavaScript/Reference/Operators/Strict_equality). Les deux expressions suivantes fourniront toujours le même résultat : ```js -x !== y -!(x === y) +x !== y; +!(x === y); ``` Pour plus de détails sur l'algorithme de comparaison utilisé, voir [la page sur l'opérateur d'égalité stricte](/fr/docs/Web/JavaScript/Reference/Operators/Strict_equality). @@ -37,41 +37,41 @@ Pour plus de détails sur l'algorithme de comparaison utilisé, voir [la page su ### Comparaison d'opérandes de même type ```js -console.log("hello" !== "hello"); // false -console.log("hello" !== "hola"); // true +console.log("hello" !== "hello"); // false +console.log("hello" !== "hola"); // true -console.log(3 !== 3); // false -console.log(3 !== 4); // true +console.log(3 !== 3); // false +console.log(3 !== 4); // true -console.log(true !== true); // false -console.log(true !== false); // true +console.log(true !== true); // false +console.log(true !== false); // true -console.log(null !== null); // false +console.log(null !== null); // false ``` ### Comparaison d'opérandes de types différents ```js -console.log("3" !== 3); // true +console.log("3" !== 3); // true -console.log(true !== 1); // true +console.log(true !== 1); // true -console.log(null !== undefined); // true +console.log(null !== undefined); // true ``` ### Comparaison d'objets ```js const objet1 = { - name: "coucou" -} + name: "coucou", +}; const objet2 = { - name: "coucou" -} + name: "coucou", +}; -console.log(objet1 !== objet2); // true -console.log(objet1 !== objet1); // false +console.log(objet1 !== objet2); // true +console.log(objet1 !== objet1); // false ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/subtraction/index.md b/files/fr/web/javascript/reference/operators/subtraction/index.md index aa1b43283a3a0b..deea0bae4b3920 100644 --- a/files/fr/web/javascript/reference/operators/subtraction/index.md +++ b/files/fr/web/javascript/reference/operators/subtraction/index.md @@ -12,7 +12,7 @@ L'opérateur de soustraction (`-`) effectue la soustraction entre les deux opér ## Syntaxe ```js -Opérateur : x - y +Opérateur: x - y; ``` ## Exemples @@ -20,14 +20,14 @@ Opérateur : x - y ### Avec des valeurs numériques ```js -5 - 3 // 2 -3 - 5 // -2 +5 - 3; // 2 +3 - 5; // -2 ``` ### Avec des valeurs non-numériques ```js -'toto' - 3 // NaN +"toto" - 3; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/subtraction_assignment/index.md b/files/fr/web/javascript/reference/operators/subtraction_assignment/index.md index cc5e13fc55a167..849ae2fa54a92f 100644 --- a/files/fr/web/javascript/reference/operators/subtraction_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/subtraction_assignment/index.md @@ -12,8 +12,8 @@ L'opérateur d'affectation après soustraction (`-=`) calcule la soustraction de ## Syntaxe ```js -Opérateur : x -= y -Signification : x = x - y +Opérateur: x -= y; +Signification: x = x - y; ``` ## Exemples @@ -22,8 +22,8 @@ Signification : x = x - y ```js let truc = 5; -truc -= 2; // 3 -truc -= 'toto'; // NaN +truc -= 2; // 3 +truc -= "toto"; // NaN ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/super/index.md b/files/fr/web/javascript/reference/operators/super/index.md index b8db27c7eeceb3..43e146917beb62 100644 --- a/files/fr/web/javascript/reference/operators/super/index.md +++ b/files/fr/web/javascript/reference/operators/super/index.md @@ -30,12 +30,12 @@ Ce fragment de code est tiré de [cet exemple](https://github.com/GoogleChrome/s ```js class Rectangle { constructor(hauteur, largeur) { - this.name = 'Rectangle'; + this.name = "Rectangle"; this.hauteur = hauteur; this.largeur = largeur; } - coucou(){ - console.log('Coucou, je suis un ' + this.name + '.'); + coucou() { + console.log("Coucou, je suis un " + this.name + "."); } get aire() { return this.hauteur * this.largeur; @@ -48,7 +48,6 @@ class Rectangle { class Carre extends Rectangle { constructor(longueur) { - // Ici, on appelle le constructeur de Rectangle // qui est l'objet « parent » de Carré super(longueur, longueur); @@ -56,7 +55,7 @@ class Carre extends Rectangle { // Pour les classes dérivées, super() doit être appelé // avant d'utiliser 'this' sinon cela entraînera une // exception ReferenceError. - this.name = 'Carré'; + this.name = "Carré"; } } ``` @@ -74,9 +73,9 @@ class Rectangle { } class Carre extends Rectangle { - constructor(){} + constructor() {} static logDescription() { - return super.logNbCotes() + ' qui sont tous égaux'; + return super.logNbCotes() + " qui sont tous égaux"; } } Carre.logDescription(); // "J'ai 4 côtés qui sont tous égaux" @@ -111,7 +110,7 @@ class X { Object.defineProperty(this, "prop", { configurable: true, writable: false, - value: 1 + value: 1, }); } } @@ -119,7 +118,7 @@ class Y extends X { constructor() { super(); } - toto(){ + toto() { super.prop = 2; // Impossible de surcharger } } @@ -136,14 +135,14 @@ console.log(y.prop); // 1 const obj1 = { methode1() { console.log("méthode 1"); - } -} + }, +}; const obj2 = { methode2() { super.methode1(); - } -} + }, +}; Object.setPrototypeOf(obj2, obj1); obj2.methode2(); // affiche "méthode 1" dans la console diff --git a/files/fr/web/javascript/reference/operators/this/index.md b/files/fr/web/javascript/reference/operators/this/index.md index efe1d8cb86da10..040b9c67ca711e 100644 --- a/files/fr/web/javascript/reference/operators/this/index.md +++ b/files/fr/web/javascript/reference/operators/this/index.md @@ -15,7 +15,7 @@ Dans la plupart des cas, la valeur de `this` sera déterminée à partir de la f ## Syntaxe ```js -this +this; ``` ### Valeur @@ -36,7 +36,7 @@ console.log(window.a); // 37 this.b = "MDN"; console.log(window.b); // "MDN" -console.log(b); // "MDN" +console.log(b); // "MDN" ``` > **Note :** Il est également possible d'accéder au contexte global avec la propriété {{jsxref("globalThis")}} quel que soit le contexte utilisé pour l'exécution. @@ -48,7 +48,7 @@ S'il est utilisé dans une fonction, la valeur de `this` dépendra de la façon ### Avec un appel simple ```js -function f1(){ +function f1() { return this; } @@ -62,7 +62,7 @@ f1() === global; // true Dans cet exemple, la valeur de `this` n'est pas définie lors de l'appel. Le code n'étant pas en mode strict, `this` doit toujours être un objet et ce sera donc l'objet global (soit {{domxref("Window", "window")}} pour un navigateur). ```js -function f2(){ +function f2() { "use strict"; // on utilise le mode strict return this; } @@ -92,19 +92,19 @@ function whatsThis(arg) { return this.a; } -whatsThis(); // 'Global' car celui-ci dans la fonction n'est pas défini, il est donc défini par défaut sur l'objet global window -whatsThis.call(obj); // "Toto" +whatsThis(); // 'Global' car celui-ci dans la fonction n'est pas défini, il est donc défini par défaut sur l'objet global window +whatsThis.call(obj); // "Toto" whatsThis.apply(obj); // "Toto" ``` Lorsque le mot-clé `this` est utilisé dans le corps d'une fonction, il est possible d'utiliser les méthodes {{jsxref("Function.prototype.call()", "call()")}} ou {{jsxref("Function.prototype.apply()", "apply()")}} pour lier `this` à un objet donné. Toutes les fonctions héritent de ces méthodes grâce à {{jsxref("Function.prototype")}}. ```js -function ajout(c, d){ +function ajout(c, d) { return this.a + this.b + c + d; } -var o = {a:1, b:3}; +var o = { a: 1, b: 3 }; // Le premier paramètre correspond à l'objet qu'on souhaite // lier à 'this', les paramètres suivants sont les arguments @@ -124,8 +124,8 @@ function truc() { console.log(Object.prototype.toString.call(this)); } -truc.call(7); // [object Number] -truc.call('foo'); // [object String] +truc.call(7); // [object Number] +truc.call("foo"); // [object String] ``` ### La méthode `bind` @@ -133,17 +133,17 @@ truc.call('foo'); // [object String] Avec ECMAScript 5, une nouvelle fonction fut introduite : {{jsxref("Function.prototype.bind()")}}. Lorsqu'on appelle `f.bind(unObjet)`, on crée une nouvelle fonction qui possède le même corps et la même portée que `f`, mais où `this` sera lié, de façon permanente, au premier argument passé à `bind`, quelle que soit la façon dont la méthode est utilisée. ```js -function f(){ +function f() { return this.a; } -var g = f.bind({a:"azerty"}); +var g = f.bind({ a: "azerty" }); console.log(g()); // azerty -var h = g.bind({a:"coucou"}); // bind ne fonctionne qu'une seule fois +var h = g.bind({ a: "coucou" }); // bind ne fonctionne qu'une seule fois console.log(h()); // azerty -var o = {a:37, f:f, g:g, h:h}; +var o = { a: 37, f: f, g: g, h: h }; console.log(o.a, o.f(), o.g(), o.h()); // 37, 37, azerty, azerty ``` @@ -153,7 +153,7 @@ En utilisant [les fonctions fléchées](/fr/docs/Web/JavaScript/Reference/Foncti ```js var objetGlobal = this; -var toto = (() => this); +var toto = () => this; console.log(toto() === objetGlobal); // true ``` @@ -161,7 +161,7 @@ Peu importe la façon dont `toto` sera appelée, `this` sera toujours l'objet gl ```js // Appelé comme la méthode d'un objet -var obj = {toto: toto}; +var obj = { toto: toto }; console.log(obj.toto() === objetGlobal); // true // Ici on utilise call @@ -181,11 +181,12 @@ Quelle que soit la méthode utilisée le `this` de `toto` sera défini avec la v // la forme d'une fonction fléchée. this est // donc fixé de façon permanente avec la valeur // de this du contexte englobant. -var obj = { truc : function() { - var x = (() => this); - return x; - } - }; +var obj = { + truc: function () { + var x = () => this; + return x; + }, +}; // On appelle truc comme une méthode d'obj, this // vaudra donc obj. On récupère la fonction // renvoyée par truc et on en stocke une référence @@ -217,9 +218,9 @@ Ainsi, dans l'exemple suivant, lorsqu'on appelle `o.f()`, le `this` contenu à l ```js var o = { prop: 37, - f: function() { + f: function () { return this.prop; - } + }, }; console.log(o.f()); // 37 @@ -228,7 +229,7 @@ console.log(o.f()); // 37 On notera que ce comportement n'est pas du tout affecté par la façon ou l'endroit de la définition de la fonction. Dans l'exemple précédent, on aurait très bien pu définir la fonction plus tard et la rattacher à une propriété de `o` plutôt que de la déclarer de cette façon. On aura le même résultat en faisant ainsi : ```js -var o = {prop: 37}; +var o = { prop: 37 }; function indépendante() { return this.prop; @@ -244,7 +245,7 @@ On voit ici que ce qui importe est la façon dont la fonction est appelée et no De la même façon, `this` n'est affecté que par la référence la plus proche. Autrement dit, dans l'exemple suivant quand on appelle la fonction `o.b.g`, on appelle la méthode `g` de l'objet `o.b`. Ainsi, au moment de l'exécution, `this` fera référence à `o.b`. Le fait que cet objet soit une propriété de `o` n'a aucun impact : seule la référence objet la plus proche compte. ```js -o.b = {g: indépendante, prop: 42}; +o.b = { g: indépendante, prop: 42 }; console.log(o.b.g()); // 42 ``` @@ -253,7 +254,11 @@ console.log(o.b.g()); // 42 Ce qui a été vu ci-avant est également applicable pour les méthodes qui sont présentes sur la chaîne de prototypes de l'objet. Si une méthode se situe sur la chaîne de prototype, `this` fera référence à l'objet appelant (de la même façon que si la méthode était une propriété directe de l'objet). ```js -var o = {f:function(){ return this.a + this.b; }}; +var o = { + f: function () { + return this.a + this.b; + }, +}; var p = Object.create(o); p.a = 1; p.b = 4; @@ -268,20 +273,23 @@ Dans cet exemple, l'objet qui est affecté à la variable `p` ne possède pas di Ici aussi, on a le même principe lorsque la fonction est appelée à partir d'un accesseur (_getter_) ou d'un mutateur (_setter_). Une fonction utilisée comme accesseur ou mutateur verra son `this` lié à l'objet à partir duquel on souhaite accéder/changer la propriété. ```js -function moduleRéel(){ +function moduleRéel() { return Math.sqrt(this.re * this.re + this.im * this.im); } var o = { re: 1, im: -1, - get phase(){ + get phase() { return Math.atan2(this.im, this.re); - } + }, }; -Object.defineProperty(o, 'moduleRéel', { - get: moduleRéel, enumerable:true, configurable:true}); +Object.defineProperty(o, "moduleRéel", { + get: moduleRéel, + enumerable: true, + configurable: true, +}); console.log(o.phase, o.moduleRéel); // logs -0.78 1.4142 ``` @@ -314,17 +322,16 @@ Lorsqu'une fonction est utilisée comme constructeur (c'est-à-dire qu'elle est * } */ -function C(){ +function C() { this.a = 37; } var o = new C(); console.log(o.a); // 37 - -function C2(){ +function C2() { this.a = 37; - return {a:38}; + return { a: 38 }; } o = new C2(); @@ -341,7 +348,7 @@ Lorsqu'une fonction est utilisée comme gestionnaire d'événement (_event handl // Lorsque cette fonction est appelée // comme listener, l'élément associé // sera coloré en bleu -function bluify(e){ +function bluify(e) { // Cette proposition est toujours vraie console.log(this === e.currentTarget); @@ -349,17 +356,17 @@ function bluify(e){ // au même objet console.log(this === e.target); - this.style.backgroundColor = '#A5D9F3'; + this.style.backgroundColor = "#A5D9F3"; } // On obtient une liste de tous les éléments // contenus dans le document -var elements = document.getElementsByTagName('*'); +var elements = document.getElementsByTagName("*"); // On ajout le listener bluify pour réagier au clic // Quand on clique sur un élément, il deviendra bleu -for(var i=0 ; i>>`)** décale la s ## Syntaxe ```js -a >>> b +a >>> b; ``` ## Description @@ -40,7 +40,7 @@ Toutefois, ce n'est pas le cas pour les nombres négatifs : `-9 >>> 2` renverra ### Utiliser le décalage à droite non-signé ```js - 9 >>> 2; // 2 +9 >>> 2; // 2 -9 >>> 2; // 1073741821 ``` diff --git a/files/fr/web/javascript/reference/operators/unsigned_right_shift_assignment/index.md b/files/fr/web/javascript/reference/operators/unsigned_right_shift_assignment/index.md index b1b76072d301ca..9b8a04ad14e3f7 100644 --- a/files/fr/web/javascript/reference/operators/unsigned_right_shift_assignment/index.md +++ b/files/fr/web/javascript/reference/operators/unsigned_right_shift_assignment/index.md @@ -12,8 +12,8 @@ L'**opérateur de décalage à droite non signé et d'affectation** (`>>>=`) dé ## Syntaxe ```js -Opérateur : x >>>= y -Signification : x = x >>> y +Opérateur: x >>>= y; +Signification: x = x >>> y; ``` ## Exemples @@ -22,10 +22,10 @@ Signification : x = x >>> y ```js let a = 5; // (00000000000000000000000000000101) -a >>>= 2; // 1 (00000000000000000000000000000001) +a >>>= 2; // 1 (00000000000000000000000000000001) let b = -5; // (-00000000000000000000000000000101) -b >>>= 2; // 1073741822 (00111111111111111111111111111110) +b >>>= 2; // 1073741822 (00111111111111111111111111111110) ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/operators/void/index.md b/files/fr/web/javascript/reference/operators/void/index.md index 31a450a6ed45ca..b77c9d74e49513 100644 --- a/files/fr/web/javascript/reference/operators/void/index.md +++ b/files/fr/web/javascript/reference/operators/void/index.md @@ -13,7 +13,7 @@ L'**opérateur `void`** permet d'évaluer une _expression_ donnée et de renvoye ## Syntaxe ```js -void expression +void expression; ``` ## Description @@ -25,8 +25,8 @@ L'opérateur `void` est souvent utilisé pour obtenir la valeur `undefined`, gé Attention à [la précédence des opérateurs](/fr/docs/Web/JavaScript/Reference/Opérateurs/Précédence_des_opérateurs) et notamment de celle de `void`, si besoin, on pourra utiliser des parenthèses pour clarifier la résolution de l'expression : ```js -void 2 == '2'; // renvoie false -void (2 === '2'); // renvoie undefined +void 2 == "2"; // renvoie false +void (2 === "2"); // renvoie undefined ``` ## Expressions de fonction appelées immédiatement @@ -34,18 +34,18 @@ void (2 === '2'); // renvoie undefined Lorsqu'on utilise tout un script dans une fonction qu'on évalue immédiatement, `void` peut être utilisé pour que le mot-clé `function` soit traité comme une expression plutôt que comme une déclaration. ```js -void function iife() { - var toto = function () {}; - var machin = function () {}; - var truc = function () { - toto(); - machin(); - }; - var bidule = function () {}; - - truc(); - bidule(); -}(); +void (function iife() { + var toto = function () {}; + var machin = function () {}; + var truc = function () { + toto(); + machin(); + }; + var bidule = function () {}; + + truc(); + bidule(); +})(); ``` ## Les URI JavaScript @@ -53,9 +53,7 @@ void function iife() { Lorsqu'un navigateur utilise une URI avec `javascript:`, le code de l'URI est évalué et le résultat remplace le contenu de la page, sauf si la valeur renvoyée vaut {{jsxref("Objets_globaux/undefined","undefined")}}. L'utilisateur `void` peut alors être utilisé pour renvoyer cette valeur. Par exemple : ```html - - Cliquer ici (sans effet) - + Cliquer ici (sans effet) Cliquer ici pour rendre le fond vert diff --git a/files/fr/web/javascript/reference/operators/yield/index.md b/files/fr/web/javascript/reference/operators/yield/index.md index d598aa792bce82..d948e7b2e90b91 100644 --- a/files/fr/web/javascript/reference/operators/yield/index.md +++ b/files/fr/web/javascript/reference/operators/yield/index.md @@ -13,7 +13,7 @@ Le mot-clé `yield` est utilisé pour suspendre et reprendre une fonction géné ## Syntaxe ```js -[rv] = yield [expression] +[rv] = yield[expression]; ``` - `expression` @@ -45,7 +45,7 @@ Entre le chemin de code du générateur, ses opérateurs `yield`, et la possibil Le code suivant est la déclaration d'un exemple de fonction génératrice : ```js -function* compteVentesPommes () { +function* compteVentesPommes() { var listeVentes = [3, 7, 5]; for (var i = 0; i < listeVentes.length; i++) { yield listeVentes[i]; diff --git a/files/fr/web/javascript/reference/operators/yield_star_/index.md b/files/fr/web/javascript/reference/operators/yield_star_/index.md index ad0bcce49f57b8..53f3e3790e0162 100644 --- a/files/fr/web/javascript/reference/operators/yield_star_/index.md +++ b/files/fr/web/javascript/reference/operators/yield_star_/index.md @@ -13,7 +13,7 @@ Une **expression `yield*`** est utilisée afin de déléguer le mécanisme d'it ## Syntaxe ```js -yield* expression +yield * expression; ``` - `expression` @@ -96,10 +96,9 @@ var iterator = g5(); console.log(iterator.next()); // { value: 1, done: false } console.log(iterator.next()); // { value: 2, done: false } console.log(iterator.next()); // { value: 3, done: false } -console.log(iterator.next()); // { value: undefined, done: true }, - // g4() renvoie{ value: "toto", done: true } at this point +console.log(iterator.next()); // { value: undefined, done: true }, g4() renvoie{ value: "toto", done: true } at this point -console.log(résultat); // "toto" +console.log(résultat); // "toto" ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/regular_expressions/unicode_character_class_escape/index.md b/files/fr/web/javascript/reference/regular_expressions/unicode_character_class_escape/index.md index 72537455154e7c..e06eb93c648de9 100644 --- a/files/fr/web/javascript/reference/regular_expressions/unicode_character_class_escape/index.md +++ b/files/fr/web/javascript/reference/regular_expressions/unicode_character_class_escape/index.md @@ -26,44 +26,44 @@ Les séquences d'échappement pour les propriétés Unicode permettent de distin ### Non-binaires -| Échappements | Signification | -| ---------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | -| `\p{LC} \p{Cased_Letter} \p{UnicodePropertyName=Cased_Letter}` | N'importe quelle lettre avec la version minuscule et la version majuscule. Équivalent à `\p{Lu}\|\p{Ll}\|p{Lt}`. | -| `\p{Close_Punctuation} \p{UnicodePropertyName=Close_Punctuation}` | | -| `\p{Connector_Punctuation} \p{UnicodePropertyName=Connector_Punctuation}` | | -| `\p{Control} \p{UnicodePropertyName=Control}` | | -| `\p{Currency_Symbol} \p{UnicodePropertyName=Currency_Symbol}` | | -| `\p{Dash_Punctuation} \p{UnicodePropertyName=Dash_Punctuation}` | | -| `\p{Decimal_Number} \p{UnicodePropertyName=Decimal_Number}` | | -| `\p{Enclosing_Mark} \p{UnicodePropertyName=Enclosing_Mark}` | | -| `\p{Final_Punctuation} \p{UnicodePropertyName=Final_Punctuation}` | | -| `\p{Format} \p{UnicodePropertyName=Format}` | | -| `\p{Initial_Punctuation} \p{UnicodePropertyName=Initial_Punctuation}` | | -| `\p{Letter} \p{UnicodePropertyName=Letter}` | | -| `\p{Letter_Number} \p{UnicodePropertyName=Line_Separator}` | | -| `\p{Lowercase_Letter} \p{UnicodePropertyName=Lowercase_Letter}` | | -| `\p{Mark} \p{UnicodePropertyName=Mark}` | | -| `\p{Math_Symbol;} \p{UnicodePropertyName=Math_Symbol}` | | -| `\p{Modifier_Letter} \p{UnicodePropertyName=Modifier_Letter}` | | -| `\p{Modifier_Symbol} \p{UnicodePropertyName=Modifier_Symbol}` | | -| `\p{Nonspacing_Mark} \p{UnicodePropertyName=Nonspacing_Mark}` | | -| `\p{Number} \p{UnicodePropertyName=Number}` | | -| `\p{Open_Punctuation} \p{UnicodePropertyName=Open_Punctuation}` | | -| `\p{Other} \p{UnicodePropertyName=Other_Letter}` | | -| `\p{Other_Letter} \p{UnicodePropertyName=Other_Letter}` | | -| `\p{Other_Number} \p{UnicodePropertyName=Other_Number}` | | -| `\p{Other_Punctuation} \p{UnicodePropertyName=Other_Punctuation}` | | -| `\p{Paragraph_Separator} \p{UnicodePropertyName=Paragraph_Separator}` | | -| `\p{Private_Use} \p{UnicodePropertyName=Private_Use}` | | -| `\p{Punctuation} \p{UnicodePropertyName=Punctuation}` | | -| `\p{Separator} \p{UnicodePropertyName=Separator}` | | -| `\p{Space_Separator} \p{UnicodePropertyName=Space_Separator}` | | -| `\p{Spaceing_Mark} \p{UnicodePropertyName=Spacing_Mark}` | | -| `\p{Surrogate} \p{UnicodePropertyName=Surrogate}` | | -| `\p{Symbol} \p{UnicodePropertyName=Symbol}` | | -| `\p{Titlecase_Letter} \p{UnicodePropertyName=Titlecase_Letter}` | | -| `\p{Unassigned} \p{UnicodePropertyName=Unassigned}` | | -| `\p{Uppercase_Letter} \p{UnicodePropertyName=UppercaseLetter}` | | +| Échappements | Signification | +| ------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | +| `\p{LC} \p{Cased_Letter} \p{UnicodePropertyName=Cased_Letter}` | N'importe quelle lettre avec la version minuscule et la version majuscule. Équivalent à `\p{Lu}\|\p{Ll}\|p{Lt}`. | +| `\p{Close_Punctuation} \p{UnicodePropertyName=Close_Punctuation}` | | +| `\p{Connector_Punctuation} \p{UnicodePropertyName=Connector_Punctuation}` | | +| `\p{Control} \p{UnicodePropertyName=Control}` | | +| `\p{Currency_Symbol} \p{UnicodePropertyName=Currency_Symbol}` | | +| `\p{Dash_Punctuation} \p{UnicodePropertyName=Dash_Punctuation}` | | +| `\p{Decimal_Number} \p{UnicodePropertyName=Decimal_Number}` | | +| `\p{Enclosing_Mark} \p{UnicodePropertyName=Enclosing_Mark}` | | +| `\p{Final_Punctuation} \p{UnicodePropertyName=Final_Punctuation}` | | +| `\p{Format} \p{UnicodePropertyName=Format}` | | +| `\p{Initial_Punctuation} \p{UnicodePropertyName=Initial_Punctuation}` | | +| `\p{Letter} \p{UnicodePropertyName=Letter}` | | +| `\p{Letter_Number} \p{UnicodePropertyName=Line_Separator}` | | +| `\p{Lowercase_Letter} \p{UnicodePropertyName=Lowercase_Letter}` | | +| `\p{Mark} \p{UnicodePropertyName=Mark}` | | +| `\p{Math_Symbol;} \p{UnicodePropertyName=Math_Symbol}` | | +| `\p{Modifier_Letter} \p{UnicodePropertyName=Modifier_Letter}` | | +| `\p{Modifier_Symbol} \p{UnicodePropertyName=Modifier_Symbol}` | | +| `\p{Nonspacing_Mark} \p{UnicodePropertyName=Nonspacing_Mark}` | | +| `\p{Number} \p{UnicodePropertyName=Number}` | | +| `\p{Open_Punctuation} \p{UnicodePropertyName=Open_Punctuation}` | | +| `\p{Other} \p{UnicodePropertyName=Other_Letter}` | | +| `\p{Other_Letter} \p{UnicodePropertyName=Other_Letter}` | | +| `\p{Other_Number} \p{UnicodePropertyName=Other_Number}` | | +| `\p{Other_Punctuation} \p{UnicodePropertyName=Other_Punctuation}` | | +| `\p{Paragraph_Separator} \p{UnicodePropertyName=Paragraph_Separator}` | | +| `\p{Private_Use} \p{UnicodePropertyName=Private_Use}` | | +| `\p{Punctuation} \p{UnicodePropertyName=Punctuation}` | | +| `\p{Separator} \p{UnicodePropertyName=Separator}` | | +| `\p{Space_Separator} \p{UnicodePropertyName=Space_Separator}` | | +| `\p{Spaceing_Mark} \p{UnicodePropertyName=Spacing_Mark}` | | +| `\p{Surrogate} \p{UnicodePropertyName=Surrogate}` | | +| `\p{Symbol} \p{UnicodePropertyName=Symbol}` | | +| `\p{Titlecase_Letter} \p{UnicodePropertyName=Titlecase_Letter}` | | +| `\p{Unassigned} \p{UnicodePropertyName=Unassigned}` | | +| `\p{Uppercase_Letter} \p{UnicodePropertyName=UppercaseLetter}` | | ### Binaires diff --git a/files/fr/web/javascript/reference/statements/async_function/index.md b/files/fr/web/javascript/reference/statements/async_function/index.md index 12e3678d4ae333..65512c0627430c 100644 --- a/files/fr/web/javascript/reference/statements/async_function/index.md +++ b/files/fr/web/javascript/reference/statements/async_function/index.md @@ -48,28 +48,28 @@ Le mot-clé `await` est uniquement valide au sein des fonctions asynchrones. Si ### Exemple simple ```js -var resolveAfter2Seconds = function() { +var resolveAfter2Seconds = function () { console.log("Initialisation de la promesse lente"); - return new Promise(resolve => { - setTimeout(function() { + return new Promise((resolve) => { + setTimeout(function () { resolve("lente"); console.log("La promesse lente est terminée"); }, 2000); }); }; -var resolveAfter1Second = function() { +var resolveAfter1Second = function () { console.log("Initialisation de la promesse rapide"); - return new Promise(resolve => { - setTimeout(function() { + return new Promise((resolve) => { + setTimeout(function () { resolve("rapide"); console.log("La promesse rapide est terminée"); }, 1000); }); }; -var sequentialStart = async function() { - console.log('==Début séquentiel=='); +var sequentialStart = async function () { + console.log("==Début séquentiel=="); // 1. L'exécution atteint ce point quasi-instantanément const lente = await resolveAfter2Seconds(); @@ -77,47 +77,49 @@ var sequentialStart = async function() { const rapide = await resolveAfter1Second(); console.log(rapide); // 3. cela s'exécute 3s après 1. -} +}; -var concurrentStart = async function() { - console.log('==Début concurrentiel avec await=='); +var concurrentStart = async function () { + console.log("==Début concurrentiel avec await=="); const lente = resolveAfter2Seconds(); // le minuteur démarre immédiatement - const rapide = resolveAfter1Second(); // le minuteur démarre immédiatement + const rapide = resolveAfter1Second(); // le minuteur démarre immédiatement // 1. L'exécution atteint ce point quasi-instantanément console.log(await lente); // 2. s'exécute 2s après 1. console.log(await rapide); // 3. s'exécute 2s après 1., immédiatement après 2., - // car "rapide" est déjà résolue -} + // car "rapide" est déjà résolue +}; -var concurrentPromise = function() { - console.log('==Début concurrentiel avec Promise.all=='); - return Promise.all([resolveAfter2Seconds(), resolveAfter1Second()]).then((messages) => { - console.log(messages[0]); // lente - console.log(messages[1]); // rapide - }); -} +var concurrentPromise = function () { + console.log("==Début concurrentiel avec Promise.all=="); + return Promise.all([resolveAfter2Seconds(), resolveAfter1Second()]).then( + (messages) => { + console.log(messages[0]); // lente + console.log(messages[1]); // rapide + }, + ); +}; -var parallel = async function() { - console.log('==Exécution parallèle avec await Promise.all=='); +var parallel = async function () { + console.log("==Exécution parallèle avec await Promise.all=="); // Démarre 2 tâches en parallèle et on attend que les deux soient finies await Promise.all([ - (async()=>console.log(await resolveAfter2Seconds()))(), - (async()=>console.log(await resolveAfter1Second()))() + (async () => console.log(await resolveAfter2Seconds()))(), + (async () => console.log(await resolveAfter1Second()))(), ]); -} +}; // Cette fonction ne gère pas les erreurs // voir les avertissement ci-après ! -var parallelPromise = function() { - console.log('==Exécution parallèle avec Promise.then=='); - resolveAfter2Seconds().then((message)=>console.log(message)); - resolveAfter1Second().then((message)=>console.log(message)); -} +var parallelPromise = function () { + console.log("==Exécution parallèle avec Promise.then=="); + resolveAfter2Seconds().then((message) => console.log(message)); + resolveAfter1Second().then((message) => console.log(message)); +}; sequentialStart(); // après 2 secondes, "lente" est affichée, après une - // autre seconde, c'est "rapide" qui est affichée +// autre seconde, c'est "rapide" qui est affichée // on attend que l'étape précédente soit terminée setTimeout(concurrentStart, 4000); // 2s avant d'afficher "lente" puis "rapide" @@ -127,8 +129,8 @@ setTimeout(concurrentPromise, 7000); // identique à concurrentStart // on attend à nouveau setTimeout(parallel, 10000); // réellement parallele : après 1 seconde, - // affiche "rapide" et après une autre seconde - // affiche "lente" +// affiche "rapide" et après une autre seconde +// affiche "lente" // on attend à nouveau setTimeout(parallelPromise, 13000); // identique à parallel @@ -161,10 +163,10 @@ Lorsqu'on utilise une API qui renvoie des promesses ({{jsxref("Promise")}}), on ```js function getProcessedData(url) { return downloadData(url) // renvoie une promesse - .catch(e => { - return downloadFallbackData(url); // renvoie une promesse + .catch((e) => { + return downloadFallbackData(url); // renvoie une promesse }) - .then(v => { + .then((v) => { return processDataInWorker(v); // renvoie une promesse }); } @@ -177,7 +179,7 @@ async function getProcessedData(url) { let v; try { v = await downloadData(url); - } catch(e) { + } catch (e) { v = await downloadFallbackData(url); } return processDataInWorker(v); @@ -196,13 +198,13 @@ Si on reprend l'exemple précédent et qu'on le réécrit avec `return await` et async function getProcessedData(url) { let v; try { - v = await downloadData(url); - } catch(e) { + v = await downloadData(url); + } catch (e) { v = await downloadFallbackData(url); } try { return await processDataInWorker(v); // et non plus simplement return - } catch(e) { + } catch (e) { return null; } } diff --git a/files/fr/web/javascript/reference/statements/async_function_star_/index.md b/files/fr/web/javascript/reference/statements/async_function_star_/index.md index de9411cff24e66..4292e8a1a8b6fc 100644 --- a/files/fr/web/javascript/reference/statements/async_function_star_/index.md +++ b/files/fr/web/javascript/reference/statements/async_function_star_/index.md @@ -17,13 +17,13 @@ Il est aussi possible de définir des fonctions génératrices asynchrones à l' ```js async function* nom(param0) { - instructions + instructions; } async function* nom(param0, param1) { - instructions + instructions; } async function* nom(param0, param1, /* … ,*/ paramN) { - instructions + instructions; } ``` @@ -51,7 +51,9 @@ async function* toto() { yield Promise.reject(1); } -toto().next().catch((e) => console.error(e)); +toto() + .next() + .catch((e) => console.error(e)); ``` Qui affichera `1` dans la console, car la promesse ainsi générée déclenche une erreur et le résultat dans l'itérateur déclenche une erreur également. La propriété `value` du résultat d'un générateur asynchrone résolu ne sera pas une autre promesse. @@ -71,7 +73,8 @@ async function* monGenerateur(etape) { } const gen = monGenerateur(2); -gen.next() +gen + .next() .then((res) => { console.log(res); // { value: 0, done: false } return gen.next(); @@ -102,13 +105,13 @@ async function* readFiles(directory) { if (stats.isFile()) { yield { name: file, - content: await fs.readFile(file, 'utf8'), + content: await fs.readFile(file, "utf8"), }; } } } -const files = readFiles('.'); +const files = readFiles("."); console.log((await files.next()).value); // Exemple de sortie : { name: 'fichier1.txt', content: '...' } console.log((await files.next()).value); diff --git a/files/fr/web/javascript/reference/statements/break/index.md b/files/fr/web/javascript/reference/statements/break/index.md index cb606a3e593af3..7633fabcb380f6 100644 --- a/files/fr/web/javascript/reference/statements/break/index.md +++ b/files/fr/web/javascript/reference/statements/break/index.md @@ -33,15 +33,15 @@ La fonction qui suit utilise une instruction `break` qui interrompt la boucle {{ ```js function testBreak(x) { - var i = 0; - - while (i < 6) { - if (i == 3) { - break; - } - i += 1; - } - return i * x; + var i = 0; + + while (i < 6) { + if (i == 3) { + break; + } + i += 1; + } + return i * x; } ``` @@ -51,14 +51,13 @@ Dans le code suivant, on utilise les instructions `break` avec des blocs étique ```js bloc_externe: { - bloc_interne: { - console.log ('1'); - break bloc_externe; // interrompt bloc_externe ET bloc_interne - console.log (':-('); // ignoré + console.log("1"); + break bloc_externe; // interrompt bloc_externe ET bloc_interne + console.log(":-("); // ignoré } - console.log ('2'); // ignoré + console.log("2"); // ignoré } ``` diff --git a/files/fr/web/javascript/reference/statements/class/index.md b/files/fr/web/javascript/reference/statements/class/index.md index 8776765fc793c4..ee6184a75b5fa6 100644 --- a/files/fr/web/javascript/reference/statements/class/index.md +++ b/files/fr/web/javascript/reference/statements/class/index.md @@ -35,7 +35,7 @@ Dans l'exemple qui suit, on définit une classe `Polygone` pour laquelle on cré ```js class Polygone { constructor(hauteur, largeur) { - this.nom = 'Polygone'; + this.nom = "Polygone"; this.hauteur = hauteur; this.largeur = largeur; } @@ -43,8 +43,8 @@ class Polygone { class Carré extends Polygone { constructor(longueur) { - super(longueur,longueur); - this.nom = 'Carré'; + super(longueur, longueur); + this.nom = "Carré"; } } ``` @@ -53,12 +53,12 @@ class Carré extends Polygone { > > ```js > // Deux déclarations avec le même nom -> class Toto {}; -> class Toto {}; // Uncaught SyntaxError: Identifier 'Toto' has already been declared +> class Toto {} +> class Toto {} // Uncaught SyntaxError: Identifier 'Toto' has already been declared > > // Expression puis déclaration > var Truc = class {}; -> class Truc {}; // Uncaught TypeError: Identifier 'Truc' has already been declared +> class Truc {} // Uncaught TypeError: Identifier 'Truc' has already been declared > ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/statements/continue/index.md b/files/fr/web/javascript/reference/statements/continue/index.md index 7804d129526006..fbc2f79649a5f7 100644 --- a/files/fr/web/javascript/reference/statements/continue/index.md +++ b/files/fr/web/javascript/reference/statements/continue/index.md @@ -66,46 +66,46 @@ vérifIetJ: while (i < 4) { i += 1; vérifJ: while (j > 4) { - console.log("j : "+ j); + console.log("j : " + j); j -= 1; - if ((j % 2) == 0){ + if (j % 2 == 0) { continue vérifJ; } console.log(j + " est impaire."); - } - console.log("i = " + i); - console.log("j = " + j); + } + console.log("i = " + i); + console.log("j = " + j); } ``` En utilisant le fragment ci-avant, on aura le résultat suivant : ```js -"i : 0" +"i : 0"; // début de vérifJ -"j : 8" -"7 est impair" -"j : 7" -"j : 6" -"5 est impair." -"j : 5" +"j : 8"; +"7 est impair"; +"j : 7"; +"j : 6"; +"5 est impair."; +"j : 5"; // fin de vérifJ -"i = 1" -"j = 4" +"i = 1"; +"j = 4"; -"i : 1" -"i = 2" -"j = 4" +"i : 1"; +"i = 2"; +"j = 4"; -"i : 2" -"i = 3" -"j = 4" +"i : 2"; +"i = 3"; +"j = 4"; -"i : 3" -"i = 4" -"j = 4" +"i : 3"; +"i = 4"; +"j = 4"; ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/statements/debugger/index.md b/files/fr/web/javascript/reference/statements/debugger/index.md index 8d00e6bab003ce..43c3f5f239e102 100644 --- a/files/fr/web/javascript/reference/statements/debugger/index.md +++ b/files/fr/web/javascript/reference/statements/debugger/index.md @@ -20,9 +20,9 @@ Dans l'exemple qui suit, on utilise un code avec l'instruction `debugger` qui pe ```js function codeProbablementBogue() { - debugger; - // exécuter des instructions qu'on veut - // examiner, exécuter pas à pas etc. + debugger; + // exécuter des instructions qu'on veut + // examiner, exécuter pas à pas etc. } ``` diff --git a/files/fr/web/javascript/reference/statements/do...while/index.md b/files/fr/web/javascript/reference/statements/do...while/index.md index 08a5f9db76f5f4..a16eafc1f75b50 100644 --- a/files/fr/web/javascript/reference/statements/do...while/index.md +++ b/files/fr/web/javascript/reference/statements/do...while/index.md @@ -13,8 +13,7 @@ L'instruction **`do...while`** crée une boucle qui exécute une instruction jus ## Syntaxe ```js -do - instruction +do instruction; while (condition); ``` @@ -32,8 +31,8 @@ Dans l'exemple suivant, la boucle `do...while` est parcourue au moins une fois e ```js var i = 0; do { - i += 1; - console.log(i); + i += 1; + console.log(i); } while (i < 5); ``` diff --git a/files/fr/web/javascript/reference/statements/empty/index.md b/files/fr/web/javascript/reference/statements/empty/index.md index f9b5be043fee59..a335a8cffaa991 100644 --- a/files/fr/web/javascript/reference/statements/empty/index.md +++ b/files/fr/web/javascript/reference/statements/empty/index.md @@ -12,7 +12,7 @@ Une **instruction vide** est utilisée pour ne fournir aucune instruction là o ## Syntaxe -```js +```js-nolint ; ``` @@ -28,32 +28,29 @@ L'instruction vide peut être utilisée dans les boucles. Par exemple, ici on a var arr = [1, 2, 3]; // Affecter 0 pour toutes les valeurs du tableau -for (i = 0; i < arr.length; arr[i++] = 0) /* instruction vide */ ; +for (i = 0; i < arr.length; arr[i++] = 0 /* instruction vide */); -console.log(arr) +console.log(arr); // [0, 0, 0] ``` > **Note :** Cela peut être raisonnable que de commenter l'utilisation d'une instruction vide pour la rendre visible et l'expliciter. Par exemple, dans le code qui suit, le point-virgule ne semble pas intentionnel : ```js -if (condition); // Attention, ce "if" ne fait rien ! - finDuMonde() // Cette méthode est donc toujours lancée !!! +if (condition); // Attention, ce "if" ne fait rien ! +finDuMonde(); // Cette méthode est donc toujours lancée !!! ``` Un autre exemple avec une instruction {{jsxref("Instructions/if...else")}} sans accolade (`{}`). Si `trois` vaut `true`, rien ne sera exécuté, peu importera la valeur de `quatre`, la fonction `chargerFusée()` ne sera pas exécutée. ```js -if (un) - faire1èreEtape(); -else if (deux) - faire4èmeEtape(); -else if (trois) - ; // rien ici +if (un) faire1èreEtape(); +else if (deux) faire4èmeEtape(); +else if (trois); else if (quatre) + // rien ici faire4èmeEtape(); -else - chargerFusée(); +else chargerFusée(); ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/statements/export/index.md b/files/fr/web/javascript/reference/statements/export/index.md index 0bef40024a10bc..a9c1e8b02e1b97 100644 --- a/files/fr/web/javascript/reference/statements/export/index.md +++ b/files/fr/web/javascript/reference/statements/export/index.md @@ -51,24 +51,24 @@ Il existe deux types d'export différents : les exports **nommés** et les expor - Les exports nommés : ```js - // exporte une fonction déclarée précédemment - export { maFonction }; + // exporte une fonction déclarée précédemment + export { maFonction }; - // exporte une constante - export const machin = Math.sqrt(2); - ``` + // exporte une constante + export const machin = Math.sqrt(2); + ``` - Les exports par défaut (fonction) : ```js - export default function() {} - ``` + export default function () {} + ``` - Les exports par défaut (classe) : ```js - export default class {} - ``` + export default class {} + ``` Les exports nommés sont utiles pour exporter plusieurs valeurs. Lors de l'importation, il est obligatoire d'utiliser le même nom de l'objet correspondant. @@ -77,8 +77,8 @@ Mais un export par défaut peut être importé avec n'importe quel nom, par exem ```js let k; export default k = 12; // dans le fichier test.js -import m from './test'; // notez que nous avons la liberté d'utiliser import m au lieu de import k, parce que k était l'export par défaut -console.log (m); // enregistrera 12 +import m from "./test"; // notez que nous avons la liberté d'utiliser import m au lieu de import k, parce que k était l'export par défaut +console.log(m); // enregistrera 12 ``` La syntaxe suivante n'exporte pas le défaut depuis le module importé : @@ -90,7 +90,7 @@ export * from …; Si vous avez besoin d'exporter le défaut, écrivez ce qui suit à la place : ```js -export {default} from 'mod'; +export { default } from "mod"; ``` Il est possible de renommer un export afin d'éviter des conflits de nommage : @@ -104,11 +104,11 @@ On peut également agréger les valeurs exportées à celles d'autres modules qu ```js // Dans moduleParent.js -export { maFonction, maVariable } from 'moduleFils1.js'; -export { maClasse } from 'moduleFils2.js' +export { maFonction, maVariable } from "moduleFils1.js"; +export { maClasse } from "moduleFils2.js"; // Dans le module de plus haut niveau -import { maFonction, maVariable, maClasse } from 'moduleParent.js'; +import { maFonction, maVariable, maClasse } from "moduleParent.js"; ``` ## Exemples @@ -129,9 +129,9 @@ export { cube, machin }; De cette façon, dans un autre script, on pourra avoir : ```js -import { cube, machin } from 'mon-module'; +import { cube, machin } from "mon-module"; console.log(cube(3)); // 27 -console.log(machin); // 4.555806215962888 +console.log(machin); // 4.555806215962888 ``` > **Note :** Si l'import est réalisé dans un script HTML, il faut que celui-ci soit chargé avec l'attribut [`type`](/fr/docs/Web/HTML/Global_attributes#type) `"module"` : `` sinon il y aura une erreur quant aux origines multiples ([CORS](/fr/docs/Web/HTTP/CORS)). @@ -151,7 +151,7 @@ export default function cube(x) { Alors, dans un autre script, il sera facile d'importer l'export par défaut : ```js -import cube from './mon-module.js'; +import cube from "./mon-module.js"; console.log(cube(3)); // 27 ``` diff --git a/files/fr/web/javascript/reference/statements/for-await...of/index.md b/files/fr/web/javascript/reference/statements/for-await...of/index.md index da17e31fe159ad..8bfd590e511f80 100644 --- a/files/fr/web/javascript/reference/statements/for-await...of/index.md +++ b/files/fr/web/javascript/reference/statements/for-await...of/index.md @@ -12,7 +12,7 @@ L'instruction **`for await…of`** permet de créer une boucle qui parcourt les ```js for await (const variable of iterable) { - instruction + instruction; } ``` @@ -36,14 +36,14 @@ var asyncIterable = { } return Promise.resolve({ done: true }); - } + }, }; - } + }, }; -(async function() { - for await (let num of asyncIterable) { - console.log(num); +(async function () { + for await (let num of asyncIterable) { + console.log(num); } })(); // 0 @@ -63,7 +63,7 @@ async function* asyncGenerator() { } } -(async function() { +(async function () { for await (let num of asyncGenerator()) { console.log(num); } @@ -106,7 +106,7 @@ async function getResponseSize(url) { console.log(`Taille de la réponse : ${responseSize} octets`); return responseSize; } -getResponseSize('https://jsonplaceholder.typicode.com/photos'); +getResponseSize("https://jsonplaceholder.typicode.com/photos"); ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/statements/for...in/index.md b/files/fr/web/javascript/reference/statements/for...in/index.md index 3f4e42f1cdde3a..7f6938b1f2bc0c 100644 --- a/files/fr/web/javascript/reference/statements/for...in/index.md +++ b/files/fr/web/javascript/reference/statements/for...in/index.md @@ -14,7 +14,7 @@ L'**instruction `for...in`** permet d'itérer sur les [propriétés énumérable ```js for (variable in objet) { - instructions + instructions; } ``` @@ -52,7 +52,7 @@ Si on souhaite ne parcourir que les propriétés propres d'un objet et pas celle La boucle `for...in` qui suit utilise parcourt l'objet `obj` et ses propriétés énumérables qui ne sont pas des symboles en fournissant la chaîne de caractères qui décrit le nom de la propriété et sa valeur. ```js -var obj = {a:1, b:2, c:3}; +var obj = { a: 1, b: 2, c: 3 }; for (var prop in obj) { console.log(`obj.${prop} = ${obj[prop]}`); @@ -67,7 +67,7 @@ for (var prop in obj) { La fonction qui suit utilise {{jsxref("Object.hasOwnProperty", "hasOwnProperty()")}} pour ne pas afficher les propriétés héritées : ```js -var triangle = {a:1, b:2, c:3}; +var triangle = { a: 1, b: 2, c: 3 }; function TriangleCouleur() { this.couleur = "rouge"; @@ -78,7 +78,7 @@ TriangleCouleur.prototype = triangle; var obj = new TriangleCouleur(); for (var prop in obj) { - if( obj.hasOwnProperty( prop ) ) { + if (obj.hasOwnProperty(prop)) { console.log(`obj.${prop} = ${obj[prop]}`); } } diff --git a/files/fr/web/javascript/reference/statements/for...of/index.md b/files/fr/web/javascript/reference/statements/for...of/index.md index 64859c1ddfc89d..c8646fde8a1394 100644 --- a/files/fr/web/javascript/reference/statements/for...of/index.md +++ b/files/fr/web/javascript/reference/statements/for...of/index.md @@ -14,7 +14,7 @@ L'**instruction `for...of`** permet de créer une boucle {{jsxref("Array")}} qui ```js for (variable of iterable) { - instruction + instruction; } ``` @@ -56,7 +56,7 @@ for (const valeur of tableauItérable) { ### Parcourir une chaîne de caractères avec `for...of` ```js -let iterable = 'pixel'; +let iterable = "pixel"; for (let valeur of iterable) { console.log(valeur); @@ -83,7 +83,11 @@ for (let valeur of iterable) { ### Parcourir une {{jsxref("Map")}} ```js -let iterable = new Map([['a', 1], ['b', 2], ['c', 3]]); +let iterable = new Map([ + ["a", 1], + ["b", 2], + ["c", 3], +]); for (let element of iterable) { console.log(element); @@ -110,14 +114,14 @@ arr.toto = "coucou"; arr.forEach(function (element, index) { console.log(element); // affiche "3", "5", "7" - console.log(index); // affiche "0", "1", "2" + console.log(index); // affiche "0", "1", "2" }); // ou avec Object.keys() Object.keys(arr).forEach(function (element, index) { console.log(arr[element]); // affiche "3", "5", "7", "coucou" - console.log(arr[index]); // affiche "3", "5", "7", undefined + console.log(arr[index]); // affiche "3", "5", "7", undefined }); ``` @@ -126,8 +130,8 @@ Object.keys(arr).forEach(function (element, index) { Il est possible de parcourir l'objet {{jsxref("Fonctions/arguments", "arguments")}} afin d'examiner l'ensemble des paramètres passés à la fonction : ```js -(function() { - for (let argument of arguments){ +(function () { + for (let argument of arguments) { console.log(argument); } })(1, 2, 3); @@ -160,7 +164,7 @@ function* toto() { yield 1; yield 2; yield 3; -}; +} for (let o of toto()) { console.log(o); @@ -173,7 +177,8 @@ for (let o of toto()) { Grâce à cette instruction, on peut également itérer sur les {{jsxref("Instructions/function*","générateurs","",1)}} : ```js -function* fibonacci() { // une fonction génératrice +function* fibonacci() { + // une fonction génératrice let [prev, curr] = [0, 1]; while (true) { [prev, curr] = [curr, prev + curr]; @@ -184,7 +189,7 @@ function* fibonacci() { // une fonction génératrice for (let n of fibonacci()) { console.log(n); // on arrête la séquence à 1000 - if (n >= 1000){ + if (n >= 1000) { break; } } @@ -204,9 +209,9 @@ var iterable = { return { value: this.i++, done: false }; } return { value: undefined, done: true }; - } + }, }; - } + }, }; for (let value of iterable) { @@ -229,15 +234,15 @@ L'instruction `for...of` permet quant à elle de parcourir les données contenue Dans l'exemple qui suit, on illustre la différence de comportement entre une boucle `for...of` et une boucle `for...in` utilisées sur un tableau ({{jsxref("Array")}}). ```js -Object.prototype.objCustom = function() {}; -Array.prototype.arrCustom = function() {}; +Object.prototype.objCustom = function () {}; +Array.prototype.arrCustom = function () {}; let iterable = [3, 5, 7]; -iterable.toto = 'coucou'; +iterable.toto = "coucou"; for (let i in iterable) { console.log(i); // affiche 0, 1, 2, "toto", - // "arrCustom", "objCustom" + // "arrCustom", "objCustom" } for (let i in iterable) { @@ -256,7 +261,7 @@ Chaque objet héritera de la propriété `objCustom` et chaque objet qui est un ```js for (let i in iterable) { console.log(i); // affiche 0, 1, 2, "toto", - // "arrCustom" et "objCustom" + // "arrCustom" et "objCustom" } ``` @@ -285,7 +290,7 @@ Cette boucle parcourt les valeurs définies comme itérables par [l'objet itéra Les générateurs ne doivent pas être réutilisés, même lorsque la boucle `for...of` a été interrompue (par exemple lorsque {{jsxref("Instructions/break","break")}} est utilisé). Lorsqu'on quitte une boucle, le générateur est clôturé et si on l'utilise à nouveau, il ne fournira aucun résultat. Firefox n'a pas encore implémenté ce comportement standard (cf. [bug Firefox 1147371](https://bugzil.la/1147371)). ```js -var gen = (function *(){ +var gen = (function* () { yield 1; yield 2; yield 3; @@ -296,7 +301,7 @@ for (let o of gen) { } // Le générateur ne doit pas être réutilisé ! -for (let o of gen){ +for (let o of gen) { console.log(o); // Ceci n'est jamais exécuté } ``` diff --git a/files/fr/web/javascript/reference/statements/for/index.md b/files/fr/web/javascript/reference/statements/for/index.md index 54867152565294..7eda8ff37a3cad 100644 --- a/files/fr/web/javascript/reference/statements/for/index.md +++ b/files/fr/web/javascript/reference/statements/for/index.md @@ -13,8 +13,7 @@ L'instruction **`for`** crée une boucle composée de trois expressions optionne ## Syntaxe ```js -for ([initialisation]; [condition]; [expression-finale]) - instruction +for ([initialisation]; [condition]; [expression_finale]) instruction; ``` ### Paramètres @@ -36,8 +35,8 @@ L'instruction `for` qui suit débute en déclarant la variable `i` et en l'initi ```js for (var i = 0; i < 9; i++) { - n += i; - myfunc(n); + n += i; + myfunc(n); } ``` @@ -50,18 +49,18 @@ Par exemple, le bloc pour l'initialisation peut ne pas être utilisé : ```js var i = 0; for (; i < 9; i++) { - console.log(i); - // d'autres instructions + console.log(i); + // d'autres instructions } ``` De même que pour le bloc d'initialisation, l'expression de condition est optionnelle. Attention, si l'expression de condition n'est pas utilisée, il faut s'assurer d'interrompre la boucle et de ne pas créer une boucle infinie. ```js -for (var i = 0;; i++) { - console.log(i); - if (i > 3) break; - // d'autres instructions +for (var i = 0; ; i++) { + console.log(i); + if (i > 3) break; + // d'autres instructions } ``` @@ -82,12 +81,27 @@ for (;;) { L'instruction `for` qui suit calcule le décalage d'un nœud et le fait dans la section qui correspond à l'expression finale. Il n'y a donc aucun intérêt à ajouter une instruction ou un bloc d'instruction dans la boucle pour faire ce calcul. ```js -function showOffsetPos (sId) { - var nLeft = 0, nTop = 0; - - for (var oItNode = document.getElementById(sId); oItNode; nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent); - - console.log("Décalage de position : \"" + sId + "\" element:\n left: " + nLeft + "px;\n top: " + nTop + "px;"); +function showOffsetPos(sId) { + var nLeft = 0, + nTop = 0; + + for ( + var oItNode = document.getElementById(sId); + oItNode; + nLeft += oItNode.offsetLeft, + nTop += oItNode.offsetTop, + oItNode = oItNode.offsetParent + ); + + console.log( + 'Décalage de position : "' + + sId + + '" element:\n left: ' + + nLeft + + "px;\n top: " + + nTop + + "px;", + ); } ``` diff --git a/files/fr/web/javascript/reference/statements/function/index.md b/files/fr/web/javascript/reference/statements/function/index.md index b2deac8bf6f8b2..f4ed5d361fc39a 100644 --- a/files/fr/web/javascript/reference/statements/function/index.md +++ b/files/fr/web/javascript/reference/statements/function/index.md @@ -41,9 +41,15 @@ Il est possible de déclarer des fonctions de façon conditionnelle (c'est-à-di ```js var remontee = "toto" in this; -console.log(`'toto' ${remontee ? "est" : "n'est pas"} remontée. typeof toto vaut ${typeof toto}`); +console.log( + `'toto' ${ + remontee ? "est" : "n'est pas" + } remontée. typeof toto vaut ${typeof toto}`, +); if (false) { - function toto(){ return 1; } + function toto() { + return 1; + } } // Pour Chrome: @@ -63,9 +69,15 @@ On obtient exactement les mêmes résultats si la condition est vérifiée (ici ```js var remontee = "toto" in this; -console.log(`'toto' ${remontee ? "est" : "n'est pas"} remontée. typeof toto vaut ${typeof toto}`); +console.log( + `'toto' ${ + remontee ? "est" : "n'est pas" + } remontée. typeof toto vaut ${typeof toto}`, +); if (true) { - function toto(){ return 1; } + function toto() { + return 1; + } } // Pour Chrome: @@ -98,8 +110,8 @@ On notera que les {{jsxref("Opérateurs/L_opérateur_function", "expressions de ```js nonRemontée(); // TypeError: nonRemontée is not a function -var nonRemontée = function() { - console.log("truc"); +var nonRemontée = function () { + console.log("truc"); }; ``` @@ -111,7 +123,7 @@ Dans l'exemple qui suit, on déclare une fonction qui renvoie le total des vente ```js function calc_ventes(nb_produits_a, nb_produits_b, nb_produits_c) { - return nb_produits_a*79 + nb_produits_b * 129 + nb_produits_c * 699; + return nb_produits_a * 79 + nb_produits_b * 129 + nb_produits_c * 699; } ``` diff --git a/files/fr/web/javascript/reference/statements/function_star_/index.md b/files/fr/web/javascript/reference/statements/function_star_/index.md index f48afb136148d0..91420d22da8d65 100644 --- a/files/fr/web/javascript/reference/statements/function_star_/index.md +++ b/files/fr/web/javascript/reference/statements/function_star_/index.md @@ -44,7 +44,7 @@ On peut utiliser une instruction `return` dans un générateur. Lorsque cette in ### Exemple simple ```js -function* creerID(){ +function* creerID() { var index = 0; while (true) { yield index++; @@ -73,9 +73,9 @@ var gen = logGenerator(); // le premier appel à next exécute la fonction depuis son // début jusqu'au premier yield rencontré gen.next(); -gen.next('bretzel'); // bretzel -gen.next('california'); // california -gen.next('mayonnaise'); // mayonnaise +gen.next("bretzel"); // bretzel +gen.next("california"); // california +gen.next("mayonnaise"); // mayonnaise ``` ### Exemple utilisant yield\* @@ -86,7 +86,7 @@ function* autreGenerateur(i) { yield i + 2; yield i + 3; } -function* generateur(i){ +function* generateur(i) { yield i; yield* autreGenerateur(i); yield i + 10; @@ -121,11 +121,11 @@ console.log(gen.next()); // { value: undefined, done: true } ```js const monObj = { - *generator () { + *generator() { yield "a"; yield "b"; - } -} + }, +}; const gen = monObj.generator(); @@ -138,28 +138,28 @@ console.log(gen.next()); // { value: undefined, done: true } ```js class Toto { - *[Symbol.iterator] () { + *[Symbol.iterator]() { yield 1; yield 2; } } const monObj = { - *[Symbol.iterator] () { + *[Symbol.iterator]() { yield "a"; yield "b"; - } -} + }, +}; -console.log(Array.from(new Toto)); // [1, 2] -console.log(Array.from(monObj)); // [ "a", "b"] +console.log(Array.from(new Toto())); // [1, 2] +console.log(Array.from(monObj)); // [ "a", "b"] ``` ### Les générateurs ne sont pas constructibles ```js example-bad function* f() {} -var obj = new f; // lève une TypeError: f n'est pas un constructeur +var obj = new f(); // lève une TypeError: f n'est pas un constructeur ``` ### Générateur défini avec une expression diff --git a/files/fr/web/javascript/reference/statements/if...else/index.md b/files/fr/web/javascript/reference/statements/if...else/index.md index ebb58f099ae6e4..c4ce24ce286832 100644 --- a/files/fr/web/javascript/reference/statements/if...else/index.md +++ b/files/fr/web/javascript/reference/statements/if...else/index.md @@ -14,9 +14,9 @@ L'instruction **`if`** exécute une instruction si une condition donnée est vra ```js if (condition) { - statement1 + statement1; } else { - statement2 + statement2; } ``` @@ -60,9 +60,9 @@ Afin d'exécuter plusieurs instructions, on utilisera un {{jsxref("Statements/bl ```js if (condition) { - instructions1 + instructions1; } else { - instructions2 + instructions2; } ``` @@ -91,7 +91,7 @@ if (cipher_char == from_char) { Bien qu'il n'y ait pas de mot-clé elseif dans le langage JavaScript, il est possible d'imbriquer des instructions if...else à la suite les une des autres en plaçant un espace entre else et le début de l'instruction if imbriquée : ```js -if (x > 50){ +if (x > 50) { // faire quelque chose } else if (x > 5) { // faire autre chose @@ -105,7 +105,7 @@ if (x > 50){ Il est conseillé de ne pas utiliser d'affectation au sein des expressions conditionnelles. En effet, l'affectation peut être confondue avec un test d'égalité lorsqu'on analyse le code. Il ne faut donc pas utiliser le code suivant (bien qu'il fonctionne) : ```js example-bad -if (x = y) { +if ((x = y)) { /* exécuter les instructions */ } ``` diff --git a/files/fr/web/javascript/reference/statements/import/index.md b/files/fr/web/javascript/reference/statements/import/index.md index f7068d3d426770..70903e2863bfa3 100644 --- a/files/fr/web/javascript/reference/statements/import/index.md +++ b/files/fr/web/javascript/reference/statements/import/index.md @@ -46,7 +46,7 @@ Le paramètre `nom` est le nom de l'"objet module" qui sera utilisé comme un ge Ce qui suit insère `monModule` dans la portée courante, contenant tous les exports du module dans le fichier situé dans `/modules/mon-module.js`. ```js -import * as monModule from '/modules/mon-module.js'; +import * as monModule from "/modules/mon-module.js"; ``` Ici, accéder aux exports signifie utiliser le nom du module (ici `monModule`) comme un espace de noms. Par exemple, si le module importé ci-dessus incluait un export `faireToutesLesChosesIncroyables()`, vous l'écririez comme ceci : @@ -60,7 +60,7 @@ monModule.faireToutesLesChosesIncroyables(); Étant donné un objet ou une valeur nommé(e) `monExport` qui est exporté(e) depuis le module `mon-module`, soit implicitement (parce que l'intégralité du module est exportée), soit explicitement (en utilisant l'instruction {{jsxref("Statements/export", "export")}}), ce qui suit insére `monExport` dans la portée courante. ```js -import {monExport} from '/modules/mon-module.js'; +import { monExport } from "/modules/mon-module.js"; ``` ### Importer plusieurs éléments exportés depuis un module @@ -68,7 +68,7 @@ import {monExport} from '/modules/mon-module.js'; Ce qui suit insère à la fois `machin` et `truc` dans la portée courante. ```js -import {machin, truc} from '/modules/mon-module.js'; +import { machin, truc } from "/modules/mon-module.js"; ``` ### Importer un élément exporté avec un alias @@ -76,8 +76,7 @@ import {machin, truc} from '/modules/mon-module.js'; Vous pouvez renommer un export lors de l'importation. Par exemple, ce qui suit insére `nomCourt` dans la portée courante. ```js -import {nomDExportDeModuleVraimentVraimentLong as nomCourt} - from '/modules/mon-module.js'; +import { nomDExportDeModuleVraimentVraimentLong as nomCourt } from "/modules/mon-module.js"; ``` ### Renommer plusieurs exports pendant l'import @@ -87,8 +86,8 @@ Importe des exports multiples depuis un module avec des alias commodes : ```js import { nomDExportDeModuleVraimentVraimentLong as nomCourt, - unAutreNomDeModuleLong as court -} from '/modules/mon-module.js'; + unAutreNomDeModuleLong as court, +} from "/modules/mon-module.js"; ``` ### Importer un module uniquement pour ses effets de bord @@ -96,7 +95,7 @@ import { Importe un module complet pour ses effets de bord seulement, sans importer quoi que ce soit. Ce qui suit exécute le code global du module, mais n'importe en fait aucune valeur. ```js -import '/modules/mon-module.js'; +import "/modules/mon-module.js"; ``` ### Importation des défauts @@ -106,20 +105,20 @@ Il est possible d'avoir un {{jsxref("Statements/export", "export")}} par défaut La version la plus simple importe directement le défaut : ```js -import monDefaut from '/modules/mon-module.js'; +import monDefaut from "/modules/mon-module.js"; ``` Il est également possible d'utiliser la syntaxe de défaut avec celles vues ci-dessus (imports d'espaces de noms ou imports nommés). Dans de tels cas, l'import par défaut devra être déclaré en premier. Par exemple : ```js -import monDefaut, * as monModule from '/modules/mon-module.js'; +import monDefaut, * as monModule from "/modules/mon-module.js"; // monModule utilisé comme un espace de noms ``` ou ```js -import monDefaut, {machin, truc} from '/modules/mon-module.js'; +import monDefaut, { machin, truc } from "/modules/mon-module.js"; // imports nommés spécifiques ``` @@ -128,16 +127,15 @@ import monDefaut, {machin, truc} from '/modules/mon-module.js'; Le mot-clé `import` peut être utilisé comme une fonction afin d'importer dynamiquement un module (utile lorsqu'on souhaite charger un module selon une condition donnée ou faire du chargement à la demande). Lorsqu'il est utilisé de cette façon, il renvoie une promesse : ```js -import('/modules/mon-module.js') - .then((module) => { - // Faire quelque chose avec le module - }); +import("/modules/mon-module.js").then((module) => { + // Faire quelque chose avec le module +}); ``` On peut utiliser cette forme avec le mot-clé `await` : ```js -let module = await import('/modules/mon-module.js'); +let module = await import("/modules/mon-module.js"); ``` ## Exemples @@ -150,24 +148,25 @@ Importation depuis un module secondaire pour aider le traitement d'une requête function getJSON(url, rappel) { let xhr = new XMLHttpRequest(); xhr.onload = function () { - rappel(this.responseText) + rappel(this.responseText); }; - xhr.open('GET', url, true); + xhr.open("GET", url, true); xhr.send(); } export function recupererContenuUtile(url, rappel) { - getJSON(url, donnees => rappel(JSON.parse(donnees))); + getJSON(url, (donnees) => rappel(JSON.parse(donnees))); } ``` ### Le programme principal : principal.js ```js -import { recupererContenuUtile } from '/modules/fichier.js'; +import { recupererContenuUtile } from "/modules/fichier.js"; -recupererContenuUtile('http://www.example.com', - donnees => { faireQuelqueChoseDUtile(donnees); }); +recupererContenuUtile("http://www.example.com", (donnees) => { + faireQuelqueChoseDUtile(donnees); +}); ``` ### Import dynamique @@ -177,20 +176,18 @@ Dans cet exemple, on voit comment charger une fonctionnalité sur une page lorsq ```js const main = document.querySelector("main"); for (const link of document.querySelectorAll("nav > a")) { - link.addEventListener("click", e => { + link.addEventListener("click", (e) => { e.preventDefault(); - import('/modules/mon-module.js') - .then(module => { + import("/modules/mon-module.js") + .then((module) => { module.loadPageInto(main); }) - .catch(err => { + .catch((err) => { main.textContent = err.message; }); }); } - -; ``` ## Spécifications diff --git a/files/fr/web/javascript/reference/statements/label/index.md b/files/fr/web/javascript/reference/statements/label/index.md index 2e06d34fbb7e8d..ac22074c8955af 100644 --- a/files/fr/web/javascript/reference/statements/label/index.md +++ b/files/fr/web/javascript/reference/statements/label/index.md @@ -15,8 +15,7 @@ Une **instruction étiquetée (_labeled_ en anglais)** peut être utilisée avec ## Syntaxe ```js -label : - instruction +label: instruction; ``` - `label` @@ -39,16 +38,16 @@ En [mode strict](/fr/docs/Web/JavaScript/Reference/Strict_mode), on ne peut pas ```js var i, j; -boucle1: -for (i = 0; i < 3; i++) { //Le premier for correspond à "boucle1" - boucle2: - for (j = 0; j < 3; j++) { //Le second for correspond à "boucle2" - if (i === 1 && j === 1) { - continue boucle1; - } else { - console.log("i = " + i + ", j = " + j); - } - } +boucle1: for (i = 0; i < 3; i++) { + //Le premier for correspond à "boucle1" + boucle2: for (j = 0; j < 3; j++) { + //Le second for correspond à "boucle2" + if (i === 1 && j === 1) { + continue boucle1; + } else { + console.log("i = " + i + ", j = " + j); + } + } } // On aura les résultats suivants : @@ -70,10 +69,9 @@ for (i = 0; i < 3; i++) { //Le premier for correspond à "boucle1" var nbItemsReussis = 0; var i, j; -top: -for (i = 0; i < items.length; i++){ - for (j = 0; j < tests.length; j++){ - if (!tests[j].reussi(items[i])){ +top: for (i = 0; i < items.length; i++) { + for (j = 0; j < tests.length; j++) { + if (!tests[j].reussi(items[i])) { continue top; } } @@ -86,10 +84,10 @@ for (i = 0; i < items.length; i++){ ```js var i, j; -boucle1: -for (i = 0; i < 3; i++) { // première boucle étiquetée « boucle1 » - boucle2: - for (j =0; j < 3; j++) { // seconde boucle étiquetée « boucle2 » +boucle1: for (i = 0; i < 3; i++) { + // première boucle étiquetée « boucle1 » + boucle2: for (j = 0; j < 3; j++) { + // seconde boucle étiquetée « boucle2 » if (i == 1 && j == 1) { break boucle1; } @@ -114,10 +112,9 @@ for (i = 0; i < 3; i++) { // première boucle étiquetée « boucle1 » var toutReussi = true; var i, j; -top: -for (i = 0; items.length; i++) +top: for (i = 0; items.length; i++) for (j = 0; j < tests.length; i++) - if (!tests[j].reusi(items[i])){ + if (!tests[j].reusi(items[i])) { toutReussi = false; break top; } @@ -138,7 +135,7 @@ console.log("swap"); // On aura alors dans la console : // "face" -// "swap +// "swap ``` ### Déclarations de fonctions étiquetées diff --git a/files/fr/web/javascript/reference/statements/let/index.md b/files/fr/web/javascript/reference/statements/let/index.md index 9dadde75343dae..f9abbe33761f0e 100644 --- a/files/fr/web/javascript/reference/statements/let/index.md +++ b/files/fr/web/javascript/reference/statements/let/index.md @@ -46,19 +46,19 @@ if (x > y) { function varTest() { var x = 1; if (true) { - var x = 2; // c'est la même variable ! - console.log(x); // 2 + var x = 2; // c'est la même variable ! + console.log(x); // 2 } - console.log(x); // 2 + console.log(x); // 2 } function letTest() { let x = 1; if (true) { - let x = 2; // c'est une variable différente - console.log(x); // 2 + let x = 2; // c'est une variable différente + console.log(x); // 2 } - console.log(x); // 1 + console.log(x); // 1 } ``` @@ -87,8 +87,8 @@ for (var i = 1; i <= 5; i++) { var item = document.createElement("li"); item.appendChild(document.createTextNode("Item " + i)); - (function(i) { - item.onclick = function(ev) { + (function (i) { + item.onclick = function (ev) { console.log("Item " + i + " a reçu un clic."); }; })(i); @@ -106,30 +106,30 @@ Les variables déclarées avec `let` appartiennent à la portée du bloc dans le function varTest() { var x = 31; if (true) { - var x = 71; // c'est la même variable ! - console.log(x); // 71 + var x = 71; // c'est la même variable ! + console.log(x); // 71 } - console.log(x); // 71 + console.log(x); // 71 } function letTest() { let x = 31; if (true) { - let x = 71; // c'est une variable différente - console.log(x); // 71 + let x = 71; // c'est une variable différente + console.log(x); // 71 } - console.log(x); // 31 + console.log(x); // 31 } ``` Au niveau le plus haut (la portée globale), `let` crée une variable globale alors que `var` ajoute une propriété à l'objet global : ```js -var x = 'global'; -let y = 'global2'; +var x = "global"; +let y = "global2"; console.log(this.x); // "global" console.log(this.y); // undefined -console.log(y); // "global2" +console.log(y); // "global2" ``` ### Émuler le fonctionnement des interfaces privées @@ -143,19 +143,19 @@ var Truc; let porteePrivee = new WeakMap(); let compteur = 0; - Truc = function() { - this.unePropriete = 'toto'; + Truc = function () { + this.unePropriete = "toto"; porteePrivee.set(this, { cachee: ++compteur, }); }; - Truc.prototype.montrerPublique = function() { + Truc.prototype.montrerPublique = function () { return this.unePropriete; }; - Truc.prototype.montrerPrivee = function() { + Truc.prototype.montrerPrivee = function () { return porteePrivee.get(this).cachee; }; } @@ -219,7 +219,7 @@ Par contre, si on ajoute une instruction de bloc dans la clause `case`, cela cr ```js let x = 1; -switch(x) { +switch (x) { case 0: { let toto; break; @@ -243,8 +243,8 @@ if (a === 1) { var a = 11; // la portée est la portée globale let b = 22; // la portée est celle du bloc if - console.log(a); // 11 - console.log(b); // 22 + console.log(a); // 11 + console.log(b); // 22 } console.log(a); // 11 @@ -277,10 +277,10 @@ let i = 10; Dans l'exemple qui suit, dans l'expression `toto + 55`, l'identifiant `toto` fait référence à la variable du bloc courant et non à celle qui est déclarée au dessus et qui a la valeur 33. Dans l'instruction `let toto = (toto + 55);` l'instruction est bien remontée mais l'endroit où on utilise `toto` (dans le fragment `(toto + 55`)) est toujours dans la zone morte temporaire car `toto` n'a pas encore été affecté. ```js example-bad -function test(){ +function test() { var toto = 33; if (true) { - let toto = (toto + 55); // ReferenceError: can't access lexical declaration `toto` before initialization + let toto = toto + 55; // ReferenceError: can't access lexical declaration `toto` before initialization } } test(); @@ -290,11 +290,12 @@ Si on utilise `let` avec un nom de variable qui est le même que celui de l'argu ```js example-bad function go(n) { - for (let n of n.a){ // ReferenceError: can't access lexical declaration `n' before initialization + for (let n of n.a) { + // ReferenceError: can't access lexical declaration `n' before initialization console.log(n); } } -go({a:[1, 2, 3]}); +go({ a: [1, 2, 3] }); ``` ### Les variables déclarées avec `let` et les boucles `for` @@ -303,7 +304,7 @@ Le mot-clé `let` permet de lier des variables localement dans la portée des bo ```js var a = 0; -for ( let i = a; i < 10; i++ ) { +for (let i = a; i < 10; i++) { console.log(i); } ``` @@ -311,7 +312,7 @@ for ( let i = a; i < 10; i++ ) { #### Règles de portées ```js -for (let expr1; expr2; expr3) instruction +for (let expr1; expr2; expr3) instruction; ``` Dans cet exemple, `expr2`, `expr3`, et `instruction` sont contenues dans un bloc implicite qui contient la variable de bloc local déclarée avec `let expr1`. @@ -330,8 +331,8 @@ if (a === 5) { let a = 4; // La portée est celle du bloc if var b = 1; // La portée est celle interne à la fonction - console.log(a); // 4 - console.log(b); // 1 + console.log(a); // 4 + console.log(b); // 1 } console.log(a); // 5 @@ -343,7 +344,7 @@ console.log(b); // 1 Le mot-clé let permet de lier des variables à la portée de la boucle plutôt qu'à celle de la fonction (avec `var`) : ```js -for (let i = 0; i<10; i++) { +for (let i = 0; i < 10; i++) { console.log(i); // 0, 1, 2, 3, 4 ... 9 } diff --git a/files/fr/web/javascript/reference/statements/return/index.md b/files/fr/web/javascript/reference/statements/return/index.md index 672717e392bc6f..429ea6ee5585ee 100644 --- a/files/fr/web/javascript/reference/statements/return/index.md +++ b/files/fr/web/javascript/reference/statements/return/index.md @@ -46,7 +46,7 @@ return x + y / 3; L'instruction `return` peut être impactée par [l'ajout automatique de point-virgule (_ASI_ en anglais)](/fr/docs/Web/JavaScript/Reference/Grammaire_lexicale#Insertion_automatique_de_points-virgules). Il est interdit d'avoir un caractère de fin de ligne entre le mot-clé `return` et l'expression : ```js -return +return; a + b; ``` @@ -77,7 +77,7 @@ La fonction suivante renvoie le carré de son argument : ```js function carré(x) { - return x * x; + return x * x; } ``` @@ -87,14 +87,15 @@ Une fonction s'arrête immédiatement à l'instant où l'instruction `return` es ```js function compteur() { - for (var compte = 1; ; compte++) { // boucle infinie + for (var compte = 1; ; compte++) { + // boucle infinie console.log(compte + "A"); // jusqu'à 5 - if (compte === 5) { - return; - } - console.log(compte + "B"); // jusqu'à 4 + if (compte === 5) { + return; } - console.log(compte + "C"); // cette instruction n'est jamais utilisée + console.log(compte + "B"); // jusqu'à 4 + } + console.log(compte + "C"); // cette instruction n'est jamais utilisée } compteur(); @@ -117,7 +118,9 @@ Pour en savoir plus sur les fermetures (_closures_), voir [cet article sur les f ```js function magique() { - return function calc(x) { return x * 42 }; + return function calc(x) { + return x * 42; + }; } var réponse = magique(); diff --git a/files/fr/web/javascript/reference/statements/switch/index.md b/files/fr/web/javascript/reference/statements/switch/index.md index c88bf303627129..7d8a4d95ac69ac 100644 --- a/files/fr/web/javascript/reference/statements/switch/index.md +++ b/files/fr/web/javascript/reference/statements/switch/index.md @@ -95,22 +95,22 @@ Si on omet une instruction `break`, le script exécutera les instructions pour l ```js var toto = 0; switch (toto) { - case -1: - console.log('moins un'); - break; - case 0: // toto vaut 0 donc ce cas correspond - console.log(0); - // NOTE : le break aurait du être placé ici - case 1: // pas de break pour 'case 0:' les instructions de ce cas sont - // exécutées aussi - console.log(1); - break; // on a un break a ce niveau donc les instructions - // des cas suivants ne seront pas exécutées - case 2: - console.log(2); - break; - default: - console.log('default'); + case -1: + console.log("moins un"); + break; + case 0: // toto vaut 0 donc ce cas correspond + console.log(0); + // NOTE : le break aurait du être placé ici + case 1: // pas de break pour 'case 0:' les instructions de ce cas sont + // exécutées aussi + console.log(1); + break; // on a un break a ce niveau donc les instructions + // des cas suivants ne seront pas exécutées + case 2: + console.log(2); + break; + default: + console.log("default"); } ``` @@ -119,7 +119,7 @@ switch (toto) { Oui, il est possible de placer le cas `default` entre deux autres cas. Ainsi, si on a une valeur qui ne correspond pas aux différents cas, elle passera par le bloc `default` puis par les autres s'il n'y a pas de `break`. Par exemple : ```js -var toto = 5 +var toto = 5; switch (toto) { case 2: console.log(2); // ne sera pas exécuté @@ -128,7 +128,7 @@ switch (toto) { console.log("default"); // sera exécuté case 1: console.log("1"); // sera exécuté car il n'y a - // pas de break avant + // pas de break avant } // La console affichera "default" puis "1" ``` @@ -144,17 +144,17 @@ Cette méthode utilise le fait que s'il n'y a pas d'instruction {{jsxref("Instru On peut donc regrouper différentes valeurs les unes à la suite des autres pour exécuter des instructions pour ces valeurs : ```js -var animal = 'girafe'; +var animal = "girafe"; switch (animal) { - case 'vache': - case 'girafe': - case 'chien': - case 'cochon': - console.log('Cet animal est un mammifère'); - break; - case 'oiseau': - default: - console.log('Cet animal n\'est pas un mammifère.'); + case "vache": + case "girafe": + case "chien": + case "cochon": + console.log("Cet animal est un mammifère"); + break; + case "oiseau": + default: + console.log("Cet animal n'est pas un mammifère."); } ``` @@ -164,41 +164,41 @@ Dans l'exemple qui suit, on illustre comment exécuter une série d'instructions ```js var toto = 1; -var output = 'Résultat : '; +var output = "Résultat : "; switch (toto) { - case 0: - output += 'Donc '; - case 1: - output += 'quel '; - output += 'est '; - case 2: - output += 'votre '; - case 3: - output += 'nom '; - case 4: - output += '?'; - console.log(output); - break; - case 5: - output += '!'; - console.log(output); - break; - default: - console.log('Veuillez choisir un nombre entre 0 et 5 !'); + case 0: + output += "Donc "; + case 1: + output += "quel "; + output += "est "; + case 2: + output += "votre "; + case 3: + output += "nom "; + case 4: + output += "?"; + console.log(output); + break; + case 5: + output += "!"; + console.log(output); + break; + default: + console.log("Veuillez choisir un nombre entre 0 et 5 !"); } ``` Selon les valeurs fournies à la variable `toto`, on aura les résultats suivants : -| Valeur | Texte | -| ------------------------------------------------------------------------- | ----------------------------------------- | +| Valeur | Texte | +| ------------------------------------------------------------------ | ----------------------------------------- | | toto vaut {{jsxref("NaN")}} ou est différent de 1, 2, 3, 4, 5 ou 0 | Veuillez choisir un nombre entre 0 et 5 ! | -| 0 | Résultat : Donc quel est votre nom ? | -| 1 | Résultat : quel est votre nom ? | -| 2 | Résultat : votre nom ? | -| 3 | Résultat : nom ? | -| 4 | Résultat : ? | -| 5 | Résultat : ! | +| 0 | Résultat : Donc quel est votre nom ? | +| 1 | Résultat : quel est votre nom ? | +| 2 | Résultat : votre nom ? | +| 3 | Résultat : nom ? | +| 4 | Résultat : ? | +| 5 | Résultat : ! | ### `switch` et les variables avec une portée de bloc @@ -207,18 +207,18 @@ Avec ECMAScript 2015 (ES6), on peut utiliser les instructions [`let`](/fr/docs/W Prenons cet exemple : ```js -const action = 'dire_bonjour'; +const action = "dire_bonjour"; switch (action) { - case 'dire_bonjour': - let message = 'bonjour'; + case "dire_bonjour": + let message = "bonjour"; console.log(message); break; - case 'dire_coucou': - let message = 'coucou'; + case "dire_coucou": + let message = "coucou"; console.log(message); break; default: - console.log('Aucune action reçue.'); + console.log("Aucune action reçue."); break; } ``` @@ -230,20 +230,23 @@ Cela se produit car la première instruction `let message = 'bonjour';` entre en Pour régler ce problème, il suffit de rajouter des accolades pour définir un bloc d'instructions pour chaque `case` : ```js -const action = 'dire_bonjour'; +const action = "dire_bonjour"; switch (action) { - case 'dire_bonjour': { // accolade ajoutée - let message = 'bonjour'; + case "dire_bonjour": { + // accolade ajoutée + let message = "bonjour"; console.log(message); break; } // accolade ajoutée - case 'dire_coucou': { // accolade ajoutée - let message = 'coucou'; + case "dire_coucou": { + // accolade ajoutée + let message = "coucou"; console.log(message); break; } // accolade ajoutée - default: { // accolade ajoutée - console.log('Aucune action reçue.'); + default: { + // accolade ajoutée + console.log("Aucune action reçue."); break; } // accolade ajoutée } diff --git a/files/fr/web/javascript/reference/statements/throw/index.md b/files/fr/web/javascript/reference/statements/throw/index.md index 077a9a2ba3864a..0642a9d7f32f0d 100644 --- a/files/fr/web/javascript/reference/statements/throw/index.md +++ b/files/fr/web/javascript/reference/statements/throw/index.md @@ -25,9 +25,9 @@ L'instruction `throw` permet de lever (_throw_ en anglais) une exception. Lorsqu ```js throw "monErreur"; // génère une exception étant une chaîne de caractères -throw 42; // génère une exception ayant la valeur 42 -throw true; // génère une exception ayant la valeur true -throw new Error("Obligatoire"); // génère un objet Error avec le message "Obligatoire" +throw 42; // génère une exception ayant la valeur 42 +throw true; // génère une exception ayant la valeur true +throw new Error("Obligatoire"); // génère un objet Error avec le message "Obligatoire" ``` On notera également que l'instruction `throw` est affectée par {{jsxref("Grammaire_lexicale","l'insertion automatique de point-virgule","#Insertion_automatique_de_points-virgules",1)}} car il n'est pas permis d'avoir un caractère de fin de ligne entre le mot-clé `throw` et l'expression. @@ -40,28 +40,40 @@ Il est possible de lever une exception qui est un objet et de faire référence ```js function ExceptionUtilisateur(message) { - this.message = message; - this.name = "ExceptionUtilisateur"; + this.message = message; + this.name = "ExceptionUtilisateur"; } function getNomMois(mo) { - mo = mo-1; // Adjust month number for array index (1=Jan, 12=Dec) - var mois = ["Jan", "Fév", "Mar", "Avr", "Mai", "Juin", "Juil", - "Août", "Sept", "Oct", "Nov", "Déc"]; - if (mois[mo] !== undefined) { - return mois[mo]; - } else { - throw new ExceptionUtilisateur("Numéro de mois invalide"); - } + mo = mo - 1; // Adjust month number for array index (1=Jan, 12=Dec) + var mois = [ + "Jan", + "Fév", + "Mar", + "Avr", + "Mai", + "Juin", + "Juil", + "Août", + "Sept", + "Oct", + "Nov", + "Déc", + ]; + if (mois[mo] !== undefined) { + return mois[mo]; + } else { + throw new ExceptionUtilisateur("Numéro de mois invalide"); + } } try { - // les instructions à tenter - var monMois = 15; // 15 est en dehors des limites prévues - var nomMois = getNomMois(monMois); + // les instructions à tenter + var monMois = 15; // 15 est en dehors des limites prévues + var nomMois = getNomMois(monMois); } catch (e) { - nomMois = "unknown"; - console.error(e.message, e.name); // on passe les caractéristiques de l'exception - // à un gestionnaire d'erreur + nomMois = "unknown"; + console.error(e.message, e.name); // on passe les caractéristiques de l'exception + // à un gestionnaire d'erreur } ``` @@ -84,29 +96,29 @@ Ici, on cherche à valider une chaîne de caractères représentant un code post */ function ZipCode(zip) { - zip = new String(zip); - pattern = /[0-9]{5}([- ]?[0-9]{4})?/; - if (pattern.test(zip)) { - // la valeur du code sera la première correspondance - // dans la chaîne - this.value = zip.match(pattern)[0]; - this.valueOf = function() { - return this.value - }; - this.toString = function() { - return String(this.value) - }; - } else { - throw new ZipFormatIncorrectException(zip); - } + zip = new String(zip); + pattern = /[0-9]{5}([- ]?[0-9]{4})?/; + if (pattern.test(zip)) { + // la valeur du code sera la première correspondance + // dans la chaîne + this.value = zip.match(pattern)[0]; + this.valueOf = function () { + return this.value; + }; + this.toString = function () { + return String(this.value); + }; + } else { + throw new ZipFormatIncorrectException(zip); + } } function ZipFormatIncorrectException(value) { - this.value = value; - this.message = "le format n'est pas conforme"; - this.toString = function() { - return this.value + this.message; - }; + this.value = value; + this.message = "le format n'est pas conforme"; + this.toString = function () { + return this.value + this.message; + }; } /* @@ -118,23 +130,23 @@ const ZIPCODE_INVALID = -1; const ZIPCODE_UNKNOWN_ERROR = -2; function vérifierZipCode(z) { - try { - z = new ZipCode(z); - } catch (e) { - if (e instanceof ZipFormatIncorrectException) { - return ZIPCODE_INVALID; - } else { - return ZIPCODE_UNKNOWN_ERROR; - } - } - return z; + try { + z = new ZipCode(z); + } catch (e) { + if (e instanceof ZipFormatIncorrectException) { + return ZIPCODE_INVALID; + } else { + return ZIPCODE_UNKNOWN_ERROR; + } + } + return z; } -a = vérifierZipCode(95060); // renvoie 95060 -b = vérifierZipCode(9560); // renvoie -1 -c = vérifierZipCode("a"); // renvoie -1 -d = vérifierZipCode("95060"); // renvoie 95060 -e = vérifierZipCode("95060 1234"); // renvoie 95060 1234 +a = vérifierZipCode(95060); // renvoie 95060 +b = vérifierZipCode(9560); // renvoie -1 +c = vérifierZipCode("a"); // renvoie -1 +d = vérifierZipCode("95060"); // renvoie 95060 +e = vérifierZipCode("95060 1234"); // renvoie 95060 1234 ``` ### Propager une exception @@ -143,14 +155,14 @@ L'instruction `throw` peut être utilisée pour transmettre une exception qui au ```js try { - throw n; // lève une exception avec une valeur numérique + throw n; // lève une exception avec une valeur numérique } catch (e) { - if (e <= 50) { - // des instructions pour gérer les cas entre 1 et 50 - } else { - // ce cas ne peut pas être géré maintenant, on transmet l'exception - throw e; - } + if (e <= 50) { + // des instructions pour gérer les cas entre 1 et 50 + } else { + // ce cas ne peut pas être géré maintenant, on transmet l'exception + throw e; + } } ``` diff --git a/files/fr/web/javascript/reference/statements/try...catch/index.md b/files/fr/web/javascript/reference/statements/try...catch/index.md index 24973df9bf3773..d4495773013ff6 100644 --- a/files/fr/web/javascript/reference/statements/try...catch/index.md +++ b/files/fr/web/javascript/reference/statements/try...catch/index.md @@ -61,13 +61,12 @@ Lorsqu'une seule clause `catch` inconditionnelle est utilisée, le bloc `catch` ```js try { - throw "monException"; // génère une exception -} -catch (e) { - // les instructions utilisées pour gérer les - // exceptions - logErreurs(e); // on transfère l'objet de l'exception à une méthode - // gestionnaire + throw "monException"; // génère une exception +} catch (e) { + // les instructions utilisées pour gérer les + // exceptions + logErreurs(e); // on transfère l'objet de l'exception à une méthode + // gestionnaire } ``` @@ -99,17 +98,17 @@ Dans le fragment de code qui suit, on aura le même fonctionnement mais en utili ```js try { - maRoutine(); // may throw three types of exceptions + maRoutine(); // may throw three types of exceptions } catch (e) { - if (e instanceof TypeError) { - // les instructions pour gérer TypeError - } else if (e instanceof RangeError) { - // les instructions pour gérer RangeError - } else if (e instanceof EvalError) { - // les instructions pour gérer EvalError - } else { - // les instructions pour gérer les autres exceptions - } + if (e instanceof TypeError) { + // les instructions pour gérer TypeError + } else if (e instanceof RangeError) { + // les instructions pour gérer RangeError + } else if (e instanceof EvalError) { + // les instructions pour gérer EvalError + } else { + // les instructions pour gérer les autres exceptions + } } ``` @@ -118,7 +117,7 @@ try { Lorsqu'une exception est levée dans le bloc `try`, `exception_var` (par exemple le `e` dans « `catch (e)` ») contient la valeur définie par l'instruction {{jsxref("Instructions/throw","throw")}}. Cet identifiant peut être utilisé pour accéder aux propriétés de l'objet et ainsi obtenir des informations sur l'exception qui a eu lieu. Cet identifiant est local à la clause `catch`, il est créé lorsqu'on rentre dans la clause `catch` et n'est plus disponible une fois que la clause a fini son exécution. ```js -function isValidJSON(txt){ +function isValidJSON(txt) { try { JSON.parse(txt); return true; @@ -137,13 +136,12 @@ Cela peut paraître étrange qu'un bloc de code qui s'exécute même lorsqu'il y La clause `finally` peut être utilisée afin d'exécuter les actions nécessaires pour que le script « échoue correctement » en cas d'erreur. On peut par exemple tirer parti de `finally` pour fermer un flux, libérer une ressource, etc. Dans l'exemple suivant, exécuté côté serveur, le script accède à un fichier. Si une exception se produit lorsque le fichier est ouvert, la clause `finally` permet de fermer le fichier avant que le script échoue. Le code contenu dans le bloc `finally` sera exécuté même si on a une instruction `return` dans la section `try` ou dans la section `catch`. ```js -ouvrirMonFichier() +ouvrirMonFichier(); try { - // on utilise une ressource - écrireDansMonFichier(mesDonnées); -} -finally { - fermerMonFichier(); // on ferme toujours la ressource + // on utilise une ressource + écrireDansMonFichier(mesDonnées); +} finally { + fermerMonFichier(); // on ferme toujours la ressource } ``` @@ -157,12 +155,10 @@ Tout d'abord, on utilise ce fragment de code, qui produit le résultat suivant : try { try { throw new Error("oups"); - } - finally { + } finally { console.log("finally"); } -} -catch (ex) { +} catch (ex) { console.error("externe", ex.message); } @@ -177,15 +173,12 @@ Et maintenant, si on a déjà intercepté l'exception avec une clause `catch` da try { try { throw new Error("oups"); - } - catch (ex) { + } catch (ex) { console.error("interne", ex.message); - } - finally { + } finally { console.log("finally"); } -} -catch (ex) { +} catch (ex) { console.error("externe", ex.message); } @@ -200,16 +193,13 @@ Ensuite, si on propage l'erreur à nouveau : try { try { throw new Error("oups"); - } - catch (ex) { + } catch (ex) { console.error("interne", ex.message); throw ex; - } - finally { + } finally { console.log("finally"); } -} -catch (ex) { +} catch (ex) { console.error("externe", ex.message); } @@ -229,17 +219,14 @@ Lorsque le bloc `finally` renvoie une valeur, c'est cette valeur qui devient la try { try { throw new Error("oups"); - } - catch (ex) { + } catch (ex) { console.error("interne", ex.message); throw ex; - } - finally { + } finally { console.log("finally"); return; } -} -catch (ex) { +} catch (ex) { console.error("externe", ex.message); } diff --git a/files/fr/web/javascript/reference/statements/var/index.md b/files/fr/web/javascript/reference/statements/var/index.md index d2d718d7901013..c6c501def11892 100644 --- a/files/fr/web/javascript/reference/statements/var/index.md +++ b/files/fr/web/javascript/reference/statements/var/index.md @@ -29,44 +29,44 @@ Si on affecte une valeur à une variable qui n'a pas été déclarée (le mot-cl 1. Les variables déclarées sont contraintes dans le contexte d'exécution dans lequel elles sont déclarées. Les variables non-déclarées sont toujours globales. - ```js - function x() { - y = 1; // Lève une exception ReferenceError en mode strict - var z = 2; - } + ```js + function x() { + y = 1; // Lève une exception ReferenceError en mode strict + var z = 2; + } - x(); + x(); - console.log(y); // Affiche "1" dans la console - console.log(z); // Lève une exception ReferenceError: - // z n'est pas définie en dehors de x - ``` + console.log(y); // Affiche "1" dans la console + console.log(z); // Lève une exception ReferenceError: + // z n'est pas définie en dehors de x + ``` 2. Les variables déclarées sont créées avant que n'importe quel autre code soit exécuté. Les variables non-déclarées n'existent pas tant que leur code n'est pas exécuté. - ```js - console.log(a); // Lève une exception ReferenceError. - console.log('on continue...'); // N'est jamais exécuté - ``` + ```js + console.log(a); // Lève une exception ReferenceError. + console.log("on continue..."); // N'est jamais exécuté + ``` - ```js - var a; - console.log(a); // Affiche "undefined". - console.log('on continue...'); // Affiche "on continue...". - ``` + ```js + var a; + console.log(a); // Affiche "undefined". + console.log("on continue..."); // Affiche "on continue...". + ``` 3. Les variables déclarées sont des propriétés non-configurables de leur contexte d'exécution (la fonction courante ou le contexte global). Les variables non-déclarées sont configurables (ce qui signifie qu'elles peuvent être supprimées). - ```js - var a = 1; - b = 2; + ```js + var a = 1; + b = 2; - delete this.a; // Lève une TypeError en mode strict. Échoue silencieusement sinon. - delete this.b; + delete this.a; // Lève une TypeError en mode strict. Échoue silencieusement sinon. + delete this.b; - console.log(a, b); // Lève une exception ReferenceError. - // La propriété 'b' a été supprimée et n'existe plus. - ``` + console.log(a, b); // Lève une exception ReferenceError. + // La propriété 'b' a été supprimée et n'existe plus. + ``` En raison de ces trois différences, il faut éviter de ne pas déclarer une variable car cela peut provoquer des résultats inattendus. **Il est donc fortement recommandé de toujours déclarer les variables, qu'elles soient dans une fonction ou dans la portée globale.** Le [mode strict](/fr/docs/Web/JavaScript/Reference/Strict_mode), introduit avec ECMAScript 5, lève une exception lorsqu'une variable n'est pas déclarée. @@ -75,7 +75,7 @@ En raison de ces trois différences, il faut éviter de ne pas déclarer une var Les déclarations de variables (et les déclarations en général) sont traitées avant que n'importe quel autre code soit exécuté. Ainsi, déclarer une variable n'importe où dans le code équivaut à la déclarer au début de son contexte d'exécution. Cela signifie qu'une variable peut également apparaître dans le code avant d'avoir été déclarée. Ce comportement est appelé « remontée » (_hoisting_ en anglais) car la déclaration de la variable est « remontée » au début de la fonction courante ou du contexte global. ```js -bla = 2 +bla = 2; var bla; // ... @@ -110,7 +110,8 @@ function faireQuelqueChose() { ### Déclarer et initialiser deux variables ```js -var a = 0, b = 0; +var a = 0, + b = 0; ``` ### Affecter deux variables avec la même chaîne de caractères @@ -121,13 +122,15 @@ var b = a; // est équivalent à : -var a, b = a = "A"; +var a, + b = (a = "A"); ``` Attention à l'ordre : ```js -var x = y, y = 'A'; +var x = y, + y = "A"; console.log(x + y); // undefinedA ``` @@ -138,9 +141,9 @@ Ici, `x` et `y` sont déclarées avant que n'importe quel code soit exécuté, * ```js var x = 0; // Variable dans la portée globale (le fichier) -function f(){ - var x = y = 1; // x est déclaré localement - // ce qui n'est pas le cas de y ! +function f() { + var x = (y = 1); // x est déclaré localement + // ce qui n'est pas le cas de y ! } f(); @@ -156,31 +159,31 @@ console.log(x, y); // 0, 1 Il est possible de faire référence à des variables qui sont des variables globales implicites depuis la portée d'une fonction externe : ```js -var x = 0; // Déclare x comme variable globale du fichier, on lui affecte 0 +var x = 0; // Déclare x comme variable globale du fichier, on lui affecte 0 console.log(typeof z); // "undefined", car z n'existe pas encore function a() { - var y = 2; // Déclare y dans la portée de la fonction a - // Affecte 2 comme valeur à y + var y = 2; // Déclare y dans la portée de la fonction a + // Affecte 2 comme valeur à y - console.log(x, y); // 0 2 + console.log(x, y); // 0 2 function b() { - x = 3; // Affecte 3 à la variable globale x - // Ne crée pas une nouvelle variable globale - y = 4; // Affecte 4 à la variable externe y, - // Ne crée pas une nouvelle variable globale - z = 5; // Crée une nouvelle variable globale - // et lui affecte la valeur 5. - } // (lève une ReferenceError en mode strict.) - - b(); // Crée z en tant que variable globale - console.log(x, y, z); // 3 4 5 + x = 3; // Affecte 3 à la variable globale x + // Ne crée pas une nouvelle variable globale + y = 4; // Affecte 4 à la variable externe y, + // Ne crée pas une nouvelle variable globale + z = 5; // Crée une nouvelle variable globale + // et lui affecte la valeur 5. + } // (lève une ReferenceError en mode strict.) + + b(); // Crée z en tant que variable globale + console.log(x, y, z); // 3 4 5 } -a(); // l'appel à a() entraîne un appel à b() -console.log(x, z); // 3 5 +a(); // l'appel à a() entraîne un appel à b() +console.log(x, z); // 3 5 console.log(typeof y); // "undefined" car y est local à la fonction a ``` diff --git a/files/fr/web/javascript/reference/statements/while/index.md b/files/fr/web/javascript/reference/statements/while/index.md index b795d1f2fd4f97..17c7b7a18d16f8 100644 --- a/files/fr/web/javascript/reference/statements/while/index.md +++ b/files/fr/web/javascript/reference/statements/while/index.md @@ -55,9 +55,9 @@ Dans la fonction qui suit, on incrémente un compteur grâce à une boucle `whil ```js const maFonctionAvecWhile = () => { let i = 0; - while (i< 20){ + while (i < 20) { i++; - }; + } console.log(i); }; ``` @@ -75,7 +75,7 @@ Par exemple, le fragment qui suit causera une boucle infinie : ```js example-bad const seuil = 14; let compteur = 0; -while (compteur = seuil) { +while ((compteur = seuil)) { compteur++; /* Faire quelque chose avec compteur */ } diff --git a/files/fr/web/javascript/reference/statements/with/index.md b/files/fr/web/javascript/reference/statements/with/index.md index abcb568d2a9543..12d862a669666a 100644 --- a/files/fr/web/javascript/reference/statements/with/index.md +++ b/files/fr/web/javascript/reference/statements/with/index.md @@ -14,7 +14,7 @@ L'instruction **`with`** permet d'étendre la portée chaînée d'une instructio ```js with (expression) { - instruction + instruction; } ``` @@ -39,23 +39,22 @@ Dès qu'un nom non-qualifié est utilisé, JavaScript cherche dans la chaîne de - **Inconvénient :** l'instruction `with` peut rendre plus compliquée, que ce soit pour un humain ou un compilateur, la recherche d'un nom non-qualifié le long de la chaîne des portées. Ainsi, avec cet exemple : ```js - function f(x, o) { - with (o) - console.log(x); - } - ``` + function f(x, o) { + with (o) console.log(x); + } + ``` ce n'est que quand `f` est appelée que `x` est trouvé ou non, s'il est trouvé à partir de `o` ou (si o n'a pas de telle propriété) dans l'objet d'activation de `f` où `x` représente le premier argument de la fonction. Si `x` n'est pas défini dans l'objet passé en second argument, il n'y aura pas d'erreur renvoyée, juste des résultats imprévus. - **Inconvénient :** Du code utilisant l'instruction `with` pourrait ne pas être compatible dans le futur, en particulier lorsqu'il est utilisé avec autre chose qu'un objet simple. Par exemple : ```js - function f(toto, values) { - with (toto) { - console.log(values) - } + function f(toto, values) { + with (toto) { + console.log(values); } - ``` + } + ``` Si vous appelez `f([1,2,3], obj)` dans un environnement ECMAScript 5, la référence à `values` à l'intérieur de l'instruction `with` sera liée avec `obj`. Cependant, ECMAScript 2015 (ES6) a introduit une propriété `values` pour {{jsxref("Array.prototype")}} (afin qu'elle soit disponible pour chaque tableau). Dans un environnement ECMAScript 2015, la référence à `values` utilisée à l'intérieur de l'instruction `with` sera résolue avec `[1,2,3].values`. diff --git a/files/fr/web/javascript/reference/strict_mode/index.md b/files/fr/web/javascript/reference/strict_mode/index.md index 197b28bd684f1f..20b7f2dd11d77d 100644 --- a/files/fr/web/javascript/reference/strict_mode/index.md +++ b/files/fr/web/javascript/reference/strict_mode/index.md @@ -43,11 +43,15 @@ De même, pour activer le mode strict pour une fonction, on placera l'instructio ```js function strict() { // Syntaxe en mode strict au niveau de la fonction - 'use strict'; - function nested() { return "Ho que oui, je le suis !"; } + "use strict"; + function nested() { + return "Ho que oui, je le suis !"; + } return "Allô ! Je suis une fonction en mode strict ! " + nested(); } -function notStrict() { return "Je ne suis pas strict."; } +function notStrict() { + return "Je ne suis pas strict."; +} ``` ### Mode strict pour les modules @@ -83,8 +87,8 @@ Deuxièmement, le mode strict fait en sorte que les affectations qui échoueraie "use strict"; // Affectation à une propriété globale en lecture seule -var undefined = 5; // déclenche une exception TypeError -var Infinity = 5; // déclenche une exception TypeError +var undefined = 5; // déclenche une exception TypeError +var Infinity = 5; // déclenche une exception TypeError // Affectation à une propriété en lecture seule var obj1 = {}; @@ -92,11 +96,15 @@ Object.defineProperty(obj1, "x", { value: 42, writable: false }); obj1.x = 9; // lève un TypeError // Affectation à une propriété qui n'a qu'une méthode get -var obj2 = { get x() { return 17; } }; +var obj2 = { + get x() { + return 17; + }, +}; obj2.x = 5; // lève un TypeError // Affectation d'une nouvelle propriété à un objet non-extensible -var gele= {}; +var gele = {}; Object.preventExtensions(gele); gele.nouvelleProp = "ohé"; // lève un TypeError ``` @@ -120,7 +128,8 @@ var o = { p: 1, p: 2 }; // !!! erreur de syntaxe Cinquièmement, le mode strict requiert que les noms de paramètres de fonction soient uniques. En mode non-strict, le dernier argument dupliqué cache les arguments précédents ayant le même nom. Ces arguments précédents demeurent disponibles via `arguments[i]`, ils ne sont donc pas complètement inaccessibles. Pourtant, cette cachette n'a guère de sens et n'est probablement pas souhaitable (cela pourrait cacher une faute de frappe, par exemple). Donc en mode strict, les doublons de noms d'arguments sont une erreur de syntaxe : ```js -function somme(a, a, c) { // !!! erreur de syntaxe +function somme(a, a, c) { + // !!! erreur de syntaxe "use strict"; return a + b + c; // Ce code va planter s'il est exécuté } @@ -136,21 +145,21 @@ Les développeurs novices croient parfois qu'un zéro débutant un nombre n'a pa ```js "use strict"; -var somme = 015 + // !!! erreur de syntaxe - 197 + - 142; +var somme = + 015 + // !!! erreur de syntaxe + 197 + + 142; ``` Septièmement, le mode strict, à partir d'ECMAScript 2015 interdit de définir des propriétés sur des valeurs primitives. Sans mode strict, de telles définitions sont ignorées. En activant le mode strict cela lèvera une exception {{jsxref("TypeError")}}. ```js -(function() { -"use strict"; - -false.true = ""; // TypeError -(14).calvados= "maison"; // TypeError -"une chaîne".de = "caractères"; // TypeError +(function () { + "use strict"; + false.true = ""; // TypeError + (14).calvados = "maison"; // TypeError + "une chaîne".de = "caractères"; // TypeError })(); ``` @@ -163,8 +172,7 @@ Premièrement, le mode strict interdit l'utilisation de `with`. Le problème ave ```js "use strict"; var x = 17; -with (obj) // !!! erreur de syntaxe -{ +with (obj) { // !!! erreur de syntaxe // Si on n'était pas en mode strict, serait-ce var x, // ou serait-ce plutôt obj.x? Il est impossible en général // de le dire sans faire tourner le code, donc @@ -227,12 +235,13 @@ Premièrement, les chaînes `eval` et `arguments` ne peuvent pas être utilisée eval = 17; arguments++; ++eval; -var obj = { set p(arguments) { } }; +var obj = { set p(arguments) {} }; var eval; -try { } catch (arguments) { } -function x(eval) { } -function arguments() { } -var y = function eval() { }; +try { +} catch (arguments) {} +function x(eval) {} +function arguments() {} +var y = function eval() {}; var f = new Function("arguments", "'use strict'; return 17;"); ``` @@ -253,7 +262,9 @@ Troisièmement, `arguments.callee` n'est plus supporté. En temps normal `argume ```js "use strict"; -var f = function() { return arguments.callee; }; +var f = function () { + return arguments.callee; +}; f(); // lève une TypeError ``` @@ -265,7 +276,9 @@ Tout d'abord, la valeur passée en tant que `this` à une fonction n'est pas né ```js "use strict"; -function fun() { return this; } +function fun() { + return this; +} console.log(fun() === undefined); console.log(fun.call(2) === 2); console.log(fun.apply(null) === null); @@ -278,14 +291,12 @@ Cela signifie entre autres qu'il est impossible de faire référence à l'objet Ensuite, en mode strict, il n'est plus possible de remonter la pile d'appels grâce aux extensions communément implémentées. Par exemple, dans du code non strict, lorsqu'une fonction `fun` est en train d'être appelée, `fun.caller` fait référence à la fonction qui a appelé `fun` la dernière et `fun.arguments` correspond à l'objet `arguments` pour cet appel à `fun`. Ces deux extensions posent problème pour la sécurité car elles permettent au code d'accéder à des fonctions privilégiées et à leurs arguments (éventuellement non sécurisés). Si `fun` est passée en mode strict, `fun.caller` et `fun.arguments` seront des propriétés non-supprimables qui lèveront une exception pour chaque tentative d'accès ou de modification : ```js -function restricted() -{ +function restricted() { "use strict"; - restricted.caller; // lève une TypeError + restricted.caller; // lève une TypeError restricted.arguments; // lève une TypeError } -function privilegedInvoker() -{ +function privilegedInvoker() { return restricted(); } privilegedInvoker(); @@ -295,8 +306,7 @@ Enfin, pour une fonction en mode strict, `arguments` ne permet pas d'accéder au ```js "use strict"; -function fun(a, b) -{ +function fun(a, b) { "use strict"; var v = 12; return arguments.caller; // lève une TypeError @@ -311,18 +321,21 @@ Les prochaines versions d'ECMAScript inclueront certainement une nouvelle syntax Premièrement, en mode strict, une liste d'identifiants fait partie des mots-clés réservés. Ces termes sont : `implements`, `interface`, `let`, `package`, `private`, `protected`, `public`, `static`, et `yield`. En mode strict, il est donc impossible de nommer des variables ou des arguments avec ces noms. ```js -function package(protected) { // !!! +function package(protected) { + // !!! "use strict"; var implements; // !!! - interface: // !!! - while (true) { + // !!! + interface: while (true) { break interface; // !!! } - function private() { } // !!! + function private() {} // !!! } -function fun(static) { 'use strict'; } // !!! +function fun(static) { + "use strict"; +} // !!! ``` Deux défauts liés à Mozilla Firefox : tout d'abord si votre code est en JavaScript 1.7 ou supérieur (par exemple pour du code qui concerne le chrome dans les extensions ou lorsqu'on utilise les balises ``, on ne pourra pas utiliser `let`/`yield` comme identifiants. Ensuite, bien qu'ES5 réserve les mots-clés `class`, `enum`, `export`, `extends`, `import`, et `super` pour le mode strict et le mode non strict, les versions antérieures à Firefox 5 ne réservaient ces mots-clés que pour le mode strict. @@ -332,17 +345,18 @@ Deuxièmement, [le mode strict interdit les déclarations de fonctions qui ne so ```js "use strict"; if (true) { - function f() { } // !!! erreur de syntaxe + function f() {} // !!! erreur de syntaxe f(); } for (var i = 0; i < 5; i++) { - function f2() { } // !!! erreur de syntaxe + function f2() {} // !!! erreur de syntaxe f2(); } -function truc() { // OK - function bidule() { } // OK également +function truc() { + // OK + function bidule() {} // OK également } ``` diff --git a/files/fr/web/javascript/reference/template_literals/index.md b/files/fr/web/javascript/reference/template_literals/index.md index c829ab34c6d965..e98d1419c6069d 100644 --- a/files/fr/web/javascript/reference/template_literals/index.md +++ b/files/fr/web/javascript/reference/template_literals/index.md @@ -13,14 +13,10 @@ Les littéraux de gabarits sont des littéraux de chaînes de caractères permet ## Syntaxe ```js -`texte` +`texte``ligne de texte 1 + ligne de texte 2``texte ${expression} texte`; -`ligne de texte 1 - ligne de texte 2` - -`texte ${expression} texte` - -etiquette `texte ${expression} texte` +etiquette`texte ${expression} texte`; ``` ## Description @@ -33,9 +29,9 @@ Pour créer la chaîne finale, la fonction par défaut concatène simplement les let rep = 42; console.log(`La réponse est ${rep}`); // Gabarit simple avec la concaténation par défaut -function concatenationAdHoc(chaines, reponse){ +function concatenationAdHoc(chaines, reponse) { let parite; - if(reponse % 2 === 0){ + if (reponse % 2 === 0) { parite = "paire"; } else { parite = "impaire"; @@ -57,8 +53,7 @@ Pour utiliser des accents graves dans un gabarit, on les échappera avec une bar Tous les caractères de saut de ligne insérés dans la source font partie du gabarit. Avec des chaînes de caractères normales, il aurait fallu utiliser la syntaxe suivante pour obtenir des chaînes multi-lignes : ```js -console.log('ligne de texte 1\n'+ -'ligne de texte 2'); +console.log("ligne de texte 1\n" + "ligne de texte 2"); // "ligne de texte 1 // ligne de texte 2" ``` @@ -79,7 +74,7 @@ Pour intégrer des expressions dans des chaînes de caractères normales, il fal ```js let a = 5; let b = 10; -console.log('Quinze vaut ' + (a + b) + ' et\nnon ' + (2 * a + b) + '.'); +console.log("Quinze vaut " + (a + b) + " et\nnon " + (2 * a + b) + "."); // "Quinze vaut 15 et // non 20." ``` @@ -102,24 +97,28 @@ Parfois, l'imbrication d'un gabarit est la solution la plus simple (et peut-êtr En ES5 : ```js -let classes = 'header' -classes += (isLargeScreen() ? - '' : item.isCollapsed ? - ' icon-expander' : ' icon-collapser'); +let classes = "header"; +classes += isLargeScreen() + ? "" + : item.isCollapsed + ? " icon-expander" + : " icon-collapser"; ``` En ES2015 avec des gabarits et sans imbrication : ```js -const classes = `header ${ isLargeScreen() ? '' : - (item.isCollapsed ? 'icon-expander' : 'icon-collapser') }`; +const classes = `header ${ + isLargeScreen() ? "" : item.isCollapsed ? "icon-expander" : "icon-collapser" +}`; ``` En ES2015 avec des gabarits imbriqués : ```js -const classes = `header ${ isLargeScreen() ? '' : - `icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`; +const classes = `header ${ + isLargeScreen() ? "" : `icon-${item.isCollapsed ? "expander" : "collapser"}` +}`; ``` ### Gabarits étiquetés @@ -127,7 +126,7 @@ const classes = `header ${ isLargeScreen() ? '' : Les _gabarits étiquetés_ (_tagged templates_) sont une forme plus avancée de gabarits. On peut ici utiliser une fonction pour analyser les différents fragments du gabarit. Le premier argument passé à la fonction est l'ensemble de valeurs issues de chaînes de caractères sous la forme d'un tableau. Les arguments ensuite passés à la fonction seront les expressions contenues dans le gabarit. La fonction pourra ainsi créer une chaîne avec une autre forme de concaténation et utiliser une logique spécifique. La fonction utilisée pour le formatage du gabarit peut être nommée comme n'importe quelle autre fonction. ```js -let personne = 'Michou'; +let personne = "Michou"; let age = 28; function monEtiquette(chaines, expPersonne, expAge) { @@ -140,17 +139,17 @@ function monEtiquette(chaines, expPersonne, expAge) { // var chn2 = chaines[2]; let chnAge; - if (expAge > 99){ - chnAge = 'centenaire'; + if (expAge > 99) { + chnAge = "centenaire"; } else { - chnAge = 'jeunot'; + chnAge = "jeunot"; } // On peut tout à fait renvoyer une chaîne construite // avec un gabarit return `${chn0}${expPersonne}${chn1}${chnAge}`; } -let sortie = monEtiquette`ce ${ personne } est un ${ age }`; +let sortie = monEtiquette`ce ${personne} est un ${age}`; console.log(sortie); // ce Michou est un jeunot @@ -173,13 +172,13 @@ etiquette`ligne de texte 1 \n ligne de texte 2`; En outre, la méthode {{jsxref("String.raw()")}} a pour fonction de créer des chaînes de caractères brutes, exactement comme la fonction de gabarit et de concaténation de chaînes par défaut le ferait : ```js -let chn = String.raw`Salut\n${2+3}!`; +let chn = String.raw`Salut\n${2 + 3}!`; // "Salut\n5!" chn.length; // 9 -chn.split('').join(','); +chn.split("").join(","); // "S,a,l,u,t,\,n,5,!" ``` @@ -197,7 +196,7 @@ Quant à ECMAScript 2016, les gabarits étiquetés se conforment aux règles de Cela signifie qu'un gabarit étiqueté comme celui qui suit pose problème du fait que, selon la grammaire ECMAScript, un analyseur recherchera des séquences d'échappement Unicode valides, mais trouvera la syntaxe mal formée : ```js -latex`\unicode` +latex`\unicode`; // Génère, dans les anciennes versions ECMAScript (ES2016 et précédentes) // SyntaxError: malformed Unicode character escape sequence ``` @@ -210,15 +209,15 @@ Toutefois, les séquences d'échappement illégales doivent toujours être repr ```js function latex(chn) { - return { "bidouillee": chn[0], "brute": chn.raw[0] } + return { bidouillee: chn[0], brute: chn.raw[0] }; } -latex`\unicode` +latex`\unicode`; // { bidouillee: undefined, brute: "\\unicode" } ``` -Notez que la restriction sur les séquences d'échappement est uniquement supprimée pour les gabarits _étiquetés_, et non pour les gabarits de libellés *non étiquetés* : +Notez que la restriction sur les séquences d'échappement est uniquement supprimée pour les gabarits _étiquetés_, et non pour les gabarits de libellés _non étiquetés_ : ```js example-bad let mauvaise = `mauvaise séquence d'échappement : \unicode`; diff --git a/files/fr/web/javascript/reference/trailing_commas/index.md b/files/fr/web/javascript/reference/trailing_commas/index.md index e52e9b1fed581e..8610b83a900dfa 100644 --- a/files/fr/web/javascript/reference/trailing_commas/index.md +++ b/files/fr/web/javascript/reference/trailing_commas/index.md @@ -19,11 +19,7 @@ Les virgules finales peuvent être utilisées dans les littéraux de tableau dep JavaScript ignore les virgules finales dans les tableaux : ```js -var arr = [ - 1, - 2, - 3, -]; +var arr = [1, 2, 3]; arr; // [1, 2, 3] arr.length; // 3 @@ -32,7 +28,7 @@ arr.length; // 3 Si plusieurs virgules finales sont utilisées, cela crée un vide dans le tableau. Un tableau avec des vides est parfois qualifié de _parsemé_ (ou _sparse_ en anglais). Lorsqu'on parcourt un tableau avec les méthodes {{jsxref("Array.prototype.forEach()")}} ou {{jsxref("Array.prototype.map()")}}, par exemple, ces vides sont ignorés. ```js -var arr = [1, 2, 3,,,]; +var arr = [1, 2, 3, , ,]; arr.length; // 5 ``` @@ -58,10 +54,10 @@ Pour chacune des deux paires de définitions qui suivent, les deux définitions ```js function f(p) {} -function f(p,) {} +function f(p) {} (p) => {}; -(p,) => {}; +(p) => {}; ``` Les virgules finales peuvent également être utilisées lors [des définitions de méthodes](/fr/docs/Web/JavaScript/Reference/Fonctions/Définition_de_méthode) dans les objets et les classes : @@ -84,10 +80,10 @@ Pour chacune des deux paires d'appels qui suivent, les deux appels sont équival ```js f(p); -f(p,); +f(p); Math.max(10, 20); -Math.max(10, 20,); +Math.max(10, 20); ``` ### Virgules finales non-autorisées @@ -110,7 +106,7 @@ On peut aussi utiliser une virgule finale dans l'opérande gauche lorsqu'on util ```js // Décomposition d'un tableau avec // une virgule finale -[a, b,] = [1, 2]; +[a, b] = [1, 2]; // Décomposition d'un objet avec une // virgule finale @@ -118,13 +114,13 @@ var o = { p: 42, q: true, }; -var {p, q,} = o; +var { p, q } = o; ``` Là encore, si on utilise un élément du reste, une exception {{jsxref("SyntaxError")}} sera levée : ```js example-bad -var [a, ...b,] = [1, 2, 3]; +var [a, ...b] = [1, 2, 3]; // SyntaxError: rest element may not have a trailing comma ``` @@ -135,7 +131,7 @@ L'utilisation des virgules finales dans les objets a été introduite avec ECMAS Les deux lignes suivantes lèveront une exception {{jsxref("SyntaxError")}} : ```js example-bad -JSON.parse('[1, 2, 3, 4, ]'); +JSON.parse("[1, 2, 3, 4, ]"); JSON.parse('{"foo" : 1, }'); // SyntaxError JSON.parse: unexpected character // at line 1 column 14 of the JSON data @@ -144,7 +140,7 @@ JSON.parse('{"foo" : 1, }'); Pour analyser le JSON correctement, on évitera les virgules finales : ```js example-good -JSON.parse('[1, 2, 3, 4 ]'); +JSON.parse("[1, 2, 3, 4 ]"); JSON.parse('{"foo" : 1 }'); ```