Javascript中的方法链（Method Chaining）介绍
内容摘要
在寻找如何设计一个Javascript API的时候，发现了Method Chaining这个东西，方法链，看上去似乎很强大，也挺有意思的，而这个东西也是过去我们经常看到的。。
Javascript Method Chai
Javascript Method Chai
文章正文
在寻找如何设计一个Javascript API的时候，发现了Method Chaining这个东西，方法链，看上去似乎很强大，也挺有意思的，而这个东西也是过去我们经常看到的。。
Javascript Method Chaining
在维基百科上有这样的解释:
Javascript 高阶函数 的时候，说到的print('Hello')('World')，而这种用法的结果可能会变成这样子。
function f(i){
return function(e){
i+=e;
return function(e){
i+=e;
return function(e){
alert(i+e);
};
};
};
};
f(1)(2)(3)(4); //10
这是网上的一个例子，然而也是我上一次写链式调用的作法。看上去弱爆了。
var func = (function() {
return{
add: function () {
console.log('1');
return{
result: function () {
console.log('2');
}
}
}
}
})();
实际上应该在每个function都要有个return this，于是就有了:
Func = (function() {
this.add = function(){
console.log('1');
return this;
};
this.result = function(){
console.log('2');
return this;
};
return this;
});
当然我们也可以将最后的两句
var func = new Func();
func.add().result();
变成
new Func().add().result();
复制代码 代码如下:
function f(i){
return function(e){
i+=e;
return function(e){
i+=e;
return function(e){
alert(i+e);
};
};
};
};
f(1)(2)(3)(4); //10
这是网上的一个例子，然而也是我上一次写链式调用的作法。看上去弱爆了。
复制代码 代码如下:
var func = (function() {
return{
add: function () {
console.log('1');
return{
result: function () {
console.log('2');
}
}
}
}
})();
func.add().result();
实际上应该在每个function都要有个return this，于是就有了:
复制代码 代码如下:
Func = (function() {
this.add = function(){
console.log('1');
return this;
};
this.result = function(){
console.log('2');
return this;
};
return this;
});
var func = new Func();
func.add().result();
当然我们也可以将最后的两句
复制代码 代码如下:
var func = new Func();
func.add().result();
变成
复制代码 代码如下:
new Func().add().result();
其他
最后作为一个迷惑的地方的小比较:
Method Chaining VS prototype Chaining
原型链与方法链在某些方面上是差不多的，不同的地方或许在于
1.原型链是需要用原型
2.方法链则是用方法
代码注释
作者：喵哥笔记
