JavaScript中链式调用及惰性调用

来源:互联网 发布:37诸神黄昏进阶数据 编辑:程序博客网 时间:2024/06/06 02:22

一、链式调用

链式调用方法有很多如angular中的http请求方法:$http.get(url).success(fn).error(fn);

1、最常见的实现方法就是return this;每次都返回当前对象

<span>function ClassA(){        this.prop1 = null;        this.prop2 = null;        this.prop3 = null;    }    ClassA.prototype = {        method1 : function(p1){            this.prop1 = p1;            return this;        },        method2 : function(p2){            this.prop2 = p2;            return this;        },        method3 : function(p3){            this.prop3 = p3;            return this;        }    }  var obj = new ClassA();    //链式调用  </span>obj.method1(1).method2(2).method(3); // obj -> prop1=1,prop2=2,prop3=3 

2、以下这种是可以不返回当前对象时采用链式方法:

function chain(obj){        var fn = function(method){            if(arguments.length <= 0){                return fn;            }            var args = Array.prototype.slice.call(arguments, 1);            obj[method].apply(obj, args);            return fn;        }        return fn;    }       function ClassB(){        this.prop1 = null;        this.prop2 = null;        this.prop3 = null;    }    ClassB.prototype = {        method1 : function(p1){            this.prop1 = p1;        },        method2 : function(p2){            this.prop2 = p2;        },        method3 : function(p3){            this.prop3 = p3;        }    }  //链式调用模拟方式  var result = chain(obj)('method1',4)('method2',5)('method3',6)();   // result -> prop1=4,prop2=5,prop3=6  

二、惰性调用

相比链式调用,惰性调用相当于多了controller进行控制;传统的链式操作格式如下,obj.job1().job2().job3(),如果想连续执行100遍job1-3,那么就要写100遍,或者用for把整个链条断开100次。所以传统链式操作的缺点很明显,函数链中都是job,不存在controller。而一旦加上controller,比如上面的需求我们用简单的惰性调用来实现,那就是obj.loop(100).job1().job2().job3().end().done()。其中loop是声明开启100次循环,end是结束当前这次循环,done是开始执行任务的标志!