jQuery.extend()详解

jQuery.extend()方法作用是，用一个或多个其他对象来扩展一个对象。
通常使用格式如下：
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);

此时控制台输出的合并后的dest如下：
图片描述

注意到jQuery.extend()方法是会改变被拓展的对象的，如果不想改变原对象，可以把第一个参数设置为{}。
在本文的开头有提到过jQuery.extend()方法拓展的是对象，其实在JS里面数组也是对象，如：

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

控制台输出的dest为：
图片描述

此时会把数组的索引值当做属性进行合并。
如果该方法里面两个参数都是数组呢？

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

控制台输出的dest为：
图片描述

如果jQuery.extend()方法省略了dest参数，则表示将src合并到jQuery全局对象中去。示例如下：

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

$.extend({
    test2:'hello world'
        });
alert($.test2);  //弹出hello world

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

本文转载于:猿2048➭https://www.mk2048.com/blog/blog.php?id=hhhkjh2k0bb

猜你喜欢