zoukankan      html  css  js  c++  java
  • 关于jq中的$.extend()跟$.fn.extend()区别

    一、$.extend()的用法

      1.为扩展jQuery类本身,为自身添加新的方法。

      $.extend({

      min:((a,b) => a > b ? b : a ),

      max:((a,b) => a > b ? a : b )

      })

      $.min(3,5) //它是跟$.each一样,属于工具方法

        2.对象的扩展

      a.这个用法跟ES6的Object.assign()方法类似,扩展或复制一个对象,看例子

      var obj1 = {a:1,b:2}

      var obj2 = {c:5,a:4}

      $.extend({},obj1,obj2) //{a: 4, b: 2, c: 5}

      

      b. extend()第一个参数boolean代表是否进行深度拷贝,一般默认false,可以省略不写。为true代表深度拷贝

      

      var result1=$.extend( true, {},
        { name: "John", location: {city: "Boston",county:"USA"} },
        { last: "Resig", location: {state: "MA",county:"China"} }
      );
      console.log(111,result1)//
      var result2=$.extend( {},
        { name: "John", location: {city: "Boston",county:"USA"} },
        { last: "Resig", location: {state: "MA",county:"China"} }
      );
      console.log(222,result2)
      

      可以看到第一个参数为false的时候,对象直接被覆盖,为true的时候,对象是被合并了。

    二、$.fn.extend()把对象挂载到了jq的原型(jQuery.prototype)上,为jq实例添加方法

      (function($){
        $.fn.extend({
          speak:function(){
            alert("how are you!");
          }
        });
      })(jQuery);
      <div id="div">测试</div>
      $('#div').speak()
     
      大部分插件都是用jQuery.fn.extend()
  • 相关阅读:
    python函数函数嵌套分析步骤与递归函数
    解决Navicat运行sql文件报错:1292
    SOAP与REST,有什么不同?
    bcrypt vs crypto vs cryptojs
    bcryptjs加密如何工作
    AOP(面向切面编程)
    javascript语言搞笑图
    js中函数声明先提升还是变量先提升
    CSS的单位及css3的calc()及line-height百分比
    Vue 项目性能优化 — 实践指南(网上最全 / 详细)
  • 原文地址:https://www.cnblogs.com/woniubushinide/p/11227458.html
Copyright © 2011-2022 走看看