在一行中調用某些方法

Question

我使用JavaScript構建對象源。
有什麼辦法來調用一個行一些方法是這樣的：

var x = new object("aaa").method_a().method_b().method_c(); 

Answer 1

如果你想鏈函數調用的，你需要從功能

function method_a(){ 
    // do something 
    return this; 
} 

同爲其他函數返回this -

那麼你可以做var x = new object("aaa").method_a().method_b().method_c();

Answer 2

做到這一點的方法是讓每個m方法返回對象本身。例如：

function Person() {}; 

Person.prototype.setName=function(n){ 
    this.name=n; 
    return this; 
} 

Person.prototype.setAge=function(a) { 
    this.age=a; 
    return this; 
} 

var p= new Person().setName("John").setAge(20); 

明顯的小問題，就是你不能這樣做，如果該方法返回任何其他值

Answer 3

如果你的對象不支持（你可以制定者，但不與干將做）流體界面，您可以隨時換行功能，在它的上面：

function FluidWrapper(obj) 
{ 
    var o = {}; 

    for (var p in obj) { 
    if (typeof obj[p] == 'function') { 
     o[p] = function(method) { 
     return function() { 
      obj[method].apply(obj, [].slice.call(arguments, 0)); 
      return o; 
     }; 
     }(p); 
    } 
    } 

    return o; 
} 

var x = new object("aaa"); 
FluidWrapper(x).method_a().method_b().method_c(); 

Demo

Answer 4

雖然穆罕默德·阿迪爾的回答是最常見的小號cenario，我覺得可能性還沒有被正確地探索。

函數返回一個值。在JavaScript中，您可以調用除null和undefined之外的任何值的方法。這意味着，這是完全可以接受的：

var x = 987654321; 
var y = x.toString().split('').sort().join('0'); 

在這種情況下，

• 的toString()方法被調用多項誰的內在價值是987654321並返回一個字符串。
• split('')方法在內部值爲'987654321'的String上調用並返回一個Array。
• sort()方法在包含以下值的數組上調用：['9','8','7','6','5','4','3','2','1']並返回相同的數組（但已排序）。
• join('0')方法在同一個Array上調用，但保存值['1','2','3','4','5','6','7','8','9']並返回一個字符串。
• 最後，在所有這些操作之後，y包含值'10203040506070809';

因此，鏈式方法所採取行動的對象不必是相同的，只要您知道該對象的每一步都是如此。

當你有一個對象調用方法，在該方法this將引用該對象。所以，如果你return this;，那麼該對象的另一種方法可以後來調用。

---

重要的是要指出，有時候你想要返回一個相同類型的新對象，而不是改變對象並返回它。鏈接時兩者效果都很好，但不同時結果不同。請看下面的jQuery的例子：

var divs = $('div'); // all divs on the page 
var marked = divs.filter('.marked'); // all marked divs on the page 
marked.css('color', 'red'); // make marked divs red 

因爲filter方法返回一個新的jQuery對象，初始的div變量仍然包含頁面上所有的div。如果過濾器方法從jQuery對象中消除了它被調用並返回的東西，那麼div將指向與標記相同的對象，因此不再擁有頁面上的所有div。 從鏈的角度來看，沒有這兩個潛在的實現之間改變（除了一些扔掉的對象）：

$('div').filter('.marked').css('color', 'red');