在寻找如何设计一个Javascript API的时候,发现了Method Chaining这个东西,方法链,看上去似乎很强大,也挺有意思的,而这个东西也是过去我们经常看到的。。
Javascript Method Chaining
在维基百科上有这样的解释:
Method chaining, also known as named parameter idiom, is a common syntax for invoking multiple method calls in object-oriented programming languages. Each method returns an object, allowing the calls to be chained together in a single statement.Chaining is syntactic sugar which eliminates the need for intermediate variables. A method chain is also known as a train wreck due to the increase in the number of methods that come one after another in the same line that occurs as more methods are chained togethe even though line breaks are often added between methods.
拿翻译工具翻译了一下:
方法链,也被称为命名参数法,是在面向对象的编程语言调用的调用多个方法的通用语法。每一个方法返回一个对象,允许电话连接到一起,在一个单一的声明。链接是语法糖,省去了中间变量的需要。方法链也被称为火车残骸中由于方法来相继发生的同一行以上的方法都锁在即使换行通常添加方法间的数量增加。
Method Chaining 使用
目测对于方法链用得最多的,应该就是jQuery了。
// chaining $("#person").slideDown('slow') .addClass('grouped') .css('margin-left', '11px');
var p = $('#person'); p.slideDown('slow'); p.addClass('grouped'); p.css('margin-left', '11px');
Javascript 方法链示例
在之前我们说到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'); } } } } })();func.add().result();
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.方法链则是用方法