Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Ecma 1
  • Overview
  • Transcript

3.4 Object Literal Extensions

We've got several new language features that we can make use of when creating object literals, including syntax for defining properties and methods, dynamic keys and the new assign method.

3.4 Object Literal Extensions

Hi folks, in this lesson we're going to take a look some new things we can do when defining object literals. One new feature in year six is shorter syntax for defining object properties. Instead of specifically setting properties and values, we can simply supply the value and the key will be created automatically. Let's take a quick look. So, let's say we have a couple of variables. Later, we might want to create a new object literal which contains these values. Instead of, explicitly, stating both the keys and the values, we can just now supply the values It's not a groundbreaking change, it's just a little syntactic sugar that helps us to avoid a little pointless repetition. Another simple and sweet edition is how we can define methods on object literals. Instead of explicitly having to define a function as the value of a proxy, in Year Six, we can now just define a method with a simple name, and parentheses and brackets. We don't have to use the function keyword at all. And we don't have to assign the function to a property. We can now also have computed property names in object literals. We use square bracket notation to signify that the property name should be an expression. In this case, we can just use the variables that we defined earlier. Before we finish up for the day, let's just take a quick look at a new static method we can use from the built-in object type. This is the assigned method and we can use it to assign the properties of one or more objects to another object. Again, this is provided largely as a syntactic convenience to avoid having to copy object properties using loops. Instead of having to iterate through the properties of one object and copy them manually to another object, optionally doing the same for any properties that happen to be objects, we can just use the assign method. The first argument is the target object where the new properties will be added. The remaining arguments are the source objects that the properties are copied from. In this case we get an object that contains all of the properties from all of the previous examples. If the target object already contains a property that one of the source objects contains, it will be overwritten with the property from the source objects. If more than one source object defines the same property, the last one in the parameter list for the assigned method would be the resulting value. So in this lesson we looked at mostly syntactic improvements to object literals in ES6, including the new shorthand for assignments, the new shorthand method properties and computed properties. We finished up by taking a look at the new assign method, which can be used to copy the properties from one or more objects to a target object. Thanks for watching.

Back to the top