2014-10-04 2 views
2

다음 자바 스크립트 스 니펫에서 각 행이 무엇을하는지 이해할 수 없습니다. 나는 그 사람이 들어 왔는지 탈출했는지 여부를 읽고 있다는 것을 이해합니다. 그러나 2, 3, 6, 10, 16, 18 행이 무엇을하는지 이해하고 싶습니다. = callbacks.ok자바 스크립트의 스 니펫은 무엇입니까?

var okCancelEvents = function (selector, callbacks) { 
    var ok = callbacks.ok || function() {}; 
    var cancel = callbacks.cancel || function() {}; 

    var events = {}; 
    events['keyup '+selector+', keydown '+selector+', focusout '+selector] = 
    function (evt) { 
     if (evt.type === "keydown" && evt.which === 27) { 
     // escape = cancel 
     cancel.call(this, evt); 

     } else if (evt.type === "keyup" && evt.which === 13) { 
     // blur/return/enter = ok/submit if non-empty 
     var value = String(evt.target.value || ""); 
     if (value) 
      ok.call(this, value, evt); 
     else 
      cancel.call(this, evt); 
     } 
    }; 

    return events; 
}; 

답변

2

VAR 확인 || function() {};

callbacks.ok이 정의되지 않은 경우 stub 함수를 만듭니다. http://en.wikipedia.org/wiki/Method_stub과는 그 기능에 대한 참조를 저장하거나 callbacks.ok

VAR 취소 = || callbacks.cancel에 참조하도록 설정 ok function() {}; [+ 선택기 '대한 focusOut' '의 keyup'+ 선택기 + '를 keyDown'+ 선택기 +] callbacks.cancel

이벤트

동일한

객체 events (이전 라인)을 만들고 속성이 'keyup '+selector+', keydown '+selector+', focusout '+selector 인 채로 채워집니다.

cancel.call (this, evt);

호출 함수는 나열된 인수를 사용하여 cancel 변수에 저장된 참조로 호출합니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call

ok.call (this, value, evt);

동일하지만, 변수 참조 번호는 ok입니다.

2

JavaScript 참고 자료의 출처는 Mozilla Developer Network입니다.

관련 MDN 페이지에 대한 링크와 함께, 당신이 언급 한 행을 선택하려면 :

  • 라인 2, 3 "뭔가 또는 뭔가 다른"를 반환 the || operator을 사용하고 있습니다. 이 경우 callbacks.ok 또는 callbacks.cancel이 정의되지 않은 경우 기본값을 제공하는 데 사용되므로 나머지 코드는 okcancel이 올바른 기능을 가리키는 지 알 수 있습니다.
  • 라인 6은 숫자가 많을 때 더하기를 수행하고 주어진 문자열이있을 때 연결을 수행하는 the + operator을 사용하여 많은 문자열을 함께 하나의 객체 키로 연결합니다.
  • 줄 10, 16 및 18은 모두 the call method을 사용하여 콜백을 호출합니다. 이는 특정 개체의 구성원으로 정의되지 않은 함수를 호출 할 때 this에 적절한 값을 설정하는 방법입니다.

전체적인 효과는 그 이름 selector 여러 번 나열하고, 그 값이 이벤트를 전달하고 실행할 개의 콜백 결정할 수 함수 인 하나 개의 속성으로, 오브젝트 events를 생성하는 것이다.

이 함수에는 실제 DOM 요소에 이벤트를 연결하는 데 필요한 논리가 포함되어 있지 않습니다. 그 반환 값의 구조는 아마 다른 함수의 입력 값일 것입니다.

관련 문제