Function.prototype 확장자를 갖는 함수에 어떻게 액세스합니까?

함수를 디버깅하기 위해 함수 확장을 만들려고합니다. 함수가 여러 번 연속적으로 호출되고 한 번만 실행하고 캐시 된 값을 반환하는 경우 디버깅하려고합니다.Function.prototype 확장자를 갖는 함수에 어떻게 액세스합니까?

UI 프레임 워크 내에서 사용하려고하지만 이식성이 좋기를 바랍니다. 다음과 같이 내가 지금까지 가지고있는 코드는 다음과 같습니다

function clickButton() 
{ 
    document.getElementById('log').innerHTML += "<br/>Clicked "+arguments[1]; 
    return "some value"; 
}

내가 clickButton.debounce(3,4) 전화, 작동 :

Function.prototype.debounce = function() 
{ 
    var originalFunction = this; //this should be 'clickButton' in the example implementation 
    var originalArguments = arguments; 

    function debouncedFunction() 
    { 
     var originalContext = this; 
     return originalFunction.apply(originalContext,originalArguments) 
    } 

    if(this.__DEBOUNCEDVALUE === undefined) 
    { 
     this.__DEBOUNCEDVALUE = debouncedFunction(); 
     if(this.__DEBOUNCEDVALUE === undefined) 
      this.__DEBOUNCEDVALUE = null; 
     setTimeout(function(){originalFunction.__DEBOUNCEDVALUE = undefined},1000); 
    } 

    return this; 
}

다음, 나는 다음과 같습니다 일반적인 기능 "clickButton"를 정의했다. 문서에 초당 하나만 기록하지만 호출 될 때마다 반환됩니다.

그러나 리스너 (buttons[i].addEventListener('click',clickButton.debounce))를 통해 호출 할 때 originalFunction 변수는 기능이 아니라 버튼으로 설정됩니다. 큰 놀라움은 아닙니다. 이 예제에서 debounce 내에서 clickButton에 대한 참조를 얻으려면 어떻게해야합니까?

편집 : 액세스 시간에 컨텍스트와 함수를 저장할 수있는 defineProperty를 사용하여 전환을 시도했습니다. 불행히도, 모든 경우에 작동하지는 않습니다 (Sencha Touch의 탭 핸들러에 넣으면 Window 스코프 내에서 함수가 호출됩니다). 이것은 더 가깝지만 여전히 받아 들일 수없는 것입니다.

Object.defineProperty(Function.prototype,'debounce',{get: function() 
    { 
     var originalFunction = this; 
     var execute = function() 
     { 
      if(originalFunction.__DEBOUNCEDVALUE === undefined) 
      { 
       originalFunction.__DEBOUNCEDVALUE = originalFunction.apply(this,arguments); 
       if(originalFunction.__DEBOUNCEDVALUE === undefined) 
        originalFunction.__DEBOUNCEDVALUE = null; 
       setTimeout(function() 
        { 
         originalFunction.__DEBOUNCEDVALUE = undefined; 
         console.log("Reset"); 
        },5000); 
      } 
      else 
       console.log("Return cached value"); 

      return originalFunction.__DEBOUNCEDVALUE; 
     } 
     return execute; 

    }});

출처

2012-11-21 Chris

이 작업은 함수 개체를 debounce에 바인딩하는 방법으로 만 수행 할 수 있습니다.

한가지 방법은 clickButton 위에 폐쇄 익명 함수를 전달하는 또 다른 방법

buttons[i].addEventListener('click',clickButton.debounce.bind(clickButton)),

.bind를 사용한다.

buttons[i].addEventListener('click',function(e) { 
    return clickButton.debounce.apply(clickButton, arguments); 

     // The following would suffice for this example: 
    // return clickButton.debounce(e); 
}),

그러나 따로 기술의 이러한 종류의에서 는 debounce는 addEventListener에 전달 될 때이 참조 된에서 개체의 기억이 없습니다.

출처

2012-11-21 18:34:48

Function.prototype 확장자를 갖는 함수에 어떻게 액세스합니까?

답변

관련 문제