如何在 JavaScript 函數中的強制參數之間使用可選參數

Question

如何在 JavaScript 中創建一個實用函數，如下所示，其中URL是第一個參數，成功和錯誤回調將是最后一個參數（強制），中間有任意數量的可選參數

function performAction(URL, optional1, optional2, successCallback, errorCallback){
      //api call with given url and other parameters with callback
}

並且該函數應該像下面一樣調用而不會解構

performAction(url, op1, success, error);

Answer 1

使用其余參數如下：

   function varArgs (URL, ...options) {
     // Check that options has at least two values for the callbacks
     if (options.length < 2)
       throw (new Error ('varArgs : no callbacks specified'));

     // Extract last two values in options and assign to callbacks
     let cb_error = options.pop (),
         cb_success = options.pop ();

     // Verify that callbacks are indeed functions
     if (typeof cb_error != 'function' || typeof cb_success != 'function')
       throw (new Error ('varArgs : callbacks not functions!!'));

     // now process URL using options and call appropriate callback.

     // ....
}   

Answer 2

確實有兩種方法可以執行您所描述的操作，但它們都不能 100% 滿足您的要求。 . .

1) 使用必需的options數組或對象來保存可選參數

在這種方法中，除了必需的參數外，您還有一個“on call”參數來保存 0 個或多個參數：

function performAction(URL, options, successCallback, errorCallback) {...}

這將支持您想要的功能，但會強制用戶至少提供一個空Array或Object作為第二個參數：

performAction(someURL, [], function1, function2);
performAction(someURL, [foo, bar], function1, function2);
performAction(someURL, {}, function1, function2);
performAction(someURL, {foo: "abc", bar: "xyz"}, function1, function2);

2) 使用 ES6 提供的較新的“rest 參數”

這種方法允許您使任何附加參數真正可選（不需要空值），但是，其余參數必須是函數中的最后一個參數：

function performAction(URL, successCallback, errorCallback, ...options) {...}

因此，雖然您不會獲得所需參數的順序，但它會滿足您希望可選參數真正可選的願望：

performAction(someURL, function1, function2);
performAction(someURL, function1, function2, foo);
performAction(someURL, function1, function2, foo, bar, baz);

任何附加參數都將被拉到一起並存儲在一個數組中，該數組可以在函數內訪問。 在 MDN 上查看更多關於其余參數的信息。

這種方法的另一個缺點是 ES6 仍在瀏覽器中推出，因此瀏覽器尚不支持它。 你可以使用像 Babel 這樣的轉譯器來讓這些瀏覽器可以理解它，但這確實給這種方法增加了一些復雜性。

---

更新：從技術上講，還有一個第三選擇與工作arguments對象是內置的JavaScript函數（更多信息在這里上MDN），但是這會是麻煩的。 您需要使用三個必需的參數定義函數：

function performAction(URL, successCallback, errorCallback) {...}

. . . 但是然后使用（可能）比三個預期參數更多的參數調用該函數：

performAction(someURL, function1, function2);
performAction(someURL, foo, function1, function2);
performAction(someURL, foo, bar, baz, function1, function2);

然后，該函數需要以復雜的方式訪問參數。 . . 您實際上需要根據它們在arguments對象中的位置重新定義最后兩個參數值：

var argLength = arguments.length;
successCallback = arguments[argLength - 2];
errorCallback= arguments[argLength - 1];

要訪問任何剩余的值，您需要：

• 使用起始索引 1 遍歷它們並在索引小於argLength - 2遍歷它們，或
• 將arguments對象轉換為數組並將值slice分到它們自己的數組中

注意：我不推薦這種方法，但從技術上講，這是可能的。