前言：最近想重写一个dropdown插件，于是想到了使用jquey实现插件，于是重温了一波$.extend()的知识，然后总结了这篇笔记
正文：
- $.extend(src)
- jQuery.extend( target, object1 [, objectN ] )
该方法将src合并到jquery的实例对象中去
下面是一个例子：
var newSrc=$.extend({},src1,src2,src3...)//也就是将"{}"作为dtarget 目标参数
这样就可以将src1,src2,src3...进行合并，然后将合并结果返回给newSrc了。如下例：
var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})
那么合并后的结果,同名属性会被后面的对象所覆盖
console.log(result)
>> {name:"Jerry",age:21,sex:"Boy"}
在ES6中，实现这种方法有一种更为简单的方法,利用点扩展运算符
var person1={name:"Tom",age:21}
var person2={name:"Jerry",sex:"Boy"})
person1={...(person1),...(person2)}- jQuery.extend( [deep ], target, object1 [, objectN ] )
第一个参数boolean代表是否进行深度拷贝，其余参数和前面介绍的一致,看下面这个例子
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 );
console.log(JSON.stringify( object1 );
>>{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}经过浅拷贝后，banana属性是对象类型，属于引用类型，指向object2的banana对象，所以没有了weight属性
我们再看一下，如果是深度拷贝，则输出结果为：
$.extend( true, object1, object2 );
console.log(JSON.stringify( object1 );
>>{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}
2. $.fn.extend(src)
该方法就是将src合并到jquery的全局对象中去
jQuery.fn.extend({
check: function() {
return this.each(function() {
this.checked = true;
});
},
uncheck: function() {
return this.each(function() {
this.checked = false;
});
}
});
// Use the newly created .check() method
$( "input[type='checkbox']" ).check();扩展,进阶
利用这个函数，我们可以来写JQuery插件
var Dropdown= function(element) {
var self=this;
var target=$(element).data("target");
self.$element=$(element);
self.$target=$(target);
self.$element.on('mouseleave',function(){
self.close(self.$target);
});
self.$element.on('mouseenter',function(){
self.open(self.$target);
});
}
//定义haorooms的方法
Dropdown.prototype = {
open: function($target) {
return $target.show();
},
close:function($target){
return $target.hide();
}
}$.fn.myPlugin = function() {
//创建Dropdown的实体
var dropdown= new Dropdown(this);
}插件的使用
$(function() {
$('.dropdown').myPlugin();
})然后用一个即使匿名函数，将我们的代码包裹起来,防止污染全局环境、防止其他地方使用到了 我们自定义插件的对象。
;(function($,window,document,undefined){
//我们的代码。。
})(jQuery,window,document);