什麼可能是使用jQuery.extend重寫函數的原因？

Question

我正在尋找擴大引導插件的正確方法，並發現了這樣的回答：https://stackoverflow.com/a/12689534/1276032

什麼困擾我，是最後一節 - 初始化覆蓋。下面複製的代碼：

// override the old initialization with the new constructor 
$.fn.modal = $.extend(function(option) { 

    var args = $.makeArray(arguments), 
     option = args.shift(); 

    return this.each(function() { 

     var $this = $(this); 
     var data = $this.data('modal'), 
      options = $.extend({}, _super.defaults, $this.data(), typeof option == 'object' && option); 

     if (!data) { 
      $this.data('modal', (data = new Modal(this, options))); 
     } 
     if (typeof option == 'string') { 
      data[option].apply(data, args); 
     } 
     else if (options.show) { 
      data.show.apply(data, args); 
     } 
    }); 

}, $.fn.modal); 

我不明白爲什麼$ .extend在這種情況下使用 - 它有一定的效果，我沒有看到？如果我執行此代碼：

var f1 = function(){console.log(1);}; 
var f2 = function(){console.log(2);}; 
var f2 = $.extend(f1,f2); 
f2(); 

然後只有1被打印到控制檯，並且f1等於f2。所以，看似簡單assingnment會做，

$.fn.modal = function(option) {...} 

但也許我錯過了什麼......

Answer 1

您需要更改此：

$.fn.modal = $.extend(function(option) { 
    // your code ... 
}, $.fn.modal); 

此：

$.extend($.fn.modal, function(option) { 
    // your code ... 
}); 

TL; DR

$.extend(a, b)個拷貝b上一個（修改它的內容）的內容，並且如果任何重複的，那麼的b遺體的性質。此外，它返回值a。

所以，如果你有這樣的：

hello = { unique_on_hello: 'hola', message: 'hello message' } 
world = { unique_on_world: 'mundo', message: 'WORLD MESSAGE' } 
response = $.extend(hello, world) 

每一個值將是：

hello // {unique_on_hello: "hola", message: "WORLD MESSAGE", unique_on_world: "mundo"} 
world // {unique_on_world: "mundo", message: "WORLD MESSAGE"} 
response // {unique_on_hello: "hola", message: "WORLD MESSAGE", unique_on_world: "mundo"} 

所以，如果你做f2 = $.extend(f1,f2);相同：

$.extend(f1, f2) // Copy properties of f2 to f1 
f2 = f1 

來源：https://api.jquery.com/jquery.extend/