The development of new features for the JavaScript kernel has really improved over the last five years, especially thanks to JavaScript frameworks that push the boundaries and prove the # 39 importance of the features. My previous posts ES6, Six tiny but awesome features of the ES6 and Six other tiny but awesome ES6 features have highlighted a dozen excellent features added to JavaScript to make our life easier. they certainly do it. Let's take a look at some of the "little" features that ES7 and ES8 have brought us!

String.prototype.padStart / padEnd

padStart and padEnd allow us to fill a given string with any text of our choice to ensure that a string matches a given length:

// padStart (desiredLength, textToPrepend)

// no text
& # 39; & # 39; .padStart (10, 'Hi') // HiHiHiHiHi & # 39;

// Of text
& # 39; def & # 39; .padStart (6, & # 39; abc & # 39;); & # 39;) abcdef & # 39;

// only use what happens to the length
# 5678 # .padStart (7, & # 39; 1234 & # 39;) & # 39; 1235678 & # 39;

// padEnd (desiredLength, textToAppend)

& # 39; 23 & # 39; .padEnd (8, & # 39; 0) // & # 39; 23000000 & # 39;

A use of padStart could include the addition of a area code to the phone number if the user's input is not the correct length. padEnd can be used for decimal precision.

Object.entries

Object.Entries allows us to obtain the pairs of enumerable properties of an object in array format ([key, value]):

// Object literal
Object.entries ({& gt ;:A, & bg; B & B; // [[“a”,”A”] [“b”,”B”]]

// String
Object.entries ('david') // [[“0″,”d”] [“1″,”a”] [“2″,”v”] [“3″,”i”] [“4″,”d”]]

Object.entries follows the same order as for … in would.

Object.values ​​

Object.keys was extremely helpful to me, so I was excited to see Object.values ​​featured:

// Object literal
Object.values ​​({-A: 23, -b: 19}) // [23, 19]

// Array object (order not retained)
Object.values ​​({80: eight eighty, 0: 1, 1: & yes)} [1, ‘yes’, ‘eighty’]

// String
Object.values ​​(& # 39; davidwalsh & # 39;) // [“d”, “a”, “v”, “i”, “d”, “w”, “a”, “l”, “s”, “h”]

// Array
Object.values ​​([1, 2, 3]) // [1, 2, 3]

Object.values ​​provides value entries in object literals, arrays, strings, and so on.

Array.prototype.includes

Array.prototype.includes is a bit like indexOf but instead returns a true or false value instead of the item's index:

[‘a’, ‘b’, ‘c’] .includes ("a") // true, not 0 as indexOf would give
[‘a’, ‘b’, ‘c’] .includes (& # 39; d & #); & nbsp; false

indexOf has been used over the years to detect the presence of items in the table, but the index `0` can lead to false negatives if it is not correctly coded. I'm glad that JavaScript has added a function that returns exactly what we need: a positive or negative response!

Exponentiation

JavaScript introduced a stenographic method of exponentiation:

// 2 to the power of 8
Math.pow (2, 8) // 256

// ..becomes
2 ** 8 // 256

This new syntax accomplishes the same thing as Math.pow with less code!

followed gossips

I'm old enough to remember days when a floating point would completely explode your JavaScript code in Internet Explorer 6. JavaScript now supports the extra comma:

Leave myObj = {a: "b", "c",} // No error!

Leave myArr = [1, 2, 3, ] // No mistake!

[1, 2, 3,] .length // 3
[1, 2, 3, , , ] .length // 5

The case of the length of the painting is to keep in mind. ESLint has a floating-point rule that you can use to make sure that your comma use is consistent.

Bonus: async / await

Obviously, async and wait, the new method of managing asynchronous tasks, is not a "tiny" addition, but it's certainly awesome! Read my async and await guide to turn your callback hell into a more elegant and descendant approach to asynchronous code!

With each iteration of JavaScript, we solve problems we had with the lack of functionality or the bastardized use of other functions. What is your recent addition to JavaScript?

LEAVE A REPLY

Please enter your comment!
Please enter your name here