昨天在研究繼續研究JS外掛的時候注意到了extend這個函式，然後就用幾個示例去加深對它的印象，不過在過程中對於deep這個引數產生了疑惑。當jq1.1.4版本後extend這個函式增加了一個引數deep，用來進行選擇是否深拷貝，深淺拷貝這裡我就不說了，這裡直接用例子來看一下

給出3個例子，大家應該就明白了：

1.我們可以發現當我們去改變a中的age值的時候，b中改變

var a = {tom: { age: 15 }};
var b = { tom: { age: 14 } }
extend(a, b);
a.tom.age = 25;
console.log(a.tom.age); //25
console.log(b.tom.age);//25
 

2.我們可以發現當我們去改變a中的age值的時候，b中沒有改變

var a = {tom: { age: 15 }};
var b = { tom: { age: 14 } }
extend(true,a, b);
a.tom.age = 25;
console.log(a.tom.age); //25
console.log(b.tom.age);//14

3.我們可以發現當我們去改變a中的age值的時候，b中沒有改變

var a = {tom: { age: 15 }};
var b = { tom: { age: 14 } }
extend(false,a, b);
a.tom.age = 25;
console.log(a.tom.age); //25
console.log(b.tom.age);//14
 

我們可以發現3個例子的區別就是第一個引數deep是否存在和為true和false，而且第一個例子是淺拷貝，第二個和第三個都是深拷貝

這裡可以有2個結論：

1.這個函式預設就是淺拷貝

2.傳true和false都是深拷貝

一開始對於第2個結論很不理解，講道理true為深拷貝，那麼false肯定為淺拷貝呀，為什麼都一樣呢？在網上查了很多資料，發現還是不明白，後來去官網查了一下知道(證明以後我們查東西還是去官網比較靠譜，網上很多部落格都是斷章取義)，第一個引數不能為false。https://api.jquery.com/jquery.extend/  （可以去看中文的文件，也可以用chrome瀏覽器翻譯）

Warning: Passingfalse for the first argument is not supported.

原來不能傳false，之所以這樣是我們一直都是慣性思維，理解true為深，那麼false肯定為淺咯~   -。-（慣性思維害死人，我還一直糾結為什麼會這樣）

其實到這裡我們都是知其然，不知其所以然，在糾結這個問題的過程中，我查了原始碼，終於知道其所以然了。

target =  arguments [ 0 ] | | { }  

 //就是這一句話~(大家可以定位到這句話)，它是把這個函式的第一個引數傳遞給target，最重要的是這裡用了一個 | | 或，如果當我第一個是假的話就直接賦值一個空物件給target，這樣就可以理解，為什麼我們可以傳true不能傳false了，當我們傳true的時候為真，它就直接把true給它了，當我傳false的時候為假，它就會把一個空物件給target。

因為上面這個條件，我們就可以解釋為什麼當進行後面那個判斷時，我傳false會進不去的原因了，就是因為typeof (target)為object！！！！！

if ( typeof (target) === "boolean" ) {//如果第一個引數是boolean型別，則將該引數賦給deep，即是否深拷貝
        deep = target;
         target = arguments[1] || {};

 // skip the boolean and the target 
         i = 2;
     }

然後再看一個例子：

var empty={};
var a = {tom: { age: 15 }};
var b = { tom: { age: 14 } }
extend(empty,a,b);
empty.tom.age = 25;
console.log(empty.tom.age);//25
console.log(a.tom.age); //15
console.log(b.tom.age);//25

我們可以發現，當我們去淺拷貝的時候，它只是會影響到最後一個物件的引數，這個也可以理解，因為後面的引數會覆蓋前面的，所以淺拷貝的時候，最後被合併的物件（empty）引用的是最後一個引數物件( b )的屬性。

所以當我們對外掛引數進行覆蓋的時候最好用這種方式：

第一個引數為true,第二個引數為空物件，就是為了不讓其他物件的值被覆蓋掉。

var empty={};
var a = {tom: { age: 15 }};
var b = { tom: { age: 14 } }
empty=extend(true,{},a,b);
empty.tom.age = 25;
console.log(empty.tom.age);//25
console.log(a.tom.age); //15
console.log(b.tom.age);//14

最後附上別人對這個函式的原始碼解析：

jQuery.extend = jQuery.fn.extend = function() {
    /*
        傳入的物件分為擴充套件物件和被擴充套件物件
    */
    var options, name, src, copy, copyIsArray, clone, //
        target = arguments[0] || {},    //被擴充套件的物件
        i = 1,                          //設定擴充套件物件的起始值，預設從第二項開始
        length = arguments.length,      //傳遞引數的個數，以便下面迴圈擴充套件物件使用
        deep = false;                   //預設淺複製

    /*
        處理深層拷貝或淺拷貝情況
        extend(Boolean,src1,src2..srcN);
    */
    if ( typeof target === "boolean" ) {

        deep = target;  //將deep設為target，此時target為傳進來的Boolean值，true or false；

        target = arguments[ i ] || {};  //重新設定被擴充套件物件，為引數的第二項

        i++;    //重設擴充套件物件的起始值，從第三項開始
    }

    /*
        被擴充套件的不是物件或函式，可能是String，Number或其他；
        extend("",src1,src2...srcN);
    */

    if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
        target = {}; //重新設定target的值為空物件
    }

    /*
        當只傳入一個物件
        extend(src1);
        將target設為jQuery物件或者jQuery.prototype，來擴充套件jQuery靜態屬性方法或是例項屬性方法
        $.extend(src1);   //擴充套件jQuery物件
        $.fn.extend(src1) //擴充套件jQuery.prototype
    */
    if ( i === length ) {
        target = this;
        i--;    //重設擴充套件物件起始值，從第0個開始
    }

    /*
        被擴充套件物件和擴充套件物件所有情況處理完畢，開始迴圈進行拷貝
        對從i開始的多個引數進行遍歷
    */

    for ( ; i < length; i++ ) {
        
        if ( (options = arguments[ i ]) != null ) {  //只處理有定義擴充套件物件
            //擴充套件基本物件
            for ( name in options ) {       //迴圈每一項擴充套件物件
                src = target[ name ];       
                copy = options[ name ];     

                // 防止迴圈引用，window === window.window.window
                if ( target === copy ) {
                    continue;
                }

                /*
                    物件或陣列做深拷貝
                    deep：判斷是否要深拷貝
                    copy:保證copy存在
                    jQuery.isPlainObject：判斷copy是否是一個純粹的物件，通過{} 或 new Object 建立
                    jQuery.isArray:判斷是否為陣列
                */
                if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {
                    //為陣列
                    if ( copyIsArray ) {
                        copyIsArray = false; //設為false，以便下次再重新判斷是否為陣列
                        clone = src && jQuery.isArray(src) ? src : [];  //設定clone為一個數組

                    } else {
                        clone = src && jQuery.isPlainObject(src) ? src : {}; //設定clone為一個物件
                    }

                    //遞迴深度拷貝
                    target[ name ] = jQuery.extend( deep, clone, copy );

                //過濾未定義的值
                } else if ( copy !== undefined ) {
                    target[ name ] = copy;
                }
            }
        }
    }

    //返回修改後的物件
    return target;
};