Javascript - 将参数传递给函数

jyo*_*eph 17 javascript

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

setValue('foo','#bar')

function setValue(val,ele){
    $(ele).val(val);
};
Run Code Online (Sandbox Code Playgroud)

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

setValue({
  val:'foo',
  ele:'#bar'
});
Run Code Online (Sandbox Code Playgroud)

然后在功能中:

function setValue(options){

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

    $(element).val(value);

};
Run Code Online (Sandbox Code Playgroud)

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

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

sim*_*aun 14

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

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

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


And*_*ker 10

我相信这是一个很好的模式.我听说过像这样的选项对象在其他语言中被称为"构建器对象"(至少在对象创建的上下文中).以下是一些优点:

  • 函数的用户不必担心参数的顺序.这对于像你这样的方法需要大量参数的情况特别有用.这些很容易混淆,JavaScript不会抱怨!
  • 很容易使某些参数可选(这在编写插件或实用程序时很方便).

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

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

$(element).val(value);
Run Code Online (Sandbox Code Playgroud)

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

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