Six Tiny But Awesome ES7/ES8 Features

https://davidwalsh.name/es7-es8-features

String.

prototype.

padStart


// padStart(desiredLength, textToPrepend)

// No text
''.padStart(10, 'Hi') // 'HiHiHiHiHi'

// Some text
'def'.padStart(6, 'abc') // 'abcdef'

// Only use what gets to length
'5678'.padStart(7, '1234') // '1235678'





// padEnd(desiredLength, textToAppend)

'23'.padEnd(8, '0') // '23000000'

String.

prototype.

padEnd

Object.entries












// Object literal
Object.entries({ 'a': 'A', 'b': 'B' }); 
// [["a","A"],["b","B"]]

Object.entries(obj).forEach(([key, value]) => {
  console.log(`${key} ${value}`); 
});  // "a 5", "b 7", "c 9"

_.each(obj, (k,v) => console.log(`${k} `${v}))


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

Object.values









// Object literal
Object.values({ 'a': 23, 'b': 19 }) 
// [23, 19]

// Array-like object (order not preserved)
Object.values({ 80: 'eighty', 0: 1, 1: 'yes' }) 
// [1, 'yes', 'eighty']

// String
Object.values('strategery') 
// [ 's', 't', 'r', 'a', 't', 'e', 'g', 'e', 'r', 'y' ]

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

// getFoo is property which isn't enumerable
var my_obj = Object.create({}, { getFoo: { value: () => this.foo } });
my_obj.foo = 'bar';
console.log(Object.values(my_obj)); // ['bar']

Array.

prototype.

includes







['a', 'b', 'c'].includes('a') 
// returns boolean

['a','b','c'].indexOf('a') ? console.log('yup') : console.log('nope')
nope

['a','b','c'].indexOf('a') !== -1 ? console.log('yup') : console.log('nope')
yup

['a','b','c'].includes('a') ? console.log('yup') : console.log('nope')
yup


['a', 'b', 'c'].includes('d') 
// false

Exponentiation






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

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

Trailing commas

in functions







function es8(
  var1, 
  var2, 
  var3,
) {
  // ...
}

Bonus

ES9 Feature

RegExp

Lookbehind

Assertions

 









// Lookahead assertion
/\d+(?=%)/.exec("100% of US presidents have been male")  
// 100


// Lookbehind assertion
/(?<=\$)\d+/.exec("Benjamin Franklin is on the $100 bill") 
// 100

https://github.com/tc39/proposals

Thanks!

New ES7/ES8 Features

By Ed Atrero

New ES7/ES8 Features

  • 755