jQuery.extend与jQuery.fn.extend

johnhuster的分享

发布于 2022-03-26 16:08:05

5020

发布于 2022-03-26 16:08:05

文章被收录于专栏：johnhusterjohnhuster

基础性内容，大神可以略过，O(∩_∩)O~

1.jQuery.fn.extend用于扩展jQuery.prototype对象，可以采用这种方式为jQuery添加自定义方法

2.jQuery.extend是用于扩展一个类的功能，该函数原型为

jQuery.extend( target [, object1 ] [, objectN ] ) ] )

运行完该函数后，object1以及objectN的特性会被组合到target对象上，因此该函数会修改target对象，为了防止target对象被修改，可以传入{}，仅仅使用jQuery.extend的返回值来使用对象merge后产生的类。

如果该函数仅有一个参数传入时，功能跟jQuery.fn.extend一样，可以用于扩展jQuery原型的方法。

注：上述方法是非递归型的，也就是说object1如果有与objectN相同名字的某个属性，objectN的该属性会整个替换带哦object1的该属性，例子如下：

   var object1 = { 
     apple: 0, 
     banana: { weight: 52, price: 100 },
     cherry: 97
   };
   var object2 = {
     banana: { price: 200 },
     durian: 100
   };
  
   // Merge object2 into object1
   $.extend( object1, object2 );
  
   // Assuming JSON.stringify - not available in IE<8
   $( "#log" ).append( JSON.stringify( object1 ) );

上述程序运行产生的结果为：{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}

不过jQuery1.1.4之后增加了一个深度版的：

jQuery.extend( [deep ], target, object1 [, objectN ] )

来个例子来说明该方法的效果

    var object1 = {
      apple: 0,
      banana: { weight: 52, price: 100 },
      cherry: 97
    };
    var object2 = {
      banana: { price: 200 },
      durian: 100
    };
    // Merge object2 into object1, recursively
    $.extend( true, object1, object2 );
    // Assuming JSON.stringify - not available in IE<8
    $( "#log" ).append( JSON.stringify( object1 ) );

这段程序运行后产生结果：

{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}

The End，结束了

本文参与?腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2015-07-26 ，如有侵权请联系 cloudcommunity@tencent.com 删除

jquery

本文分享自作者个人站点/博客?前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与?腾讯云自媒体分享计划? ，欢迎热爱写作的你一起参与！

jquery

登录后参与评论

0 条评论

热度