了解 JavaScript 中的默认参数以及如何使用它们。
默认参数定义
默认参数允许你设置参数的默认值。
默认情况下,JavaScript 函数的所有参数都是 undefined (未定义的)。默认参数允许你设置不同的默认值。
请考虑以下示例:
function logFirst(data){ console.log(data[0]); }
上面的例子是说,我们有一个简单的函数,打印数组中的第一个元素。该函数需要一个参数,data
,我们期望它是一个 Array 数组。但是如果没有数据传入,会发生什么?
logFirst(); // Uncaught TypeError: Cannot read property '0' of undefined // 未捕获的输入错误:无法读取 undefined 的 '0' 属性
呃哦, 我们收到一个错误。 因为 data
未被传递到我们的函数中,因此被默认为 undefined (未定义的)。
我们如何解决这个问题? 你可以实用默认参数。 要使用默认参数,只需传递 (parameter = defaultValue)
。 这里我们将参数的默认值设置为 ['cats']
数组。
function logFirst(data = ['cats']){ console.log(data[0]); }
现在当我们运行没有任何传入的函数时,data
的值将默认为数组 ['cats']
:
logFirst(); // cats
它返回默认值 cats
!最重要的是,如果我们提供一个参数,它将覆盖默认值:
logFirst(['dogs']); // dogs
您还可以在单个函数中拥有多个默认参数:
function logFirst(num = 0, data = ['cats']){ console.log(`I own ${num} ${data[0]}.`); } logFirst(); // I own 0 cats. logFirst(2); // I own 2 cats. logFirst(undefined,['dogs']); // I own 0 dogs.
PS:你如果不是用ES6语法,默认参数可以这样写:
function logNum(num){ var num = num || 1 ; // 当参数 num 为 false 时,重新赋值 num console.log( "默认参数 num : " + num ); } logNum(); // 默认参数 num : 1
这里第2行的意思是,当参数 num
为 false
时,重新赋值 num
为 1
。
最新评论
写的挺好的
有没有兴趣翻译 impatient js? https://exploringjs.com/impatient-js/index.html
Flexbox playground is so great!
感谢总结。
awesome!
这个好像很早就看到类似的文章了
比其他的教程好太多了
柯理化讲的好模糊…没懂