[JavaScript] ES8 (1) - Object.values, Object.entries, padStart, padEnd

 

ES8 문법을 소개하기 앞서,

ES7 문법도 간략하게 짚고 넘어가기.

 

ES7

.includes()

const dragons = ['Tim', 'Johnathan', 'Sandy', 'Sarah'];

dragons.includes('John') // false
dragons.filter(name => name.includes('John')) // ['Johnathan']

 

거듭제곱 연산자 (Exponential Operator)

const square1 = (x) => Math.pow(x, 2);	// ES6
const square2 = (x) => x ** 2;	// ES7

square2(2);	// 4

 

 

ES8

.padStart() & .padEnd()

String 의 앞/뒤에 ()자릿수만큼 공백 넣기

const startLine = '     ||<- Start line';
let turtle = '🐢';
let rabbit = '🐇';

turtle = turtle.padStart(8);
rabbit = rabbit.padStart(8);

'     ||<- Start line'
'       🐢'
'       🐇'

turtle = turtle.trim().padEnd(9, '=');

'     ||<- Start line'
'🐢======='
'       🐇'

 

 

 

Object.values()

Object.entries()

 

기존에는 Object.key() 만 있었음.

ES8 에 객체의 값만 꺼내오거나 키-값 을 쌍으로 꺼낼 수 있는 메서드가 생김.

 

const scores = { math: 90, english: 85, science: 95 };

// 270
const totalScore = Object.values(scores).reduce((acc, val) => acc + val, 0);

 

let obj = {
  my: 'name',
  is: 'Rudolf',
  the: 'raindeer'
}

// 'my name is Rudolf the raindeer'
const result = Object.entries(obj).map(value => value.join(" ")).join(' ')