새 메서드에서 메서드를 프로그래밍 방식으로 바꾸기 (포장) 할 수 있습니까?

Question

필자는 기본적으로 동일한 방식으로 새로운 방법으로 래핑해야하는 몇 가지 방법을 가지고 있습니다. 내 첫 번째 솔루션이 작동하지 않으며 이유를 이해하지만이 문제에 대한 간단한 해결책이 있는지 또는 내가 원하는 방식으로 수행 할 수 없는지 여부를 알지 못합니다.

다음은 예입니다. onClick 메서드가있는 객체가 있습니다. onClick 메서드보다 먼저 코드를 실행해야합니다. 나는 다음과 같은 시도 :

// objects a-c 
a = {onClick : function() { console.log('a'); }}; 
b = {onClick : function() { console.log('b'); }}; 
c = {onClick : function() { console.log('c'); }}; 

// first try 
var arr = [a, b, c] 
for (var i = 0; i < arr.length; i++) { 
    var oldOnClick = arr[i].onClick; 
    arr[i].onClick = function() { 
     // new code here 
     oldOnClick(); 
    } 
} 

// outputs 'c' 
// what i want is to maintain a reference to the original method 
// so in this case, execute my new code and output 'a' 
a.onClick(); 

새로운 메서드를 호출 할 때이 할당 될 때, oldOnClick이 방법 마지막 반복이 아니라에서 방법을 가리 때문이 작동하지 않습니다.

제가 간과 할 수있는 간단한 해결책이 있습니까?

for(var i=0, l=arr.length; i<l; i++){ 
(function(i){ 
    var oldOnclick = arr[i].onClick; 
    //etc. 
})(i); 
} 

Answer 1

는 당신이 필요로하는 것은 폐쇄입니다. 정말, 자바 스크립트는 꽤 이상합니다.

을 수정하는 방법을 모르겠지만 하위 기능을 도입하면 다른 바인드를 도입 할 수 있으므로이 특정 문제를 해결할 수 있습니다.

귀하의 (빠른-Y 크롬 해킹 수정) 코드가된다 : A, B, C :

는

a = {onClick : function() { alert('a'); }}; 
b = {onClick : function() { alert('b'); }}; 
c = {onClick : function() { alert('c'); }}; 

var arr = [a, b, c] 
for (var i = 0; i < arr.length; i++) { 
    var oldOnClick = arr[i].onClick; 
    arr[i].onClick = bind(oldOnClick); 
} 

a.onClick(); 
b.onClick(); 
c.onClick(); 

function bind(oldFunc) 
{ 
    return function() { 
     //New Code 
     oldFunc(); 
    } 
} 

위의 코드는 세 개의 경고를 던졌습니다. '// 새 코드'를 대체하는 것은 적시에 실행됩니다.

Answer 2

자바 스크립트 바인딩 규칙은 꽤 이상한 위치 :

Answer 3

Javascript 용 AOP 프레임 워크를 사용해 보셨습니까? jQuery를 AOP 플러그인을 사용하여 예를 들어

: 또한 here

jQuery.aop.before({target: String, method: 'replace'}, 
    function(regex, newString) { 
    alert("About to replace string '" + this + "' with '" + newString + 
      "' using regEx '" + regex + "'"); 
    } 
); 

확인하시기 바랍니다.

Answer 4

var a = {onClick : function() { console.log('a'); }}; 
var b = {onClick : function() { console.log('b'); }}; 
var c = {onClick : function() { console.log('c'); }}; 

var arr = [a, b, c]; 
for (var i = 0; i < arr.length; i++) { 
    var oldOnClick = arr[i].onClick; 
    arr[i].onClick = wrapHandler(oldOnClick); 
} 

function wrapHandler(handler) { 
    return function() { 
     console.log("New stuff"); 
     handler(); 
    } 
} 

a.onClick(); // outputs "New stuff" then "a" 
b.onClick(); // outputs "New stuff" then "b" 
b.onClick(); // outputs "New stuff" then "c"