一个对象构架函数
;(function(window, undefined){
"use strict";
function $(name) {//构架主函数
return new $.fn.init(name);
}
$.fn = $.prototype = {//这里prototype为了给instanceof用
constructor:,ドル
length:0,
init: function (name) {
this.name = name;
this.length = name.toString().length;
return this;
},
say: function () {
console.log(this.name);
return this;//返回this让fn支持连写,如: $().say().say();
}
}
$.fn.init.prototype = $.fn;//追加$()的扩展方法
$.extend = $.fn.extend = function () {//添加合并对象方法,如果给$添加则使用 $.方法[,()];
var target = arguments[0] || {};
var length = arguments.length;
var options;
var copy;
// extend({a:1,b:2}); 直接合并到$上;
if (length === 1) {
target = this;
}
//合并多个的时候, 合并到第一个上
for (var i = 0; i < length; i++) {
if ((options = arguments[i]) != null) {
for (name in options) {
copy = options[name]; //复制目标
if (copy !== undefined) {
target[name] = copy;
}
}
}
}
return target;//如果是合并到$上则返回,ドル否则返回第一个对象
}
$.extend({//这里扩展的都是通过 $.扩展 调用
haha: function () {
console.log("哈哈");
return this;//这里的this是$
},
each:function(obj,callback){//添加遍历方法,可遍历{}和[];
var value,
name,
length=obj.length,
isObj = length === undefined;
if(isObj) {//如果为{};
for ( name in obj ) {
if ( value = obj[name], callback.call( value, name, value ) === false ) {
break;
}
}
} else {
var i = 0;
for ( ; i < length; ) {
if ( value = obj[i++], callback.call( value, i, value ) === false ) {
break;
}
}
}
return obj;
}
});
window.$ = $;
})(window);
合并{}对象:
var a = $.extend({},{a:1,b:2,c:3},{a:2},{b:3})
for(var i in a){
console.log(i+"==="+a[i])
}
a===2
b===3
c===3
var a = {a:2,b:3};
var b = {a:3}
$.extend(a,b);
for(var i in a){
console.log(i+"==="+a[i])
}
a.a===3
a.b===3
今天看jQuery源码才发现$.each可以遍历{}对象....以前一直以为只能遍历[]于是:
$.each({a:1,b:2},function (i,n){
console.log(i+"==="+n);
});
a===1
b===2
$.fn的方法都是用在$()后的, $.extend的方法都是在$.方法 的... 他们的this也不一样~
直接 $.haha = function (){}; 用的时候直接 $.haha(); 里面的this指向的$,而 $.fn.haha= function(){};必须在$()后使用... 如:$("xxxx").haha();`
注:部分代码摘自jQuery1.8.3源码;高手请海涵
学习吧提醒:没事多看看源码吧, 可能会发现一些你意想不到的事情.且会让你使用他会更加的得心应手...何乐而不为呢?
本文链接:https://xuexb.com/post/176.html
-- EOF --
发表于 2013年08月21日 16:20:01 ,添加在分类 前端技术 下 ,最后修改于 2017年04月25日 23:03:49
提醒: 本文最后更新于 3182 天前,文中所描述的信息可能已发生改变,请谨慎使用。
Comments
注:如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理。