JS：函数的参数的默认值

Question

在一些语言中，你可以为函数的参数设置默认值：

function Foo(arg1 = 50, arg2 = 'default') { 
    //... 
} 

你如何做到这一点在JavaScript？

Answer 1

在JavaScript中，任何未设置的值都会给出值undefined。这意味着，如果你想为一个功能设置默认值，你的第一线需要做个检查，看看如果这些值没有定义：

function Foo(arg1, arg2) { 
    if (typeof(arg1) === "undefined") { arg1 = 50; } 
    if (typeof(arg2) === "undefined") { arg2 = "default"; } 
} 

您可以采取一些捷径，如果你大致知道这些值是什么：

function Foo(arg1, arg2) { 
    arg1 = arg1 || 50; 
    arg2 = arg2 || "default"; 
} 

但是，如果这些参数是虚假的，它们将被替换。这意味着，如果Arg1为空字符串，null，undefined，false或0它会被改为50，所以要小心，如果你选择使用它

Answer 2

你将不得不做，在函数体：

function Foo(arg1 ,arg2) { 
    if(typeof arg1 === 'undefined') 
     arg1 = 50; 

    if(typeof arg2 === 'undefined') 
     arg2 = 'default'; 
    //... 
} 

另一种方式来测试他们undefined或null是这样的：

function Foo(arg1 ,arg2) { 
    if(arg1 == undefined) 
     arg1 = 50; 

    if(arg2 == undefined) 
     arg2 = 'default'; 
    //... 
} 

有些人不喜欢它，因为因为它只是一个全局属性，所以可以覆盖undefined的值。只要它没有被覆盖，这将工作正常。如果参数是null或undefined，它们将被设置为默认值。

Answer 3

我更喜欢== null检查，而不是typeof(arg1) === undefined（如jQuery的库在内部：http://docs.jquery.com/JQuery_Core_Style_Guidelines#JSLint）。它不仅更简洁，而且还处理null和undefined，因此客户端代码可以通过null并获取默认应用。

也可以将函数包装在提供默认值的另一个函数中。 prototypejs库有一个提供argumentNames()的函数（或者如果你不想使用原型，你可以借用实现 - 它只是一个应用于函数toString()的结果的正则表达式）。

所以你可以做这样的事情：

var Foo = defaults(Foo, { arg1: 50, arg2: 'default' }); 
function Foo(arg1, arg2) { 
    //... 
} 

和defaults()实施将是这个样子：

function defaults(fn, def) { 
    return function() { 
    var arg_names = fn.argumentNames(); 
    var nArgs = args.length; 
    for (var nArg = 0; nArg < nArgs; ++nArg) { 
     if (arguments[nArg] == null && arg_names[nArg] in def) 
     arguments[nArg] = def[arg_names[nArg]]; 
    } 
    fn.apply(this, arguments); 
    } 
} 

当然，这是未经测试的代码，它的表述方式，它需要Prototype库。但是，所有的说，在函数内部的== null的做法是更自然的Javascript，更容易调试（你没有其他的功能层到步），我觉得它更容易阅读：

function Foo(arg1, arg2) { 
    if (arg1 == null) arg1 = 50; 
    if (arg2 == null) arg2 = 'default'; 
} 

Answer 4

如ES2015（ES6）的，默认参数可以设置像这样：

function multiply (a, b = 2) { 
    return a * b; 
} 
multiply(5); // 10