jQuery的$.extend方法使用

一、需求

　　項目中有多個模塊用到jQuery中的DataTable插件。開始開發時，各自使用自己的配置，導致表格的一些統一的配置被分散到各個模塊中。現想將這些統一的配置提取到公共js中，以便於方便修改統一配置（做人做事都有一個度，不是非黑即白，水至清則無魚。程序也是一樣，都想將代碼寫成統一的，但是各模塊的功能又是有區別的，所以總是統一、特性、再到統一部分）。

二、方案

　　一般像這種有配置參數的jQuery的插件（DataTable、Flot等），都會有一個默認的配置，在實現中基本都會用到$.extend方法。但是這個默認配置不一定符合我們的需求，首先大部分插件中的提示文字都是英文的，樣式等也不一定符合。所以我們要定義一個自己的通用配置，先將特殊配置和通用配置組合，再去和默認配置組合。上網搜了下，extend方法就是將多個對象里的屬性組合起來，如果同一個屬性，多個對象都有，則使用后面對象的屬性值。

　　1、先創建一個public.js，在每個模塊的頁面中引入該js。在這個js中定義一個自己的通用配置，例如TABLE_OPTION，在使用DataTable時，用以下方法組合特殊配置和通用配置：

var oTableOption = $.extend(TABLE_OPTION,{
    // 特殊配置或者需要覆蓋通用配置的屬性
});

var oTable = $("#table_id").DataTable(oTableOption);

　　使用這種方法可以實現上述需求，但是在用HBuilder時，$.extend敲出后，默認的參數列表是$.extend(true, target object, object);。

　　1)首先第一個參數是一個boolean類型，上網查了下，這個boolean表示是否深入組合，例如如下情況：

var oTarget = {
    a:1,
    b:2,
    c:{
        ca:1,
        cb:2
    }
};

var oObject = {
    a:2,
    c:{
        ca:2,
        cd:4
    },
    d:{
        da:1
    }
};


var oResult = $.extend(true,oTarget,oObject);

　　最終oResult的結果應該是

oResult = {
    a:2,
    b:2,
    c:{
        ca:2,
        cb:2,
        cd:4
    },
    d:{
        da:1
    }
};

　　即如果第一個參數是boolean類型，並且是true（默認是false），則會使用深層次的組合，否則對於例子中的c屬性，直接使用oObject對象中的c，而不會組合oTarget和oObject的c屬性。

　　2）從參數命名上看，第二個參數是target，說明可能會將后面的對象屬性直接組合到target上，即會修改target，這點肯定不適合我們的需求，如果每個人都能把TABLE_OPTION修改，到時出了問題都沒法定位時那里修改的。從網上搜了下不修改target的方法，有一個比較好的實現，其實jQuery插件也是使用這種實現。

　　var oOption = $.extend(true,{},TABLE_OPTION,{ // 新加配置});

　　就是獎target設定為一個空對象，這樣修改只會修改{}對象的內容，不會修改到TABLE_OPTION。