首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 软件管理 > 软件开发 >

Javascript面向对象之4链式调用-《javascript设计模式》笔记

2012-08-28 
Javascript面向对象之四链式调用-《javascript设计模式》笔记1.链式调用:jquery可能是目前大家最常用到的js

Javascript面向对象之四链式调用-《javascript设计模式》笔记

1.链式调用:
jquery可能是目前大家最常用到的js框架了,也习惯了如下的调用方式:
$('.someclass').show().css('xxx','xxxx').click(function(){}).xxx……
这种调用方式就叫做链式调用,也就是说在调用一个方法之后,可以使用方法的返回值来继续进行方法调用。

2.如何实现链式调用:
了解了什么是链式调用,我们再来看如何实现链式调用,从1中所述我们应该知道链式调用的关键在于方法的返回值,只要方法的返回值都是调用该方法的对象,那么,我们就可以实现链式调用了,我们仿照jquery,使用$作为对象的选择器:

(function(){

??function _$(els){

this.elements = [];

for(var i=0, len=els.length;i<len;i++){

??var elements = els[i];

??if(typeof element = ‘string’){

????element = document.getElementByIdx_x_x(element);

}

}

this.elements.push(element);

}

_$.prototype = {

??each:function(fn){

????for(var i=0,len=this.elements.length;i<len;i++){

??????fn.call(this, this.elements[i]);

}

return this;

},

setStyle: function(prop, val){

……

},

show:function(){

……

},

……

}

window.$ = function(){

??return new _$(arguments);

}

})();

上面的代码就实现了一个简单的链式调用对象,并且使用一个_$作为$的别名,以防止$被其他代码改写而导致整个对象的定义丢失。

热点排行