函数参数使用默认值常见错误

1. 函数参数使用默认值与 || 赋值的区别

function log(x, y) {
  y = y || 'World';
  console.log(x, y);
}

log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello World

当参数y的值转为布尔值为true时，则将参数y的值赋值给内部变量y，若为false，则将World赋值给内部变量y。

function log(x, y = 'World') {
  console.log(x, y);
}
log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello

ES6参数赋值默认值，即使用
if (typeof y === ‘undefined’) {
y = ‘World’;
}
判断之后进行赋值
2. 解构赋值与函数参数结合

function foo({x, y = 5}) {
  console.log(x, y);
}
foo({}) // undefined 5
foo({x: 1}) // 1 5
foo({x: 1, y: 2}) // 1 2
foo() // TypeError: Cannot read property 'x' of undefined

// 防止函数foo调用时没提供参数，变量x和y就不会生成，从而报错

function foo({x, y = 5} = {}) {
  console.log(x, y);
}
foo() // undefined 5