jQuery中extend方法

$.extend
用一个或多个其他对象来扩展一个对象，返回被扩展的对象。
参数类型1：只传入一个对象就是对jQuery的工具方法进行扩展。

$(function(){
$.extend({
console: function(sMsg){
console.log(sMsg);
}
});
$.console('jQuery');// jQuery
});

参数类型2：传入多个对象就是对第一个对象进行扩展。

$(function(){
var oTarget = {};

$.extend(oTarget, {name: 'hum'});
console.log(oTarget.name); // hum

$.extend(oTarget, {name: 'hum'}, {age: 20});
console.log(oTarget.age); // 20

$.extend(oTarget, {name: 'hum'}, {name: 'tyx', age: 20});
console.log(oTarget.name); // tyx 同名属性会被覆盖

// 注意：$.extend()的返回值都是被扩展的对象
});

参数类型3：第一个参数是布尔值，后面多个对象。

　　如果第一个参数为true，那么会深拷贝；

　　如果第一个参数为false，进行的是浅拷贝(默认情况是浅拷贝)，返回结果和没有布尔参数时一样，但是目标对象的值不会改变(其他情况目标对象和返回结果是同一个对象)。

$(function(){
var oTarget = {courses: {math: 100, english: 80}};
console.log($.extend(oTarget, {name: 'hum', courses: { math: 50, chinese: 99}}));// {name: 'hum', courses: { math: 50, chinese: 99}}
console.log(oTarget); // {name: 'hum', courses: { math: 50, chinese: 99}}

var oTarget = {courses: {math: 100, english: 80}};
console.log($.extend(false, oTarget, {name: 'hum', courses: { math: 50, chinese: 99}}));// {name: 'hum', courses: { math: 50, chinese: 99}}
console.log(oTarget); // {courses: { math: 100, english: 80}}

var oTarget = {courses: {math: 100, english: 80}};
console.log($.extend(true, oTarget, {name: 'hum', courses: { math: 50, chinese: 99, english: 80}}));// {name: 'hum', courses: { math: 50, chinese: 99, english: 80}}
console.log(oTarget); // {name: 'hum', courses: { math: 50, chinese: 99, english: 80}}
});

深拷贝和浅拷贝的区别：

　　深拷贝会让对象中的所有对象递归拷贝，目标对象和被拷贝对象之间不会存在任何引用关系；

　　浅拷贝不会让对象递归拷贝，目标对象和被拷贝对象内一层的对象类型属性相互引用。

$(function(){
var oTarget = {courses: {math: 100, english: 80}};
var oCopy = {name: 'hum', courses: { math: 50, chinese: 99}};
console.log($.extend(oTarget, oCopy));// {name: 'hum', courses: { math: 50, chinese: 99}}
console.log(oTarget); // {name: 'hum', courses: { math: 50, chinese: 99}}
console.log(oCopy.courses == oTarget.courses); // true 两个对象的courses属性指向同一个对象
oTarget.courses.chinese = 200;
console.log(oCopy.courses.chinese);// 200

var oTarget = {courses: {math: 100, english: 80}};
var oCopy = {name: 'hum', courses: { math: 50, chinese: 99}};
console.log($.extend(true, oTarget, oCopy));// {name: 'hum', courses: { math: 50, chinese: 99, english: 80}}
console.log(oTarget); // {name: 'hum', courses: { math: 50, chinese: 99, english: 80}}
console.log(oCopy.courses == oTarget.courses); // false 两个对象的courses属性不再指向同一个对象
oTarget.courses.chinese = 200;
console.log(oCopy.courses.chinese);// 99
});

$.fn.extend
该方法只传递一个对象的时候，就是对$.fn的扩展。
其他情况下和$.extend方法一样，来扩展对象。

<div>内容</div>
<script src="jQuery.js"></script>
<script>
$(function(){
$.fn.extend({
changeColor: function(){
$(this).css('color', 'blue');
}
});
$('div').changeColor();
});
</script>