用apply把document当作this传入getId函数,帮助“修正”this;
document.getElementById = (function (func) { return function () { return func.apply(document, arguments); } })(document.getElementById); //调用 var getId = document.getElementById; var div = getId('div2');
类型判断
var Type = {}; for (var i = 0, type; type = ['String', 'Array', 'Number'][i++];) { (function (type) { Type['is' + type] = function (obj) { return Object.prototype.toString.call(obj) === '[object ' + type + ']'; } })(type); };
自定义事件(一):
var Event = { _listeners: {}, // 添加 addEvent: function(type, fn) { if (typeof this._listeners[type] === "undefined") { this._listeners[type] = []; } if (typeof fn === "function") { this._listeners[type].push(fn); } return this; }, // 触发 fireEvent: function(type) { var arrayEvent = this._listeners[type]; if (arrayEvent instanceof Array) { for (var i=0, length=arrayEvent.length; i<length; i+=1) { if (typeof arrayEvent[i] === "function") { arrayEvent[i]({ type: type }); } } } return this; }, // 删除 removeEvent: function(type, fn) { var arrayEvent = this._listeners[type]; if (typeof type === "string" && arrayEvent instanceof Array) { if (typeof fn === "function") { // 清除当前type类型事件下对应fn方法 for (var i=0, length=arrayEvent.length; i<length; i+=1){ if (arrayEvent[i] === fn){ this._listeners[type].splice(i, 1); break; } } } else { // 如果仅仅参数type, 或参数fn邪魔外道,则所有type类型事件清除 delete this._listeners[type]; } } return this; } };
自定义事件(二):
//自定义事件 var Event=(function () { var global=this, Event, _default='default'; Event=function () { var _listen, _trigger, _remove, _slice=Array.prototype.slice, _shift=Array.prototype.shift, _unshift=Array.prototype.unshift, namespaceCache={}, _create, find, each=function (ary,fn) { var ret; for (var i = 0, l=ary.length; i < l; i++){ var n=ary[i]; ret=fn.call(n,i,n); } return ret; }; //添加监听事件,并缓存 _listen = function (key,fn,cache) { if(!cache[key]){ cache[key]=[]; } cache[key].push(fn); }; //移除监听 _remove=function (key,cache,fn) { if(cache[key]){ //如果存在该监听事件 if(fn){ //如果存在回调函数 for (var i = cache[key].length; i >=0; i--){ if(cache[key][i]===fn){ cache[key].splice(i,1); //移除此回调函数 } } }else{ cache[key]=[]; //清除此事件(为什么存在回调函数时不执行此步骤,奇怪) } } }; //触发事件 _trigger=function () { var cache = _shift.call(arguments), //第一个参数是cache key = _shift.call(arguments), //第二个参数是key args = arguments, _self = this, ret, stack= cache[key]; if(!stack || !stack.length){ //没有回调函数则直接返回 return; } return each(stack, function () { //执行所有的回调函数 return this.apply(_self,args); }); }; //创建事件的实例 _create=function (namespace) { var namespace = namespace || _default; var cache ={}, offlineStack=[], //离线事件 ret={ listen:function (key,fn,last) { _listen(key,fn,cache); if(offlineStack===null){ return; } if(last==='last'){ offlineStack.length && offlineStack.pop()(); //如果是最后一个离线事件,触发此离线事件并移除此事件 }else{ each(offlineStack,function(){ //如果是多个离线事件,并遍历触发 this(); }); } offlineStack = null; 清空离线事件 }, //执行一次监听事件 one:function (key,fn,last) { _remove(key,cache); //此缓存中移除此事件 this.listen(key,fn,last); //添加此事件 }, remove:function (key,fn) { _remove(key,cache,fn); }, trigger:function () { var fn, args, _self=this; _unshift.call(arguments,cache); //将cache缓存添加到arguments参数集合中 args=arguments; fn=function(){ return _trigger.apply(_self,args); }; if(offlineStack){ return offlineStack.push(fn); } return fn(); //触发事件 } }; return namespace ? (namespaceCache[namespace] ? namespaceCache[namespace]: namespaceCache[namespace]= ret ) :ret; }; return { create: _create, one: function (key, fn, last) { var event = this.create(); event.one(key, fn, last); }, remove: function (key, fn) { var event = this.create(); event.remove(key, fn); }, listen: function (key, fn, last) { var event = this.create(); event.listen(key, fn, last); }, trigger: function () { var event = this.create(); event.trigger.apply(this,arguments); } }; }(); return Event; })();
方法绑定:
Function.prototype.bind = function () { var self = this, context = [].shift.call(arguments), args = [].slice.call(arguments); return function () { return self.apply( context, [].concat.call(args, [].slice.call(arguments)) ) } }
AOP:
Function.prototype.before = function(beforefn) { var _self = this; return function() { beforefn.apply(this, arguments); return _self.apply(this, arguments); } } Function.prototype.after = function(afterfn) { var _self = this; return function() { var ret = _self.apply(this, arguments); afterfn.apply(this, arguments); return ret; } }