了解myFunc（arg）.something（）格式的javascript函數調用

Question

我正在嘗試了解jQuery等其他人使用的Javascript函數的格式。

例如jQuery(arg).hide()或$("#obj").hide

我想編寫類似的格式函數，但我不知道如何。

我會寫

function myFunc(args) {
}

但我不明白第二部分，即.hide（）是函數內的函數嗎？

謝謝你的幫助

Answer 1

這稱為方法鏈接 。 實現此目的的方法是第一個函數返回一個對象，因此可以將第二個函數作為該對象上的方法調用。

進行這種編程方式的標准方法是始終返回相同類型的對象，例如，jQuery始終返回表示HTML節點集合的jQuery對象。 如果其中一個呼叫修改了集合，則下一個呼叫將在該集合上。 這就是您可以執行類似$('#myid').parent().hide(); 。 $('#myid')返回代表#myid元素的jQuery對象， .parent()返回代表#myid父元素的jQuery對象。 .hide()返回相同的對象，因此您可以根據需要在同一對象上調用另一個方法。

Answer 2

這稱為方法鏈接。 我強烈建議選擇Crockford的“ JavaScript：好的部分”。 這是一本快速閱讀的書，但很好地解釋了JavaScript中的OOP，並確定了語言的優缺點。 強烈推薦。

Answer 3

正如Skilldrick指出的那樣，這稱為方法鏈接。

最簡單的示例是一個對象，當您調用其任何方法時，該對象會自行返回：

var world = {
    'hello': function() {
        alert('Hello');
        return this;
    },
    'goodbye': function() {
        alert('Goodbye');
        return this;
    }
};
world.hello().goodbye();

這與world.hello(); world.goodbye();相同world.hello(); world.goodbye(); world.hello(); world.goodbye(); 。

jQuery的功能還不止這些。 在有效的選擇器字符串上調用jQuery或$函數將返回一個表示匹配元素的jQuery對象（它實際上不是數組，盡管您可以將其視為一個數組）。 它的大多數方法都會在修改對象后返回對象本身（例如$("a").css({...})會將更改應用於匹配元素的樣式，然后再次返回匹配元素集） 。

但一些jQuery方法允許修改你正在使用的設置（如$("a").parent()將返回一個jQuery代表匹配元素的家長對象）。 也就是說，它們不會返回相同的對象，而是行為相同的對象。

但是，如果決定使用此樣式，則必須小心，因為如果您需要一個具有自己返回值的方法（例如，如果要計算或使用getter方法），流程就會中斷。 可以通過將回調函數傳遞給該方法來避免這種情況，但是最終的編碼樣式可能會令人費解。