DEV Community

Cover image for ECMAScript 6 ⚡ Shorthand Properties & Method Names
Marcos Mendes
Marcos Mendes

Posted on • Edited on

7

ECMAScript 6 ⚡ Shorthand Properties & Method Names

Hey guys, how are you? This is going to be a short post and very straight to the point.

ES6 introduced a new concept/feature called “Property shorthand”, let's see an example of this feature below:

Let's imagine that we need to create an object to store information about a user, such as first name, last name and age:

Previously in ES5 we would do it as follows, we would create the object passing the property and value.

If you noticed, this way there is a lot of repetition, imagine if we needed to create a "Person" object with more information about our user, we would have a lot more repetitions.

So that's when the shorthand property comes into action, the shorthand allows us to do the following: If the property and the variable have the same name, we just have to create the object as follows =>

This way he will understand that first we will pass the property which is "firstName", then he will pass the value, and so on.
That way, we write a lot less code.

Another really cool thing is the way we create functions inside an object using the shorthand, let's create a function to return our user's full name.

Old form:

How to use in ES6:

With the shorthand I no longer need to put the "function" the "getFullName" is enough.

This makes it much easier to read and we write much less.

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

Top comments (0)

SurveyJS custom survey software

JavaScript Form Builder UI Component

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay