The rest and spread operator in ES6

ES6 comes with a new operator that consists of three dots: … It is strongly related to arrays. It has two major purposes:

• It allows a function to have an arbitrary number of parameters of a certain type. This is the same as a parameters array in a C# or a Java function with varargs
• Join arrays in an elegant way

Let’s see how the … operator works.

Read more of this post

Enhanced string concatenation/interpolation in ES6

ES6 comes with a new syntactic feature that makes concatenating strings easier. Here’s an example of creating an object with a function with traditional string concatenation in JavaScript:

Read more of this post

Using the forEach array helper in ES6

ES6 comes with a number of helper methods that can be applied to arrays. One of these is called forEach which applies a function on each member of an array. If you’re familiar with C# and LINQ then the forEach array helper is very similar to the ForEach LINQ extension method.

Let’s see an example.

Read more of this post

Fat arrow functions in ES6

ES6 comes with a syntactic enhancement of declaring functions using the => operator. It’s commonly called the fat arrow operator. In fact it’s not only syntactic sugar that saves us a number of characters. Instead, it helps us avoid the “TypeError: Cannot read property ‘propertyName’ of undefined” error.

Here’s a traditional JavaScript function:

Read more of this post

Using the some array helper in ES6

ES6 comes with a number of helper methods that can be applied to arrays. One of these is called some which returns true if at least one element in an array fulfils the specified condition and false otherwise. If you’re familiar with C# and LINQ then the some function is very similar to the Any LINQ extension method.

Let’s see an example.

Read more of this post

Using the reduce array helper in ES6

ES6 comes with a number of helper methods that can be applied to arrays. One of these is called reduce which can be used in aggregation scenarios where we in each loop need to use the result of the previous loop. Reduce is certainly a bit more difficult to grasp and use than the other array helpers introduced in ES6. If you’re familiar with C# and LINQ then the reduce array helper is similar to the Aggregate LINQ extension method.

Let’s see an example.

Read more of this post

Destructuring in ES6

Destructuring in ES6 is about pulling out certain properties from objects into other variables. It can also be used to extract values from arrays into variables.

Here’s an example object:

let customer = {
  name: 'Great Customer Inc',
  address: 'Los Angeles'
}

Here’s how we can pull out the name and address properties from the customer with destructuring:

Read more of this post

Using the every array helper in ES6

ES6 comes with a number of helper methods that can be applied to arrays. One of these is called every which returns true if all elements in an array fulfil the specified condition and false otherwise. If you’re familiar with C# and LINQ then the every function is very similar to the All LINQ extension method.

Let’s see an example.

Read more of this post

Using the find array helper in ES6

ES6 comes with a number of helper methods that can be applied to arrays. One of these is called find which finds the first matching element in an array based on a condition. If you’re familiar with C# and LINQ then the find function is very similar to the Where/Select and FirstOrDefault LINQ extension methods.

Let’s see an example.

Read more of this post

Enhanced object literals in ES6

ES6 comes with a couple of syntactic enhancements regarding object literals. These enhancements do not add new functionality to JavaScript. Instead, they are syntactic sugar that make it possible to write a little less code.

Here’s a simple example of a “normal” JSON object returned without these enhancements:

Read more of this post