web-dev-qa-db-fra.com

Que font les accolades dans les instructions `var {...} = ...`?

Je ne sais pas s'il s'agit d'une syntaxe JS spécifique à Mozilla, mais j'ai souvent trouvé des variables déclarées de cette façon, par exemple, dans documentation du SDK du module complémentaire :

var { Hotkey } = require("sdk/hotkeys");

et dans divers chrome Javascript (let instruction est utilisée à la place de var),

let { classes: Cc, interfaces: Ci, results: Cr, utils: Cu }  = Components;

Je l'ai trouvé très déroutant mais je ne trouve aucune documentation sur les deux syntaxes, même sur MDN .

javascriptecmascript-6destructuringjavascript-1.7
103
timdream

Ce sont deux fonctionnalités JavaScript 1.7. Le premier est variables de niveau bloc :

let vous permet de déclarer des variables, en limitant sa portée au bloc, à l'instruction ou à l'expression sur laquelle elles sont utilisées. Ceci est différent du mot clé var, qui définit une variable globalement ou localement à une fonction entière quelle que soit la portée du bloc.

Le second s'appelle ( déstructurant :

L'affectation de déstructuration permet d'extraire des données de tableaux ou d'objets à l'aide d'une syntaxe qui reflète la construction de tableaux et d'objets littéraux.
...
. .

Pour ceux qui connaissent Python, c'est similaire à cette syntaxe:

>>> a, (b, c) = (1, (2, 3))
>>> a, b, c
(1, 2, 3)

Le premier bloc de code est un raccourci pour:

var {Hotkey: Hotkey} = require("sdk/hotkeys");
// Or
var Hotkey = require("sdk/hotkeys").Hotkey;

Vous pouvez réécrire le deuxième bloc de code comme suit:

let Cc = Components.classes;
let Ci = Components.interfaces;
let Cr = Components.results;
let Cu = Components.utils;
64
Blender

Ce que vous regardez est une mission de déstructuration. C'est une forme de correspondance de motifs comme dans Haskell.

En utilisant l'affectation de déstructuration, vous pouvez extraire des valeurs d'objets et de tableaux et les affecter à des variables nouvellement déclarées à l'aide de la syntaxe littérale d'objet et de tableau. Cela rend le code beaucoup plus succinct.

Par exemple:

var ascii = {
    a: 97,
    b: 98,
    c: 99
};

var {a, b, c} = ascii;

Le code ci-dessus est équivalent à:

var ascii = {
    a: 97,
    b: 98,
    c: 99
};

var a = ascii.a;
var b = ascii.b;
var c = ascii.c;

De même pour les tableaux:

var ascii = [97, 98, 99];

var [a, b, c] = ascii;

Cela équivaut à:

var ascii = [97, 98, 99];

var a = ascii[0];
var b = ascii[1];
var c = ascii[2];

Vous pouvez également extraire et renommer une propriété d'objet comme suit:

var ascii = {
    a: 97,
    b: 98,
    c: 99
};

var {a: A, b: B, c: C} = ascii;

Cela équivaut à:

var ascii = {
    a: 97,
    b: 98,
    c: 99
};

var A = ascii.a;
var B = ascii.b;
var C = ascii.c;

C'est tout ce qu'on peut en dire.

71
Aadit M Shah

Il s'agit d'une affectation destructrice en Javascript et fait partie de la norme ES2015. Il décompresse ou extrait les valeurs des tableaux ou des propriétés des objets dans des variables distinctes. Par exemple: Array Destructuring

var foo = ["one", "two", "three"];
//without destructuring
var one = foo[0];
var two = foo[1];
var three = foo[2];

// avec déstructuration var [un, deux, trois] = foo

Par exemple: Destruction d'objets

var o = {p: 42, q: vrai}; var {p, q} = o;

console.log (p); // 42 console.log (q); // vrai

// Attribue de nouveaux noms de variables var {p: foo, q: bar} = o;

console.log (foo); // 42 console.log (bar); // vrai

1
Deeksha Sharma

Il existe de la documentation pour l'instruction let sur MDN: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/let

let est similaire à var en ce qu'il limite la portée de la variable déclarée. Il vous permet de déclarer une variable à l'intérieur d'un bloc if(){} (ou d'un autre bloc) et d'avoir cette variable uniquement "visible" à l'intérieur de ce bloc (JavaScript, jusqu'à présent, a une portée de fonction et non une portée de bloc comme la plupart des autres) langues). Ainsi, le let est fondamentalement un "correctif" pour quelque chose avec lequel beaucoup de gens ont des problèmes. Notez que tihs est une fonctionnalité JavaScript 1.7.

Je n'ai rien trouvé sur {Foo}.

0
Jan Hančič