A recurring trend in ES6 is to remove unnecessary repetition in your code. By removing unnecessary repetition, your code becomes easier to read and more concise. This trend continues with the introduction of new _shorthand _ways for initializing objects and adding methods to objects.

Let’s see what those look like.

Object literal shorthand

You’ve probably written code where an object is being initialized using the same property names as the variable names being assigned to them.

But just in case you haven’t, here’s an example.

let type = 'quartz';
let color = 'rose';
let carat = 21.29;

const gemstone = {
  type: type,
  color: color,
  carat: carat
};

console.log(gemstone);

Prints:Object {type: "quartz", color: "rose", carat: 21.29}

Do you see the repetition? Doesn'ttype: type,color: color, andcarat:caratseem redundant?

The good news is that you can remove those duplicate variables names from object properties_if_the properties have the same name as the variables being assigned to them.

Check it out!

const gemstone = { type, color, carat };

If object properties have the same name as the variables being assigned to them, then you can drop the duplicate variable names.

Speaking of shorthand, there’s also a shorthand way to add methods to objects.

To see how that looks, let’s start by adding acalculateWorth()method to ourgemstoneobject. ThecalculateWorth()method will tell us how much our gemstone costs based on itstype,color, andcarat.

let type = 'quartz';
let color = 'rose';
let carat = 21.29;

const gemstone = {
  type,
  color,
  carat,
  calculateWorth: function() {
    // will calculate worth of gemstone based on type, color, and carat
  }
};

In this example, an anonymous function is being assigned to the propertycalculateWorth, but is the function keyword _really _needed? In ES6, it’s not!

Shorthand method names

Since you only need to reference the gemstone’scalculateWorthproperty in order to call the function, having the function keyword is redundant, so it can be dropped.

let gemstone = {
  type,
  color,
  carat,
  calculateWorth() { ... }
};

results matching ""

    No results matching ""