在 javascript 中处理可选参数

javascript

2022-08-30 04:39:49

我有一个静态javascript函数，可以接受1，2或3个参数：

function getData(id, parameters, callback) //parameters (associative array) and callback (function) are optional

我知道我总是可以测试给定的参数是否未定义，但是我怎么知道传递的是参数还是回调？

最好的方法是什么？

可以传入的内容的示例：

1:

getData('offers');

2:

var array = new Array();
array['type']='lalal';
getData('offers',array);

3:

var foo = function (){...}
getData('offers',foo);

4:

getData('offers',array,foo);

答案 1

您可以知道有多少个参数传递给您的函数，并且可以检查您的第二个参数是否是函数：

function getData (id, parameters, callback) {
  if (arguments.length == 2) { // if only two arguments were supplied
    if (Object.prototype.toString.call(parameters) == "[object Function]") {
      callback = parameters; 
    }
  }
  //...
}

您还可以通过以下方式使用参数对象：

function getData (/*id, parameters, callback*/) {
  var id = arguments[0], parameters, callback;

  if (arguments.length == 2) { // only two arguments supplied
    if (Object.prototype.toString.call(arguments[1]) == "[object Function]") {
      callback = arguments[1]; // if is a function, set as 'callback'
    } else {
      parameters = arguments[1]; // if not a function, set as 'parameters'
    }
  } else if (arguments.length == 3) { // three arguments supplied
      parameters = arguments[1];
      callback = arguments[2];
  }
  //...
}

如果您有兴趣，请看一下John Resig的这篇文章，关于在JavaScript上模拟方法重载的技术。

答案 2

呃 - 这意味着你正在用不按正确顺序排列的参数来调用你的函数......我不会推荐。

我建议改为将对象馈送到您的函数中，如下所示：

function getData( props ) {
    props = props || {};
    props.params = props.params || {};
    props.id = props.id || 1;
    props.callback = props.callback || function(){};
    alert( props.callback )
};

getData( {
    id: 3,
    callback: function(){ alert('hi'); }
} );

好处：

您不必考虑参数顺序
您不必进行类型检查
定义默认值更容易，因为不需要类型检查
减少头痛。想象一下，如果你添加了第四个参数，你必须每次都更新你的类型检查，如果第四个或连续的也是函数呢？

缺点：

重构代码的时间

如果别无选择，可以使用函数来检测对象是否确实是函数（请参阅上一个示例）。

注意：这是检测函数的正确方法：

function isFunction(obj) {
    return Object.prototype.toString.call(obj) === "[object Function]";
}

isFunction( function(){} )