본문 바로가기

자바스크립트/ECMAScript 6

ES6 자바스크립트의 이상한 기호들

1. Spread Operator (...)

 

let args = [0, 1, 2];

// 아래의 세 함수 호출은 같은 말이다.

func(0, 1, 2);

func.apply(null, args);

func(...args);

 

2. Arrow Function Expression

 

// 아래의 두 함수는 익명 함수로 같은 말이다.

function(a, b) { return a + b }

(a, b) => { return a + b; }

 

화살표 함수가 호출 될 때에는 this가 바인딩 되지 않는다.

그래서 상위 함수가 바인딩한 this를 그대로 가져오게 된다.

클로저로서 외부의 this를 참조하는 것과 같다.

 

참고 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

 

3. Immediately Invoked Function Expression

 

// 아래의 두 함수 호출은 함수를 정의하자마다 호출하는 방법으로 같은 말이다.

(function() {
    var a = 0;
})();

{
    var a = 0;
}

 

4. Default Parameter

 

function func(a = 1) {

    return a;

}

 

func(); // 1;

func(2); // 2;

 

5. Destructuring

 

const obj = {

    a: 1,

    b: 2

}

 

const a = obj.a;

const b = obj.b;

 

// 위 두 줄은 아래로 대신할 수 있다.

const { a, b } = obj;