Javascript의 call, apply, bind

call에 대해서는 this와 함께 이전 게시글에서 다루었다. 

이 게시글에서 다룰 call과 apply와 bind는 쓰임세가 다 비스무리 하다.

 

함수를 호출할 때 this를 바인딩하는 것에서는 다 같은 함수다.

다른 점만 간단하게 확인하고 넘어가도록 하겠다.

 

const foo = {
    three: 3
}
const bar = {
    addThreeToSum(a, b, c) {
        return a + b + c + this.three;
    }
}

console.log(bar.addThreeToSum.call(foo, 1, 2, 3));
console.log(bar.addThreeToSum.apply(foo, [1, 2, 3]));

--

node test.js
9
9

--

call은 다수의 인수를 전달하지만, apply는 Array 하나를 받아서 사용한다는 점의 차이가 있다.

const foo = {
    a: 'a',
    b: 'b',
    c: 'c',
    f() {
        console.log(this.a, this.b, this.c);
    }
}

const bar = {
    a: 'A',
    b: 'B',
    c: 'C'
}

const baz = foo.f.bind(bar);
baz()

--

node test.js
A B C

--

bind는 위의 call과 apply와 마찬가지로 this 바인딩을 하지만, 실행 기능은 없고 딱 바인딩만 한다.

종료되며 바인딩한 함수를 리턴하기 때문에 이를 배열에 저장하면 된다.