jQuery.extend()詳解

hellowoody 發(fā)布于2019-08-01 16:24 / 3283人閱讀

摘要：方法作用是，用一個(gè)或多個(gè)其他對(duì)象來擴(kuò)展一個(gè)對(duì)象。通常使用格式如下上述代碼含義是將合并到中，并返回。如果該方法里面兩個(gè)參數(shù)都是數(shù)組呢控制臺(tái)輸出的為如果方法省略了參數(shù)，則表示將合并到全局對(duì)象中去。

jQuery.extend()方法作用是，用一個(gè)或多個(gè)其他對(duì)象來擴(kuò)展一個(gè)對(duì)象。
通常使用格式如下：
jQuery.extend(dest,src1,src2,src3...);
上述代碼含義是：將src1、src2、src3合并到dest中，并返回dest。
示例：

    var dest = {name:"zhu",age:"15"};
    var src1 = {name:"zhang",age:"18"};
    var src2 = {name:"zhou",age:"25"};
    var src3 = {num:15,city:"hongkong"};
    var src4 = {grade:98,course:"math"};
    $.extend(dest,src3,src4);
    console.log(dest);

此時(shí)控制臺(tái)輸出的合并后的dest如下：

注意到j(luò)Query.extend()方法是會(huì)改變被拓展的對(duì)象的，如果不想改變?cè)瓕?duì)象，可以把第一個(gè)參數(shù)設(shè)置為{}。
在本文的開頭有提到過jQuery.extend()方法拓展的是對(duì)象，其實(shí)在JS里面數(shù)組也是對(duì)象，如：

var dest = {name:"zhu",age:"15"};
var src = [1,2];
$.extend(dest,src);
console.log(dest);

控制臺(tái)輸出的dest為：

此時(shí)會(huì)把數(shù)組的索引值當(dāng)做屬性進(jìn)行合并。
如果該方法里面兩個(gè)參數(shù)都是數(shù)組呢？

var dest = [1,2];
var src = [3,4];
$.extend(dest,src);
console.log(dest);

控制臺(tái)輸出的dest為：

如果jQuery.extend()方法省略了dest參數(shù)，則表示將src合并到j(luò)Query全局對(duì)象中去。示例如下：

$.extend({
    test1:function(){alert("hello world");}
        });
$.test1();  //彈出hello world

$.extend({
    test2:"hello world"
        });
alert($.test2);  //彈出hello world

需要注意的是，jQuery.fn.extend(object)是擴(kuò)展 jQuery 元素集來提供新的方法（通常用來制作插件），不要和jQuery.extend()方法弄混淆。