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。