Javascript - 将参数传递给函数

Question

我总是将参数传递给像这样的函数：

setValue('foo','#bar')

function setValue(val,ele){
    $(ele).val(val);
};

原谅这个愚蠢的例子。 但是最近我一直致力于一个有一些功能需要大量参数的项目。 所以我开始将参数作为一个对象传递（不确定这是否是正确的方法），如下所示：

setValue({
  val:'foo',
  ele:'#bar'
});

然后在功能中：

function setValue(options){

    var value = options.val;
    var element = options.ele;  

    $(element).val(value);

};

我的问题是，有更好的方法吗？ 调用这些“选项”是常见的做法（或没关系）吗？ 您是否通常需要“解包”（缺少更好的术语）选项并在函数内设置本地变量？ 我一直这样做，以防其中一个没有定义。

我真的希望不要创造坏习惯并编写一堆丑陋的代码。 任何帮助都是由我赞赏和+。 谢谢。

Answer 1

我做了完全相同的事情，除了我没有为函数内的每个选项声明一个新变量。

我认为选项是一个很好的名称，尽管我将它缩短为opts 。

我总是在函数中有一个“默认”对象，为每个可用选项指定默认值，即使它只是null 。 我使用jQuery，所以我可以使用$ .extend来合并默认值和用户指定的选项，如下所示： var opts = $.extend({}, defaults, opts);

Answer 2

我相信这是一个很好的模式。 我听说过像这样的选项对象在其他语言中被称为“构建器对象”（至少在对象创建的上下文中）。 以下是一些优点：

但是有一些陷阱。 具体来说，你的函数的用户无法指定一些选项，你的代码会窒息（请注意，这也可能发生在普通的JS函数中：用户仍然不必提供正确的参数）。 处理此问题的一种好方法是为不需要的参数提供默认值：

var value = options.val || 0;
var element = options.ele || {};  

$(element).val(value);

如果没有提供正确的参数，您也可以立即从函数返回或抛出异常。

学习如何处理构建器对象的一个很好的资源是检查jQueryUI之类的东西。

Answer 3

我意识到这个问题已经有一年了，但我认为将一个任意数量的参数传递给JavaScript函数的最简洁方法是使用数组和内置的apply方法：

fun.apply(object, [argsArray])

如果函数是fun的，那么object就是你想要执行函数的范围/上下文，而argsArray是一个参数数组（可以包含任意数量的参数来传递）。

目前的缺陷是参数必须是一个数组（文字或对象），而不是类似数组的对象，如{'arg'：6，'arg2'：“stuff”}。 ECMAScript 5将允许您传递类似数组的对象，但它目前似乎只在FireFox中工作，而不是IE9或Chrome。

Answer 4

如果你看一下jQuery实现，它会使用一个选项类来处理大多数任意数量的参数函数，所以我认为你们都很好。

另一种方法是测试arguments.length，但只有在你的参数总是以可选的顺序排列时才有效。

Answer 5

值得记住的是，所有函数都有一个名为arguments ，这个参数非常类似于JS数组（它有length但没有数组函数），它包含传入的所有参数。

如果您想传递一系列参数（例如，

function Sum() {
    var i, sum = 0;
    for (i=0; i < arguments.length; i++){
        sum+=arguments[i];
    }
    return sum;
};

如果不是这种情况，并且您只有很多参数，请按照您的描述使用params对象。

Answer 6

这种做法没有错。

“选项”看起来像任何一个好名字。

您不需要“解包”它们，但如果您将多次访问同一项，则在局部变量中引用它们会更有效，因为局部变量访问通常比属性查找更快。