call 메서드의 this binding

call 메서드가 this를 명시적으로 바인딩하는 방법

 

'this'바인딩 이해하기

 - 'this'는 함수가 어떻게 호출되는지에 따라 다른 값을 가진다. 'call'메서드는 함수 호출 시 'this'를 특정 값으로 설정할 수 있게 해 준다. 

 

'call'메서드 사용

function sayHello(){
	console.log('Hello, my name is ${this.name}');
}

const person = {
	name = 'John'
};

sayHello.call(person); //Hello, my name is John

위 코드에서 'sayHello' 함수는 'this.name'을 출력한다. 

 

'call' 메서드의 동작 원리

1. 함수 정의 : 

function sayHello(){
	console.log('Hello, my name is ${this.name}');
}

- 'sayHello' 함수는 'this.name' 을 출력한다. 

 

2. 객체 정의 : 

const person = {
	name : 'John'
};

- 'person' 객체는 'name' 속성을 가지고 있으며, 그 값은 'John'이다.

 

3. 'call'메서드 사용

sayHello.call(person);

 - 'call' 메서드의 첫 번째 인수를 this로 설정하여 함수를 호출한다. 

 - 'sayHello' 함수가 실행될 때, 'this'는 'person' 객체를 가리킨다. 

 - 'sayHello.call(person)'을 호출하면, 'sayHello'함수가 호출되면서 'this'가 'person'객체로 바인딩된다.