JavaScript에서 이것의 소프트 바인딩에 대해 알려주는 기사가 있습니다.

먼저 소프트바인딩이란 무엇일까요?

소위 소프트 바인딩은 하드 바인딩에 해당하는 단어입니다. 소프트 바인딩에 대해 자세히 설명하기 전에 먼저 하드 바인딩에 대해 살펴보겠습니다. JavaScript에서는 바인딩이 동적입니다. 함수가 호출되는 위치에 따라 전적으로 바인딩됩니다. 바인딩 규칙에만 기본 바인딩과 암시적 바인딩이 포함됩니다. , 명시적 바인딩, 새 바인딩 등이 있으며 하드 바인딩은 일반적으로 apply(), call() 함수를 호출하거나 ES5에서 제공되는 bind() 메서드를 호출하여 하드 바인딩을 구현하는 명시적 바인딩 유형입니다. .

하드 바인딩의 문제점은 무엇입니까? 소프트 바인딩이 필요한 이유는 무엇입니까?

위의 세 가지 방법이 좋든 싫든 자신의 생각에 따라 이 기능을 지정된 개체에 강제로 적용할 수 있습니다. 하드 바인딩을 변경하는 새 바인딩)(바인딩 외부), 그러나 하드 바인딩에는 함수의 유연성이 감소한다는 문제가 있으며, 하드 바인딩 후에는 더 이상 암시적 바인딩이나 명시적 바인딩을 사용할 수 없습니다. 이 점을 수정합니다.

이 경우 소프트 바인딩이라는 구현이 나타납니다. 즉, 소프트 바인딩을 통해 이것이 더 이상 기본(엄격하지 않은 모드) 또는 undefine(엄격 모드)으로 전역 개체를 가리키지 않기를 바랍니다. 두 개체 외부의 개체를 가리키지만(이것은 하드 바인딩과 동일한 효과가 있음) 동시에 암시적 바인딩 및 명시적 바인딩 기능을 유지하여 나중에 이 포인터를 수정할 수 있습니다.

소프트 바인딩의 구체적인 구현

여기서는 "You Don't Know"에서 소프트 바인딩의 코드 구현을 사용합니다.

if(!Function.prototype.softBind){ 
    Function.prototype.softBind=function(obj){ 
        var fn=this;
        var args=Array.prototype.slice.call(arguments,1);
        var bound=function(){ 
            return fn.apply( (!this||this===(window||global))?obj:this,
            args.concat.apply(args,arguments));
            };
        bound.prototype=Object.create(fn.prototype);
        return bound;
        };
}

먼저 효과를 살펴보고 그에 대해 논의합니다. 구현.

function foo(){
    console.log("name: "+this.name);
    }
var obj1={name:"obj1"},
obj2={name:"obj2"},
obj3={name:"obj3"};
var fooOBJ=foo.softBind(obj1);
fooOBJ();//"name: obj1" 在这里软绑定生效了，成功修改了this的指向，将this绑定到了obj1上1
obj2.foo=foo.softBind(obj1);
obj2.foo();//"name: obj2" 在这里软绑定的this指向成功被隐式绑定修改了，绑定到了obj2上
fooOBJ.call(obj3);//"name: obj3" 在这里软绑定的this指向成功被硬绑定修改了，绑定到了obj3上
setTimeout(obj2.foo,1000);//"name: obj1"18 
/*
*回调函数相当于一个隐式的传参，如果没有软绑定的话，这里将会应用默认绑定将this绑定到全局环
*境上，但有软绑定，这里this还是指向obj1
*/

소프트 바인딩이 적용된 것을 보실 수 있습니다. softBind() 구현을 자세히 살펴보겠습니다.

첫 번째 줄에서 먼저 판단을 통과합니다. 함수의 프로토타입에 softBind() 메서드가 없으면 이를 추가한 다음 Array.prototype.slice.call(arguments)을 통해 들어오는 외부 정보를 가져옵니다. ,1) 매개변수, 이는 실제로 함수 커링을 목적으로 여기서 수행됩니다. 즉, 소프트 바인딩 중에 일부 매개변수를 미리 설정한 다음 함수를 호출할 때 다른 매개변수를 전달할 수 있습니다(검색으로 이동 가능). 자세한 설명은 온라인 참조) 마지막으로 bound 함수가 반환되어 클로저를 형성합니다. 이때 함수가 softBind()를 호출한 후 위의 var과 같은 bound 함수를 얻게 됩니다. fooOBJ=foo.softBind(obj1).

bound 함수에서는 먼저 소프트 바인딩을 호출한 후 함수(예: fooOBJ)의 호출 위치를 결정하거나, !this(this가 정의되지 않음을 가리킴) 또는 this===인 경우 this의 지점을 결정합니다. (window ||global) (이것은 전역 객체를 가리킵니다), 함수의 이것을 SoftBind에 전달된 매개변수 obj에 바인딩합니다. 이것이 undefind 또는 전역 개체를 가리키지 않으면 현재 가리키고 있는 함수(즉, 암시적 바인딩 또는 명시적 바인딩)에 바인딩합니다. fn.apply의 두 번째 매개변수는 foo를 실행하는데 필요한 매개변수로 위의 args(외부 매개변수)와 위에서 언급한 커링인 내부 매개변수(내부 매개변수)로 구성된다.

사실 이 함수를 처음 읽었을 때 foo가 foo.softBind()를 통해 SoftBind를 호출하면 누가 fn 포인트를 주는지 등의 질문이 조금 혼란스러웠습니다. 에게? foo 또는 SoftBind를 가리키고 있습니까? 데모 테스트를 작성하면 fn이 가리키는 것이 무엇인지 명확하게 알 수 있습니다.

var a=2; 
function foo(){ 
}
foo.a=3;
Function.prototype.softBind=function(){ 
    var fn=this;
    return function(){
        console.log(fn.a);
    }
};
Function.prototype.a=4;
Function.prototype.softBind.a=5;
foo.softBind()();//3
Function.prototype.softBind()();//4

fn(또는 이것)을 가리키는 것이 여전히 이것의 바인딩 규칙을 따르는 것을 볼 수 있습니다. softBind 함수는 다음과 같습니다. Function.prototype 함수의 프로토타입에 정의되어 있지만 JavaScript의 함수는 결코 객체에 "속하지" 않습니다(Java와 같은 다른 언어의 클래스에 정의된 메서드와는 달리). 객체 내부적으로 참조되므로 전달됩니다. 다음 두 가지 방법으로 호출하면 fn(또는 this)이 각각 foo 및 Function.prototype에 암시적으로 바인딩되므로 각각 3과 4가 출력됩니다. 다음 fn.apply()는 foo.apply()와 동일합니다.

위 내용은 JavaScript에서 이것의 소프트 바인딩에 대해 알려주는 기사가 있습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!