권리를 기능

Question

이 컨텍스트를 취득 나는 다음과 같은 문제가 : 권리 될 것 같지 않습니다 -context

내가 각도 ($scope.$apply())로 다음을 적용하는 함수를 덮어하려고 노력하지만, 내 this을 하나.

Anno.prototype.switchTo = function(otherAnno) { 
    if (otherAnno != null) { 
     this.hideAnno(); 
     return otherAnno.show(); 
    } else { 
     console.warn("Can't switchTo a null object. Hiding instead."); 
     return this.hide(); 
    } 
}; 

그리고 다른 파일에서 나는 다음처럼 "덮어 쓰기":

var switchToFunction = AnnoModule.Anno.prototype.switchTo; 
AnnoModule.Anno.prototype.switchTo = function(otherAnno) { 
    switchToFunction(otherAnno); 
    $scope.$apply(); 
}; 

을 그래서 실제로 내가 저장

(다른 파일에) 원래의 기능은 다음과 같습니다 원래 함수를 호출 한 다음 원본 함수를 다시 정의한 다음 원래 함수를 호출하여 범위를 적용합니다.

이제 문제가 발생합니다. 알 수 있듯이이 함수는 this.hideAnno()을 사용하지만 재정의 된 함수에서 컨텍스트가 또 하나이므로 Chrome에서 "this.hideAnno()가 아닙니다."라는 오류가 발생합니다. 기능". 그러나 지금 나는 어떻게 내가 올바른 컨텍스트를 얻을 수 있는지 잘 모르겠다. 내가 this을 이해하려고 노력했지만 JavaScript가 너무 혼란 스럽기 때문에 실제로 이해가 가지 않습니다.

JavaScript의 혼란을 누군가 이해할 수 있습니까?

Answer 1

js에서 함수가 메서드로 호출되면 그 내부에있는 this은 메서드가 속한 개체를 참조합니다.

반면에 함수가 자체적으로 호출되면 그 내부의 this은 전역 객체 또는 undefined을 엄격 모드로 참조합니다.

메서드로 정의 된 함수를 독립 실행 형 함수로 추출한 다음 호출하는 것으로 인해 this이 예상 한대로 작동하지 않습니다. 이 경우에 필요한 것은

는 당신이 필요로 this의 값을 설정, call 또는 switchToFunctionapply이다. 즉 당신이 오래된 방법의 this 사용자가 만든 새로운 방법의 this로 설정 :

var switchToFunction = AnnoModule.Anno.prototype.switchTo; 
AnnoModule.Anno.prototype.switchTo = function(otherAnno, that) { 
    switchToFunction.call(this, otherAnno); // sets `this` of the old method to be this of the new method you created 
    $scope.$apply(); 
}; 

Answer 2

이 문제를 이해하는 방법에 this 키워드 작품이 불통 될 수 있는지, 내가 생각하는 우리는 먼저 이해해야한다 .

자바 스크립트의 모든 기능의 내부 this 목적은 방법가 호출되는 객체 것이다.

, 그래서 foo 방법은 obj1에 호출

obj1.foo();  // obj1 
bar();   // window 

때문에 이제 방법은 우리가 출력 아래와 같이 얻을 호출 할 때

var obj1 = { 
    foo: function() { 
     console.log(this); 
    } 
}; 

function bar() { 
    console.log(this); 
} 

, this 안쪽이 다음과 같은 예를 생각해 foo의 방법은 obj1이되었습니다. 마찬가지로 this 내부에 bar 메서드는 window 개체가됩니다.

지금, 나는 함수 내부 this으로 obj1로 bar 메소드를 호출하는 것을 원하는 경우. 이 JavaScript는 call, apply and bind 함수를 동적으로 변경하기위한 this 메소드를 제공합니다. 우리가 call 방법을 사용하여 이것을 달성 할 수있는 방법을 보겠습니다.

bar.call(obj1);   // obj1 

마찬가지로,

obj1.foo.call(window);   // window 

call 방법은 bar 함수 내부 this 될 것이다 인자로 thisArg 객체 걸린다. 그리고 bar 함수가 또한 call 메서드를 통해 thisArg 다음에 전달 될 수있는 인수를 기대하는 경우. call에 대한 자세한 내용은 MDN을 참조하십시오.

그래서 문제에 대한 솔루션이 될 것입니다, 당신은 문제를 이해하는이 분명히 있습니다

var switchToFunction = AnnoModule.Anno.prototype.switchTo; 
AnnoModule.Anno.prototype.switchTo = function(otherAnno) { 
    switchToFunction.call(this, otherAnno); 
    $scope.$apply(); 
}; 

희망.