允许javascript函数接受任意数量的参数

Question

我希望下面的函数更灵活,并接受多个回调到其他函数,如果它们在参数中定义.

$(function() {
    function icisDashBox(colorElem, thisWidth, thisHeight, completeCallBack) {
        $(colorElem).colorbox({
        transition: 'none',
        innerWidth: thisWidth,
        innerHeight: thisHeight,
        opacity: '0.5',
        onOpen: function() { 

        },
        onLoad: function() { 

        },
        onComplete:function() { 
            $('#cboxLoadedContent').wrap('<div id="icis_dialog_msg" />'); 

            completeCallBack();

        },
        onCleanup: function() { 

        },      
        onClosed: function() {
            $('#cboxLoadedContent').unwrap(); 
        }
    });
}

icisDashBox('.example9', '500', '500', completeFunction);

function completeFunction() {

    var fooClass = $("#colorbox").addClass("FOO");

    var barClass = $("#colorbox").addClass("BAR");

    var ajaxCnt = $.ajax({
        type: "GET",
        url: "http://www.payso.me.uk",
        dataType: "html",
        success: function(data) {
            $("#colorbox").addClass("AJAX SUCCESS");
        }
    });

    return {
        x : fooClass,
        y : barClass,
        z : ajaxCnt                         
    };
}

所以在一个理想的世界中,我的函数看起来像这样,没有明确声明任何参数:

function icisDashBox() { function code here }

这可能吗？此外,如果参数未定义,我该如何处理？

例如,如果对函数的一次调用定义了几个回调,而另一个只有一个回调,则有一种方法可以处理缺少回调的问题.

干杯,

:)

Answer 1

您可以使用关键字arguments,它是传递的参数的数组,如下所示:

function myFunc() {
   if(arguments.length > 0)     //be sure to check if there are any...
     var arg1 = arguments[0];
}

但是,更好的方法是接受一个对象,例如:

function myFunc(settings) {
   settings = settings || {};   //in case it was called as just: myfunc()
   var something = settings.something || "default value";
}

你这样称呼它:

myFunc({ something: "value", somethingElse: "otherValue" });

这种方法可以让你接受任何数量的参数为好,但也有任意可选,没有一堆的myFunc(null, null, null, "value")呼叫类型,只提供您需要的参数,再加上他们命名这使得很多更容易维护IMO. 这是该插件的编辑版本,用于演示此内容.

Answer 2

使用参数变量.

function TestMe()
{
   var args = arguments;

   for (var a in args)
   {
     alert(args[a]);
   }
}

现在你可以传递任意数量的参数来实现TestMe:

TestMe(1);
TestMe(1,2,3);
TestMe(1,2,3,4,5,6);
TestMe.apply(this, [1,2,3,4,5]); 

等等

Answer 3

只需遍历arguments对象:https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope/Arguments

Answer 4

感谢传播操作员，您现在可以执行以下操作

function myFunction(...params) {
  console.log(...params);
}

myFunction('Many arguments', 1, {two: 3}, ["four", 5]);

// to access one by one
function oneByOne(...params) {
  params.map(param => {
   console.log(param);   
  });
}

oneByOne('Many arguments', 1, {two: 3}, ["four", 5]);