javascript es6(es2015) spread operator, function apply, call, bind

이거 보고 광고 한번 안 누른 이는 삼대가 재수가 없을지어다!ㅋㅋ

... spread operator는 말 그대로 spread, 전개, 넓~게 펼친다. 다음은 array, string, object에 적용하고, 그림 1은 전개한 결과다. 변수 c는 array를 병합, obj2는 object를 병합하는데, object의 경우(es9=es2018) 동일한 속성이 있을 경우 후위에 합쳐진 속성이 적용된다.

var arr = ['안녕하세요', '반가워요'];
var str = '내일 또 만나요';
console.log(...arr);
console.log(...str);

var a = [1, 2, 3];
var b = [4, 5, 6];
var c = [...a, ...b];
console.log(c);

var obj1 = {a: 1, b: 2, c: 4};
var obj2 = {...obj1, c: 3}; // 동일속성이 있을 경우 뒤에 속성이 적용됨

console.log(obj2);

그림 1

다음은 함수 호출시 인자(parameter)로 넘길 때 spread를 적용한 모습이다.

apply와 call은 함수를 호출하는 함수로 첫번째 인자는 함수의 this를 대체하는 참조이며, apply는 인자 배열( [a, b, c] 형태 )을 직접 넘겨야 하고, call은 인자 목록( a, b, c형태 )을 넘긴다. bind는 apply, call과 동일하게 this, 인자를 넘기나 실행되지 않고 함수 자체를 반환하므로 변수에 할당 후 직접 실행한다.

function sum(a, b, c, d, e, f) {
    return a + b + c + d + e + f;
}

console.log(sum(...c));
console.log(sum.apply(undefined, c));
console.log(sum.call(undefined, ...c));

var sum_var= sum.bind(undefined, ...c);

console.log(sum_var);
console.log(sum_var());

그림 2