2010-06-28 6 views
4

내가이 jQuery 플러그인으로 실행하고 난 꽤 이것이 어떻게 작동하는지 이해 :자바 스크립트 함수에서 this.function = function을 설정할 수 있습니까?

$.functionone = function(){ 

    function setOptions(newOptions){ 
     ... 
    } 
    this.setOptions = setOptions; 
} 

이 실제로 무엇을 어떻게 이해 해달라고합니까입니까? this.setOptions = setOptions 괄호없이 함수를 호출 할 수 있습니까? this.setOptionssetOptions 사이의 관계는 그 자체로 무엇입니까?

답변

9

JavaScript의 함수는 (거의) 다른 모든 것과 같은 객체입니다. 이 수행 할 때

this.setOptions = setOptions; 

을 당신은 , 당신은 단지 정확히 같은, 다른 객체에 속성을 설정처럼 속성에 함수에 대한 참조를 할당하고있는 setOptions 기능를 호출하지 않은 :

var dt; 
dt = new Date(); 
this.today = dt; 

기능과 함께, 당신은 그래서 당신이 나중에 (편리 개체, 호텔에,이기 위하여 this 값을 설정) 속성을 통해 함수를 호출 할 수 있습니다이 작업을 수행 할 것입니다. 그것은 당신이 함수에 대한보다 속성에 대해 다른 이름을 사용하는 경우에 무슨 일이 일어나고 있는지 좀 더 명확한입니다 :

function functionName() { ... } // Declares the function 
this.propertyName = functionName; // Sets the property 
functionName();     // Calls the function (with `this` = the global object ["window", on browsers]) 
this.propertyName();    // Also calls the function (but with `this` = the object the property's on) 

이 확인 된 패턴, 함수를 선언 한 후 별도로 객체에 대한 참조를 설정 자주있다 결과 함수의 이름이 인지 확인하는 데 사용됩니다. 어떤을 할 수있다, (재산이하는,하지만 기능)

this.setOptions = function() { 
    ... 
}; 

...하지만 그 기능은 이름이없는 : 당신은 함수를 생성하고이 같은 속성에 바인딩 할 수 있습니다 디버거가 다양한 컨텍스트 (예 : 호출 스택)의 함수 이름을 표시하기 때문에 디버깅 할 때 문제가 발생합니다. 많은 함수가 이름을 가지고 있지 않다면, 그것들을 참조하는 프로퍼티가 디버깅을 어렵게 만든다. More about anonymous vs. named functions here.는 (이 또한 함수가 인스턴스화 될 때의 관점의 차이, 그러나 단지 일을 복잡하게 할 여기에 가고.)

당신은 당신이이 같은 일을 결합 할 수 있다고 생각 것 :

this.setOptions = function setOptions() { // <=== DON'T DO THIS 
    ... 
}; 

. 그러나 그 대부분은 작동하지만 Internet Explorer/JScript의 버그를 유발합니다 (코드에 대해 두 가지 다른 함수를 만듭니다. 이는 메모리 낭비이고 최악의 경우 시간이 낭비되는 문제입니다). in this question).

1

괄호를 추가하는 경우에만 setOptions 함수가 호출됩니다 (setOptions()). 괄호를 추가하지 않으면 함수에 대한 참조가 있습니다. 이것은 일반 변수와 같으며 다른 값 대신 함수 참조 만 포함합니다.

this.setOptions = setOptions으로 설정하면 setOptions과 동일한 기능을 가리키는이 개체에 setOptions 함수를 만듭니다. 즉, this.setOptions()을 사용하여 호출하면 참조 된 함수가 호출됩니다.

+0

안녕하세요,이 컨텍스트에서는 코드에서 'this'를 이해하지 못했습니다. 이미 $ ('div') 메서드를 호출 할 수 없습니다. functionone.setOptions()? 그것은 그 수업 내에서만 내부적으로 적용되는 목적입니까? – anthonypliu

+0

컨텍스트가 없으면 'this'가 가리키는 내용이 명확하지 않습니다.현재 클래스를 가리 키지 않아도됩니다. $ ('div')로 표시 한 것처럼 div를 가리키고 있습니다. 따라서이 코드는 diff에 setOptions 메소드를 추가하므로 $ ('div'). setOptions()를 수행 할 수 있습니다. functionone.setOptions()와 같은 함수 내에서 함수를 호출 할 수 없습니다. – Sjoerd

관련 문제