javascript - property - object.keys map

Literal de objeto Javascript: ¿qué es exactamente{a, b, c}?

Question

La pregunta que tengo es mejor dada a través de este jsfiddle , cuyo código está a continuación:

var a = 1, b = ''x'', c = true;

var d = {a: a, b: b, c: c}; // <--- object literal
var e = [a, b, c];          // <--- array
var f = {a, b, c};          // <--- what exactly is this??

// these all give the same output:
alert(d.a  + '', '' + d.b +  '', '' + d.c );
alert(e[0] + '', '' + e[1] + '', '' + e[2]);
alert(f.a  + '', '' + f.b +  '', '' + f.c );

¿Qué tipo de estructura de datos es f ? ¿Es solo una abreviatura de d ?

Answer 1

Es una abreviatura de propiedad de inicializador de objeto en ES6.

var f = {a, b, c, d:1}; // Will be equal to {a:a, b:b, c:c, d:1}

Esto funciona porque el valor de la propiedad tiene el mismo nombre que el identificador de la propiedad. Esta es una nueva adición a la sintaxis de Object Initialiser ( sección 11.1.5 ) en el último borrador de ECMAScript 6 Rev 13 . Y, por supuesto, al igual que las limitaciones establecidas en ECMAScript 3, no puede usar una palabra reservada como nombre de su propiedad.

Tal taquigrafía no cambiará drásticamente su código, ¡solo hace que todo sea un poco más dulce!

function createCar(name, brand, speed) {
  return { type: ''Car'', name: name, brand: brand, speed: speed };
}

// With the new shorthand form
function createSweetCar(name, brand, speed) {
  return { type: ''Car'', name, brand, speed }; // Yes it looks sweet.
}

Consulte la tabla de compatibilidad para obtener soporte para estas anotaciones. En entornos no compatibles, estas anotaciones conducirán a errores de sintaxis.

Esta notación abreviada ofrece la coincidencia de objetos bastante bien:

En ECMAScript5 lo que solíamos hacer:

var tmp = getDate();
var op  = tmp.op;
var lhs = tmp.lhs;
var rhs = tmp.rhs;

Se puede hacer en ECMAScript6 con una sola línea de código:

var { op, lhs, rhs } = getData();

Answer 2

var f = {a, b, c};

Vino con ES6 (ECMAScript 2015) y significa exactamente lo mismo que:

var f = {a: a, b: b, c: c};

Se llama Object Literal Property Value Shorthands (o simplemente propiedades de valor abreviado, propiedades abreviadas).

También puedes combinar shorthands con inicialización clásica:

var f = {a: 1, b, c};

Para más información vea Object initializer .

Answer 3

var f = {a, b, c};          // <--- what exactly is this??

Define un objeto en JavaScript utilizando la nueva notación ECMAScript 2015:

Según la red de desarrolladores de Mozilla :

"Los objetos pueden inicializarse usando un nuevo Object (), Object.create (), o usando la notación literal (notación de inicializador). Un inicializador de objeto es una lista de cero o más pares de nombres de propiedades y valores asociados de un objeto, encerrados en llaves ({}) ".

var a = "foo", 
    b = 42, 
    c = {};

// Shorthand property names (ES6)
var o = { a, b, c }; 

es equivalente a:

var a = "foo", 
    b = 42,
    c = {};

var o = { 
  a: a,
  b: b,
  c: c
};