$.extend与$.fn.extend的定义与区别，以及extend的深浅拷贝

$.extend　　　　//扩展工具方法

$.fn.extend　　 //扩展实例方法

 

$.extend = function(){

　　a:function(){

　　　　alert(1);

　　},

　　b:function(){

　　　　alert(2);

　　}

}

$.a();

$.b();

//即添加了一个工具，能够直接调用。

$.extend() -> this -> (指向的$这个对象)$ -> this.a -> $.a();//至关于在一个$对象里面添加一个a的方法，就能够直接在这个对象里面调用。

 

$.fn.extend = function(){

　　a:function(){

　　　　alert(3);

　　},

　　b:function(){

　　　　alert(4);

　　}

}

$().a();

$().b();

//即添加了一个实例方法，须要有具体的实例才能调用。

$.fn.extend() -> this  -> (指向的原型)$.fn -> this.a -> $().a();//至关于在原型面添加一个a的方法，所以就须要在new出来的一个对象里面调用。

 

*$.extend还具备深拷贝与浅拷贝功能。

浅：

var a = {};

var b = {name:"hello"}

$.extend(a,b);//a继承 基本类型的 b时，能够保存实际值在变量中，所以b里面不会变。

a.name = "hi";

console.log(b.name);//hello

 

var c = {};

var d = {name:{age:30}}

$.extend(c,d);//c继承 不为基本类型的 d时，只是一个引用，所以b里面也会跟着变。

c.name.age = 20;

console.log(d.name);//20

深：

var e = {};

var f = {name:{age:30}}

$.extend(true,e,f);//第一个变量为true的时候 就是深度拷贝，它开辟了新内存，而后逐一拷贝原有的内容，所以不会改变f中的name

e.name.age = 20;

console.log(f.name);//30

 

总结：

var obj = { a:1, arr: [1,2] }; var obj1 = obj; //浅复制 var obj2 = deepCopy(obj); //深复制

由于JavaScript存储对象都是存地址的，因此浅复制会致使 obj 和 obj1 指向同一块内存地址，大概的示意图以下。而深复制通常都是开辟一块新的内存地址，将原对象的各个属性逐个复制出去。以下图所示：