javascript对象文字:{a,b,c}到底是什么?

falq053o  于 2021-09-13  发布在  Java
关注(0)|答案(3)|浏览(347)

我的问题最好通过这个JSFIDLE给出,代码如下:

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 );

什么样的数据结构 f ? 这只是一个简写吗 d ?

qpgpyjmq

qpgpyjmq1#

它是es6中的对象初始值设定项属性缩写。

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

这是因为属性值与属性标识符具有相同的名称。这是对最新ecmascript 6第13版草案中对象初始化器语法(第11.1.5节)的新添加。当然,就像ecmascript 3中设置的限制一样,您不能使用保留字作为属性名。
这样的速记不会显著地改变你的代码,它只会让一切变得更甜蜜一点!

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.
}

有关这些符号的支持,请参见兼容性表。在非支持环境中,这些符号将导致语法错误。
这个简写符号提供了非常好的对象匹配:
在ECMAScript 5中,我们过去的工作是:

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

只需一行代码即可在ECMAScript 6中完成:

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

2izufjch2#

var f = {a, b, c};

它与es6(ecmascript 2015)一起提供,其含义与以下内容完全相同:

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

它被称为对象文字属性值速记(或简单的属性值速记,速记属性)。
您还可以将速记与经典初始化相结合:

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

有关详细信息,请参见对象初始值设定项。

3okqufwl

3okqufwl3#

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

它使用新的ecmascript 2015表示法在javascript中定义一个对象:
根据mozilla开发者网络:
可以使用new object()、object.create()或文字符号(初始值设定项符号)初始化对象。对象初始值设定项是对象的零对或多对属性名和关联值的列表,用大括号({})括起来。”

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

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

相当于:

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

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

相关问题