✔ apply,call,bind 메서드는 Function.prototype의 메서드다 .

apply,call 메서드의 본질적인 기능은 함수를 호출하는 것이다

💡apply,call 메서드의 공통점과 차이점

(공통점)

apply와 call 메서드는 함수를 호출하면서 첫번째 인수로 전달한 특정객체를 호출한 함수에 바인딩 하는 것은 같다

(차이점)

apply와 call 메서드는 호출할 함수에 인수를 전달하는 방식만 다를 뿐 동일하게 동작한다.

apply 메서드는 호출할 함수의 인수를 배열로 묶어 전달한다

call 메서드는 호출할 함수의 인수를 쉼표로 구분한 리스트 형식으로 전달한다.

[예제]

var person = {
    인사 : function(){
      console.log(this.name + '안녕')
    }
}
  
var person2 = {
    name : '손흥민'
}

person.인사.apply(person2, [1,2,3]); // person.인사(1,2,3)
person.인사.call(person2, 1,2,3); // person.인사(1,2,3)

👉즉 apply와 call 메서드는 호출한 함수에 인수를 전달하는 방식만 다를뿐 this로 사용할 객체를 전달하면서 함수를 호출하는 것은 동일하다

💡apply와 call 메서드의 대표적인 용도

function 더하기(a,b,c){
   console.log(a + b + c)
}

var array = [10, 20, 30];
더하기(...array);  //요즘방식 넣기
더하기.apply(undefined, array);  //옛날방식 넣기

더하기() 함수를 실행하는데 undefined에 적용해서 실행해주고 파라미터로 어레이를 집어넣어주세요~ 라는 뜻입니다.

이러면 array를 풀어헤쳐서 파라미터로 집어넣으실 수 있습니다.

Q. undefined이란?

A. 그냥 아무곳에도 적용해서 실행하지 않게하기 위해 적은 내용입니다. 그냥 쌩으로 더하기() 함수가 실행됩니다.

왜냐면 더하기()함수는 어디에도 적용할 필요가 없으니까요. 근데 비워두면 문제가 생기기 때문에 아무 값이나 집어넣은 것입니다.

💡bind 메서드란?

Function.prototype.bind 메서드는 apply와 call 메서드와 달리 bind()는 새롭게 바인딩한 함수를 만든다. 바인딩한 함수는 원본 함수 객체를 감싸는 함수이다. bind()는 call(), apply()와 같이 함수가 가리키고 있는 this를 바꾸지만 호출되지는 않는다. 따라서 변수를 할당하여 호출하는 형태로 사용된다.

let person1 = {
    name: 'Jo'
};

let person2 = {
    name: 'Kim',
    study: function() {
        console.log(this.name + '이/가 공부를 하고 있습니다.');
    }
};

person2.study(); // Kim이/가 공부를 하고 있습니다.

// bind()
person2.study.bind(person1);

let person1 = {
    name: 'Jo'
};

let person2 = {
    name: 'Kim',
    study: function() {
        console.log(this.name + '이/가 공부를 하고 있습니다.');
    }
};

person2.study(); // Kim이/가 공부를 하고 있습니다.

// bind()
let student = person2.study.bind(person1);

student(); // Jo이/가 공부를 하고 있습니다.

변수를 할당하여 호출하는 형태로 사용