Javascript에서 함수 바인딩 메소드를 사용하는 방법에 대한 자세한 설명

Function.prototype.bind()

바인드 메소드는 함수 내부(실행되는 범위)에 this 포인터를 지정한 다음 새 함수를 반환하는 데 사용됩니다. 바인드 메소드는 함수를 즉시 실행하지 않습니다.

var keith = {
 a: 1,
 count: function() {
 console.log(this.a++);
 }
 };
 keith.count(); //1
 keith.count(); //2
 keith.count(); //3

위 코드에서 this.a가 keith 객체 내부의 a 속성을 가리키는 경우, 이 메소드를 다른 변수에 할당하면 호출 시 오류가 발생합니다.

 var keith = {
 a: 1,
 count: function() {
 console.log(this.a++);
 }
 };
 var f = keith.count;
 f(); //NaN

위 코드에서 count 메서드가 f 변수에 할당되면 this 객체는 더 이상 keith 객체를 가리키지 않고 window 객체를 가리킵니다. 그리고 window.a의 기본값은 증분 작업 후 정의되지 않은++는 NaN과 같습니다.

이 문제를 해결하려면 바인딩 메소드를 사용하여 keith 객체에 있는 이를 keith 객체에 바인딩하거나 직접 호출할 수 있습니다.

 var f = keith.count.bind(keith);
 f(); //1
 f(); //2
 f(); //3
 keith.count.bind(keith)() //1
 keith.count.bind(keith)() //2
 keith.count.bind(keith)() //3

물론, 이는 다른 객체에도 바인딩될 수 있습니다.

 var obj = {
 a: 100
 };
 var f = keith.count.bind(obj);
 f(); //100
 f(); //101
 f(); //102

마찬가지로 첫 번째 매개변수가 null이거나 정의되지 않은 경우, 함수 내의 this 객체는 두 번째 매개변수가 필요한 매개변수인 경우를 가리킵니다. 호출, 그리고 매개변수 전달 형식은 호출 방법과 동일합니다.

 function keith(a, b) {
 return a + b;
 }
 console.log(keith.apply(null,[1,4])); //5
 console.log(keith.call(null,1,4)); //5
 console.log(keith.bind(null, 1, 4)); //keith()
 console.log(keith.bind(null, 1, 4)()); //5

위 코드에서 call, Apply, 바인딩의 차이점을 확인할 수 있습니다. call 및 Apply 메소드는 호출된 후 즉시 실행됩니다. 바인드 호출 후에는 원래 함수로 돌아가므로 다시 호출해야 합니다. 이는 클로저와 약간 비슷합니다

위 내용은 Javascript에서 함수 바인딩 메소드를 사용하는 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!