먼저 의 문맥에서 키워드에 대한 명확한 이해 scope와 행동 이 필요합니다 .thisscope

this& scope:

there are two types of scope in javascript. They are :

   1) Global Scope

   2) Function Scope

간단히 말하면 전역 범위는 창 개체를 가리 킵니다. 전역 범위에서 선언 된 변수는 어디에서나 액세스 할 수 있습니다. 반면에 함수 범위는 함수 내부에 있습니다. 함수 내부에서 선언 된 변수는 일반적으로 외부 세계에서 액세스 할 수 없습니다. this전역 범위의 키워드는 창 개체를 나타냅니다. this내부 함수는 또한 윈도우 객체 this를 참조하므로 우리가 this선택한 컨텍스트를 나타 내기 위해 조작 할 수있는 방법을 찾을 때까지 항상 윈도우를 참조합니다 .

--------------------------------------------------------------------------------
-                                                                              -
-   Global Scope                                                               -
-   ( globally "this" refers to window object)                                 -
-                                                                              -
-         function outer_function(callback){                                   -
-                                                                              -
-               // outer function scope                                        -
-               // inside outer function"this" keyword refers to window object -                                                                              -
-              callback() // "this" inside callback also refers window object  -

-         }                                                                    -
-                                                                              -
-         function callback_function(){                                        -
-                                                                              -
-                //  function to be passed as callback                         -
-                                                                              -
-                // here "THIS" refers to window object also                   -
-                                                                              -
-         }                                                                    -
-                                                                              -
-         outer_function(callback_function)                                    -
-         // invoke with callback                                              -
--------------------------------------------------------------------------------

this내부 콜백 함수 를 조작하는 다른 방법 :

여기 Person이라는 생성자 함수가 있습니다. 그것은라는 특성이 name및라는 네 가지 방법을 sayNameVersion1, sayNameVersion2, sayNameVersion3, sayNameVersion4. 콜백을 수락하고 호출합니다. 콜백에는 Person 생성자 함수 인스턴스의 name 속성을 기록하는 특정 작업이 있습니다.

function Person(name){

    this.name = name

    this.sayNameVersion1 = function(callback){
        callback.bind(this)()
    }
    this.sayNameVersion2 = function(callback){
        callback()
    }

    this.sayNameVersion3 = function(callback){
        callback.call(this)
    }

    this.sayNameVersion4 = function(callback){
        callback.apply(this)
    }

}

function niceCallback(){

    // function to be used as callback

    var parentObject = this

    console.log(parentObject)

}

이제 person 생성자에서 인스턴스를 생성하고 sayNameVersionX(X는 1,2,3,4 niceCallback참조 ) 메소드 의 다른 버전을 호출 this하여 person인스턴스 를 참조하기 위해 내부 콜백을 조작하는 방법의 수 를 확인하십시오 .

var p1 = new Person('zami') // create an instance of Person constructor

바인딩 :

바인드는 this키워드를 제공된 값으로 설정하여 새 함수를 작성하는 것 입니다.

sayNameVersion1및 sayNameVersion2사용 바인드 조작 this콜백 함수.

this.sayNameVersion1 = function(callback){
    callback.bind(this)()
}
this.sayNameVersion2 = function(callback){
    callback()
}

첫 번째 this는 메서드 자체 내에서 콜백과 바인딩 되며 두 번째 콜백은 바인딩 된 객체와 함께 전달됩니다.

p1.sayNameVersion1(niceCallback) // pass simply the callback and bind happens inside the sayNameVersion1 method

p1.sayNameVersion2(niceCallback.bind(p1)) // uses bind before passing callback

전화 :

first argument의 call방법으로 사용 this하여 호출 된 함수 내call 첨부.

sayNameVersion3용도는 call(가) 조작하는 this대신 창 개체, 우리가 만든 사람 객체를 참조 할 수 있습니다.

this.sayNameVersion3 = function(callback){
    callback.call(this)
}

다음과 같이 호출됩니다.

p1.sayNameVersion3(niceCallback)

적용 :

와 유사하게 call첫 번째 인수 apply는로 표시 될 객체를 나타냅니다.this 키워드 .

sayNameVersion4사람 개체를 참조하기 apply위해 조작 this하는 데 사용

this.sayNameVersion4 = function(callback){
    callback.apply(this)
}

콜백이 전달됩니다.

p1.sayNameVersion4(niceCallback)

답변

setTimeout(function(){
    this.methodName();
}.bind(this), 2000);