차이 (ARG)과 obj.func.bind (OBJ, ARG)

Question

난 그냥 코드 반응의 조각에 다음과 같은 구조를 건너 왔어요 : 어떤에서

<MyActionComponent callback={this.func.bind(this, arg)}> 

제 생각에 bind은 함수의 this을 첫 번째 인수로 설정하고 추가 인수를 전달하여 해당 함수를 실행한다는 것을 이해합니다. func이 이미 객체의 속성 인 경우 this이되고 싶으므로 this.func(arg)은 동일한 문제가 발생합니다.

동일한 기능에 대해 더 복잡한 구문으로 보이는 동기가 보이지 않습니다. obj.func(arg)이 obj.func.bind(obj, arg)과 다르게 동작하는 컨텍스트가 있습니까? 아니면 내가 알지 못하는 비 기술적 측면 (예 : 대회, 일관성)이 있습니까?

Answer 1

임계 차이 func.bind(obj, arg) 반면 함수 기능을 실행하지 않는다obj.func(arg)실행한다는 것이다. 함수가 실제로 실행되면 이 obj에 바인딩되도록합니다.

는 여기를 참조하십시오 :

var obj = { 
    fooFn: function() {console.log("this = ", this)} 
} 

obj.fooFn() // => prints "this = [Object]" 

var boundFn = obj.fooFn.bind("bar") 
boundFn() // => prints "this = 'bar'" 

Answer 2

this 컨텍스트를 설정하는 것 외에도, Function.prototype.bind 또한 함수가 호출 될 때 인수 앞에 붙 세트 인수로 할 수 있습니다. bind 함수의 반환 값은 해당 함수를 호출 한 결과가 아니며 바인딩 된 this 컨텍스트와 함수가 바인딩 될 때 지정된 앞에 추가 된 인수로 호출 할 수있는 함수입니다.

const addStuff = function(a, b) { 
 
    this.sum += a; 
 
    this.sum += b; 
 
}; 
 

 
const resultA = { sum: 0 }; 
 
const add_A_and_B = addStuff.bind(resultA); 
 
add_A_and_B(1, 2); 
 

 
console.log("add_A_and_B(1, 2):", resultA); 
 

 
const resultB = { sum: 0 }; 
 
const add_5_and_B = addStuff.bind(resultB, 5); 
 
add_5_and_B(2); 
 

 
console.log("add_5_and_B(2):", resultB);