在 ES6 中，我们可以使用默认参数赋值来简化函数的编写。但是在使用默认参数赋值时，需要注意一些细节问题，否则可能会出现一些意外情况。本文将详细介绍 ES6 默认参数赋值的问题及其解决办法，并给出示例代码以方便理解。
默认参数赋值的问题
ES6 中的默认参数赋值，在函数定义时可以直接赋初始值，例如：
function test(a = 1, b = 2) {
console.log(a, b);
}这样在函数调用时，如果没有传入参数，则会使用默认值：
test(); // 1, 2
但是如果传入了 undefined 参数，则默认值不会起作用，仍然将 undefined 赋给变量：
test(undefined, 3); // 1, 3
这一点需要注意，如果默认值是一个对象时，更容易出现问题。例如：
function test2({ a = 1, b = 2 }) {
console.log(a, b);
}
test2({ a: 3 }); // 3, 2这里对象的解构赋值使用了默认参数赋值，a 的默认值是 1，b 的默认值是 2。但是当传入 { a: 3 } 参数时，b 并没有被赋值为默认值，而是变成了 undefined。
解决方法
出现这个问题的原因是当传入 undefined 参数时，ES6 只会认为是未传参而不是使用默认值。因此，我们可以在函数体内手动判断参数值是否一致来进行处理。
方法一
一种解决方法是判断参数值是否等于 undefined，例如：
-- -------------------- ---- -------
-------- ------ - - -- - - - - - --- -
-- -- --- ---------- -
- - --
-
-- -- --- ---------- -
- - --
-
-------------- ---
-
------- -- -- -
------ -- - --- -- -- -这里我们在函数参数中使用了默认值 { a = 1, b = 2 } = {}，将默认值都设为空对象。然后在函数体内判断参数值是否等于 undefined，如果是则手动赋值为默认值。
方法二
另一种解决方法是使用函数的 arguments 对象，例如：
-- -------------------- ---- -------
-------- ------ - - -- - - - -- -
-- ----------------- --- - -- ----------------- --- - -- ------ ------------ --- ---------- -
- - --
- - --
-
-------------- ---
-
------- -- -- -
------ -- - --- -- -- -这里我们利用了函数的 arguments 对象来判断传入参数的个数和类型。如果参数个数为 0 或者只有一个参数且类型是对象，则手动赋值为默认值。
总结
ES6 中的默认参数赋值虽然方便，但也需要注意一些坑点。当默认值是对象时，更容易出现问题。解决方法可以手动判断参数值是否一致来进行处理，可以使用上述两个方法之一。通过本文的介绍，相信读者已经了解了 ES6 中默认参数赋值的问题及其解决办法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65193afc95b1f8cacd16e494