Use shorthand property syntax for object literals JS-0240
Anti-pattern
Minor
5 months ago
—
6 months old
Expected method shorthand
4250 },
4251 {
4252 key: "Default",
4253 get: function () {4254 return ve;4255 },4256 },
4257 ]),
4258 tExpected method shorthand
4244 },
4245 {
4246 key: "DefaultType",
4247 get: function () {4248 return ge;4249 },4250 },
4251 {
4252 key: "Default",Expected method shorthand
4238 r(t, null, [
4239 {
4240 key: "VERSION",
4241 get: function () {4242 return "4.6.0";4243 },4244 },
4245 {
4246 key: "DefaultType",Expected method shorthand
4101 r(t, null, [
4102 {
4103 key: "VERSION",
4104 get: function () {4105 return "4.6.0";4106 },4107 },
4108 ]),
4109 tExpected method shorthand
3963 },
3964 {
3965 key: "Default",
3966 get: function () {3967 return fe;3968 },3969 },
3970 ]),
3971 t
Description
ECMAScript 6 provides a concise form for defining object literal methods and properties. This syntax can make defining complex object literals much cleaner.
Here are a few common examples using the ES5 syntax:
const x = 1, y = 2, z = 3;
// properties
const foo = {
x: x,
y: y,
z: z,
};
// methods
const foo = {
a: function() {},
b: function() {}
};
The ES6 equivalent syntax is::
// properties
const foo = {x, y, z};
// methods
const bar = {
a() { return 1 },
b() { return 2 }
};
NOTE: The shorthand properties are equivalent to function expressions.
Meaning that they do not bind their own this inside their bodies.
It is still possible to access properties from the object inside a shorthand member function:
const object = {
x: 1,
getX() {
return this.x // valid
}
}
Bad Practice
const foo = {
bar: function () { return 1 }
};
Recommended
const foo = {
bar() { return 1 }
}