$ .extend() with functions

Question

예를 들어 플러그인을 적용한 <select>에서 옵션을 선택하면 실행되는 콜백 함수가 필요한 jQuery 플러그인을 작성하고 있습니다.

난 당신이 옵션의 기능을 정의 할 수 있습니다 플러그인이 같이 전달할 본 적이 :

$('div.foo').pluginBar({ 
    option1: 'red', 
    someEvent: function() { 
     // Do stuff 
    } 
}); 

내 플러그인 코드에서 기본 someEvent 함수를 정의 할 수 있도록하려면,하지만 경우 사용자가 전달하는 옵션에 해당 함수를 정의하면 기본 함수를 덮어 써야합니다. $.extend()으로 가능합니까? 아니면 잘못된 장소를 볼까요?

튜토리얼 plugin authoring을 보았습니다. 그러나 기본 동작을 어디서나 확장한다고 생각하지 않습니다. 내가 init: 함수를 사용하는 것에 대해 읽었지만 함수 (내부에 플러그인 네임 스페이스)를 정의하고 플러그인에 전달 된 옵션으로 변경할 수 있습니다.

Answer 1

다음은 예입니다.

Answer 2

예, 함수 값이있는 개체를 확장 할 수 있습니다.

var originalFunction = function() { 
    alert('original'); 
} 

var a = { 
    foo: 'bar', 
    func: originalFunction 
}; 

var b = { 
    foo: 'baz', 
    func: function() { 
     alert('ok'); 
    } 
}; 

var c = $.extend({}, a, b); 

c.func(); // alerts 'ok' 

자바 스크립트에서 종종 기능과 다른 값 사이에 실질적인 차이가 없다, 그래서 당신은 같은 기능을 처리 할 수 ​​있습니다 것 다른 객체 또는 데이터 유형.

(function($) { 
    $.fn.pluginBar = function(options) { 
     var settings = $.extend({ 
      someEvent: function() { 
       alert('default'); 
      } 
     }, options); 

     return this.each(function() { 
      settings.someEvent(); 
     }); 
    }; 
})(jQuery); 

$('div.foo').pluginBar({ 
    option1: 'red', 
    someEvent: function() { 
     alert('custom'); 
    } 
}); 

플러그인을 배선 할 때 someEvent를 지정하지 않으면 기본 하나가 사용됩니다

Answer 3

자바 스크립트에서 함수는 1 급 개체입니다. 의미, 당신은 당신이 다른 모든 변수와 같은 기능을 사용할 수 있습니다 :

//making an anonymous function, and assigning it to a variable 
var meep = function() { 
    return 'meep'; 
}; 

//passing a function as a parameter 
[ 'moop' ].map(meep); //['meep'] 

//assigning it in an object literal 
var weirdNoises = { 
    'meep' : meep, 

    'slarg' : function() { 
     return 'slarg'; 
    } 
}; 

weirdNoises.meep(); //'meep' 
weirdNoises.slarg(); //'slarg' 

//you can also return functions 
function meeper() { 
    return meep; 
} 
function slarger() { 
    return function() { 
     return 'slarg'; 
    }; 
} 

//meeper returns a function, so the second() means "execute the function 
// that was returned" 
meeper()(); //'meep' 
slarger()(); //'slarg' 

당신이 볼 수 있듯이, 함수는 다른 모든 값과 같다. 따라서 함수가 될 기본 옵션을 정의하고 다른 옵션처럼 재정의 할 수 있습니다.

$.fn.weirdNoise = function (options) { 
    var defaults = { 
     makeNoise : function() { 
      return 'Rabadabadaba'; 
     }, 
     isSilly : true 
    }; 

    return $.extend(defaults, options); 
}; 

var raba = $('foobar').weirdNoise().makeNoise(); 
raba.makeNoise(); //'Rabadabadaba' 
raba.isSilly; //true 

var shaba = $('foobar').wierdNoise({ 
    makeNoise : function() { 
     return 'Shabadabadoo'; 
    } 
}); 
shaba.makeNoise(); //'Shabadabadoo' 
shaba.isSilly; //true 

실례지만, 그 점을 보여줍니다.