我希望JavaScript函数具有可选的参数,我在这些参数上设置了默认值,如果未定义值,则使用这些参数(如果传递了值,则忽略这些参数)。在Ruby中,您可以这样做:
def read_file(file, delete_after = false)
# code
end
这在JavaScript中有效吗?
function read_file(file, delete_after = false) {
// Code
}
我希望JavaScript函数具有可选的参数,我在这些参数上设置了默认值,如果未定义值,则使用这些参数(如果传递了值,则忽略这些参数)。在Ruby中,您可以这样做:
def read_file(file, delete_after = false)
# code
end
这在JavaScript中有效吗?
function read_file(file, delete_after = false) {
// Code
}
当前回答
从ES6/ES2015开始,默认参数在语言规范中。
function read_file(file, delete_after = false) {
// Code
}
只是起作用。
参考:默认参数-MDN
如果没有传递值或未定义,则默认函数参数允许使用默认值初始化形式参数。
在ES6中,可以通过析构函数模拟默认命名参数:
// the `= {}` below lets you call the function without any parameters
function myFor({ start = 5, end = 1, step = -1 } = {}) { // (A)
// Use the variables `start`, `end` and `step` here
···
}
// sample call using an object
myFor({ start: 3, end: 0 });
// also OK
myFor();
myFor({});
ES2015之前,
有很多种方法,但这是我的首选方法——它可以让你传递任何你想要的东西,包括false或null。(空类型==“对象”)
function foo(a, b) {
a = typeof a !== 'undefined' ? a : 42;
b = typeof b !== 'undefined' ? b : 'default_b';
...
}
其他回答
作为一名长期的C++开发人员(web开发新手:),当我第一次遇到这种情况时,我在函数定义中进行了参数赋值,就像问题中提到的那样,如下所示。
function myfunc(a,b=10)
但要注意,它在不同浏览器之间并不一致。对我来说,它在我的桌面上运行,但在android上不运行。更安全的选择,正如上面提到的那样-
function myfunc(a,b)
{
if (typeof(b)==='undefined') b = 10;
......
}
这个答案的意图不是重复其他人已经提到的相同解决方案,而是告知函数定义中的参数分配可能在某些浏览器上有效,但不要依赖它。
如果您使用的是ES6+,则可以按以下方式设置默认参数:
功能测试(foo=1,bar=2){console.log(foo,bar);}测试(5);//foo被覆盖,bar保持默认参数
如果需要ES5语法,可以按以下方式执行:
功能测试(foo,bar){foo=foo||2;bar=bar||0;console.log(foo,bar);}测试(5);//foo被覆盖,bar保持默认参数
在上述语法中,使用OR运算符。如果可以将第一个值转换为真,OR运算符总是返回第一个值,如果不能,则返回右手边的值。当在没有相应参数的情况下调用函数时,JS引擎将参数变量(在我们的示例中为bar)设置为undefined。undefined然后转换为false,因此OR运算符返回值0。
我注意到一些回答提到,使用默认参数对其他浏览器来说是不可移植的,但可以公平地指出,对于对现代JS功能支持有限的浏览器,可以使用像Babel这样的转换器将代码转换为ES5语法。
因此:
function read_file(file, delete_after = false) {
// Code
}
将被翻译成这样(在Babel REPL->中尝试https://babeljs.io/repl/):
"use strict";
function read_file(file) {
var delete_after =
arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
//Code...
}
当然,如果您无意使用转换,那么像其他人所演示的那样,在函数体中设置默认参数也是非常好的。
如果您想使用最新的ECMA6语法,请使用此选项:
函数myFunction(someValue=“这是默认值!”){console.log(“someValue-->”,someValue);}myFunction(“不是默认值”)//调用没有默认值的函数myFunction()//使用默认值调用函数
它被称为默认函数参数。如果没有传递值或未定义,它允许使用默认值初始化形式参数。注意:它不适用于Internet Explorer或较旧的浏览器。
为了获得最大可能的兼容性,请使用以下选项:
函数myFunction(someValue){someValue=(someValue==未定义)?“这是默认值!”:someValue;console.log(“someValue-->”,someValue);}myFunction(“不是默认值”)//调用没有默认值的函数myFunction()//使用默认值调用函数
这两个函数具有完全相同的行为,因为这些示例依赖于这样一个事实:如果在调用该函数时没有传递任何参数值,则参数变量将是未定义的。
未来之声
将来,您将能够将一个对象“散布”到另一个对象(目前截至2019年,Edge不支持!)-演示如何将其用于良好的默认选项,而不考虑顺序:
功能测试(选项){var选项={//默认值url:'defaultURL',some:“somethingDefault”,//使用输入选项覆盖…选项};var body=document.getElementsByTagName('body')[0];body.innerHTML+='<br>'+options.url+':'+options.some;}测试();测试({});测试({url:'myURL'});测试({some:'somethingOfMine');测试({url:'overrideURL',some:'andSomething'});测试({url:'overrideURL',一些:'andSomething',额外:'noProblem'});
MDN参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
…同时,Edge支持的是Object.assign()(IE不支持,但我真的希望我们可以将IE留在后面:)
同样,你也可以这样做
功能测试(选项){var options=对象分配({//默认值url:'defaultURL',some:“somethingDefault”,},选项);//使用输入选项覆盖var body=document.getElementsByTagName('body')[0];body.innerHTML+='<br>'+options.url+':'+options.some;}测试();测试({});测试({url:'myURL'});测试({some:'somethingOfMine');测试({url:'overrideURL',some:'andSomething'});测试({url:'overrideURL',一些:'andSomething',额外:'noProblem'});
编辑:由于对常量选项的评论-在函数的其余部分使用常量选项的问题实际上并不是你不能做到这一点,而是你不能在它自己的声明中使用常量变量-你必须将输入命名调整为
function test(input_options){
const options = {
// defaults
someKey: 'someDefaultValue',
anotherKey: 'anotherDefaultValue',
// merge-in input options
...input_options
};
// from now on use options with no problem
}