S10. es2015

1 분 소요

ES2015 (let, const, rest parameter, spread operator, default parameter, Template literals, Arrow Functions)

  • let
//변수선언이지만 스코프는 중괄호 (var는 함수단위 스코프)
if(true) {
  let d = 2;
}
console.log(d) // d is not defined

//for문일 경우에도 스코프는 중괄호
for (let i = 0; i < 10; i++) {
  console.log(i); //0~9
}
console.log(i); // i is not defined
  • const
//const는 재할당이 안되는 변수 선언 (const도 스코프는 중괄호), 재할당외엔 다 된다.
const bar = 3;
bar = 4; // Assignment to constant variable

//재할당이 안될 뿐 length변경, 배열에 원소 추가 등은 가능하다.
const obj = {
  arr: [1,2,3]
}

obj.arr.length = 0; // 0
obj.arr.push(1); // 1
  • rest parameter
    rest parameter는 나머지 매개변수를 담는 변수
function foo (a, b, ...all) { // 항상 마지막에 쓰거나 혼자 쓰여야한다. 
  console.log(all); // ['c', 'd', 'e', 'f']
  console.log(Array.isArray(all)); // true
}
foo('a', 'b', 'c', 'd', 'e', 'f');
  • spread operator
//spread 연산자는 열거 가능한 오브젝트를 하나씩 전개한다.  
var arr1 = [1,2,3];
var arr2 = [4,5,6];

var total = [...arr1, ...arr2];

console.log(total); // [1,2,3,4,5,6]

// example
function foo (a,b,c){
  return a + b + c;
}

var a = foo(...[1,2,3]);
console.log(a); // 6
  • default parameter
// 기본 값을 설정!
function logName (name = 'ken'){
  console.log(name);
}

logName(); // ken
logName('wan'); // wan

  • Template Literals
const s = 'ken';
console.log(`my name is ${s}`); // my name is ken
  • Arrow Functions (중요)
// fn이라는 변수에 함수를 담는다.
const fn = (a) => {
  console.log(a);
}
fn();

// 인자가 하나일 경우 괄호 생략
const fn = a => {
  console.log(a);
}

// return 값도 선언 가능 (예제에선 a*b가 return값)
const multiply = (a, b) => a * b;
const a = multiply(1, 2);

업데이트: