jQuery.fn.extend(object);和jQuery.extend(object); 的理解

$.extend是直接把函數掛載在jQuery函數體上 這在代碼中直接反映便是$.函數名不需要實例化便可訪問即使實例化反而訪問不到(類級別),而$.fn.extend函數 是把函數掛載在jQuery對象上 這在代碼中的直接表現就是$(dom).函數名 也就是說必須實例化jQuery對象之後才能調用(對象級別)。

1、類級別
類級別你可以理解爲拓展jquery類,最明顯的例子是$.ajax(...),爲jQuery類添加添加類方法,相當於靜態方法。
開發擴展其方法時使用$.extend方法,即jQuery.extend(object); 
$.extend({ 
       add:function(a,b){return a+b;} ,
       minus:function(a,b){return a-b;} 
}); 
//頁面中調用:
var i = $.add(3,2);
var j = $.minus(3,2);


// 淺層複製(只複製頂層的非 object 元素)
var newObject = jQuery.extend({}, oldObject);
// 深層複製(一層一層往下複製直到最底層)
var newObject = jQuery.extend(true, {}, oldObject);
示例:
var item={name:“olive”,age:23,address{provice:”河南”,city:”鄭州”}};
var item1={sex:”girl”,address{city:”北京”}};
var result=$.extend(true,item,item1);
var result1=$.extend(false,item,item1);
結果:
Result={name:“olive”,age:23,sex:”gril”,address:{provice:”河南”,city:”北京”}};
Result1={name:“olive”,age:23,sex:”gril”,address:{ city:”北京”}};
以上結果說明,當參數爲ture時,即爲深拷貝,當子項item1中的子項有與item中的子項相同屬性的值不一樣時,item1中子項的值會將item子項中的值給覆蓋,當子項item1的屬性跟item中的屬性不同時,會與item進行合併。
當參數爲false時,子項item1中的子項中與item中的子項屬性相同時,item1中子項的屬性值會將item中的值給完全覆蓋。


2、對象級別
對象級別則可以理解爲基於對象的拓展,如$("#table").changeColor(...); 這裏這個changeColor呢,就是基於對象的拓展了。
開發擴展其方法時使用$.fn.extend方法,即jQuery.fn.extend(object); 
$.fn.extend({
        check:function(){
              return this.each({
                   this.checked=true;
             });
        },
       uncheck:function(){
              return this.each({
                    this.checked=false;
             });
       }
});
頁面中調用:
$('input[type=checkbox]').check();
$('input[type=checkbox]').uncheck();
以上只是一些記錄,不能全部,望讀者給出建議。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章