Javascript ES6 — Exploring the New Built-In Methods

Amongst the new features released with the new ES6 standard in Javascript are a bounty of new built-in methods. These new methods aim to simplify and standardize some familiar scenarios that developers encounter when working with JS data types like Numbers, Strings, Object and Arrays.

One of the goals of ES6 was to make coding in JS cleaner and more concise, let’s take a look at how these new methods help move us towards that goal.

In each code snippet below you will see:

//ES6 — this is the new ES6 implementation of the feature

//ES5 — this is the ES5 equivalent(if there is one) of the new ES6 implementation

If you like this post check our last post on JS ES6 Proxies

Introducing Javascript ES6 Proxies

Object Property Assignment

When working with objects you often need to combine 2 or more objects. The new Object.assign() function provides a clean method for doing just that.

Object Merge

Object.assign merge

We start off with 3 Objects on lines 2–4 with the intention of combining them into the destination Object. In ES5 you had to loop through and independently append the values to the destination object. In ES6 you can do this with a single line of code(line 15).

What happens when you merge objects with same properties you ask? Let’s see.

Merge With Same Properties

You can also use Object.assign() to clone Objects.

Object Clone

Object.assign clone

Array Element Finding

Commonly when working with Arrays you will want to find an element OR the index of an element in an Array. ES6 provides 2 new Array methods find() and findIndex() to do this. It is important to note that find() will return the FIRST element in the Array that satisfies the provided testing function. Let’s take a look at these new ES6 functions and their ES5 equivalents(there is no ES5 equivalent for findIndex()).

Line 7 and Line 12 accomplish the same thing, you can see the simplicity in the ES6 implementation on line 12. There is no ES5 equivalent for line 13(findIndex). Line 14 shows the findIndex() function returning the FIRST element to satisfy the test.

String Repeating

ES6 has added a simple new String.repeat() method.

string repeating

String Searching

ES6 has added 3 new methods to aid the developer when searching for segments of text within a String. startsWith(), endsWith() and includes(). This one I love because something about indexOf() has always struck me as inefficient and error prone.

string searching

Number Type Checking

There are several new functions for checking for non-numbers and finite numbers. Number.isNaN() and Number.isFinite()

number type checking

There are several things to note here:

• The differences between the new ES6 Number.isNaN() and the global isNaN() are laid out pretty well here and here.
• Infinity is actually NOT infinity, it a numeric value that represents Infinity. The actual value is 1.797693134862315E+308. The same for _-Infinity, -_1.797693134862315E+308.

Number Sign Determination

ES6 introduces a new function Math.sign() to determine the sign of a number including the special cases of signed zero(-0) and non-number.

number sign determination

So that’s it for Proxies in ES6. Let us know your thoughts and questions and PLEASE follow us on twitter. Keep after it.

If you like this article, please recommend and share to help others find it!