ES6命名参数与默认值问题：无参调用函数为何报错？

嘿，我完全懂你的困惑！毕竟Python里的命名参数+默认值用起来太丝滑了，刚转ES6的解构参数时，很容易把两种语法的逻辑搞混～

咱们先拆解一下你写的函数：

fun = ({first=1, last=1}) => (1*first+2*last)

这里的{first=1, last=1}属于对象解构赋值，它的逻辑是：要求函数必须接收一个对象参数，然后从这个对象里提取first和last属性，如果对应属性不存在，就用默认值1。但问题在于——你没给这个「对象参数本身」设置默认值！

当你调用fun()时，没有传递任何参数，函数的参数会变成undefined。而你试图对undefined进行解构操作，这在JS里是不允许的，自然就会抛出错误啦。

对比一下Python的写法：

def fun(first=1, last=1):
    return 1*first + 2*last

Python里是直接给每个参数设置默认值，参数本身就是可选的，不传的话就用默认值。但ES6的解构参数是先要求有一个对象，再从对象里取属性，两者的层级不一样。

解决办法：给整个解构参数设置默认空对象 #

只需要给解构的对象参数加一个={}的默认值，就能解决问题：

fun = ({first=1, last=1} = {}) => (1*first+2*last)
console.log("-----------")
console.log( fun({first:1, last:2}) ) // 输出 1*1 + 2*2 = 5
console.log("-----------")
console.log( fun({last:1, first:2}) ) // 输出 1*2 + 2*1 = 4
console.log("-----------")
console.log( fun() ) // 现在正常输出 1*1 + 2*1 = 3

这里的={}表示：如果调用函数时没有传参，就用空对象{}作为参数。然后对空对象解构时，因为没有first和last属性，就会触发你设置的属性默认值1，完美符合你想要的Python式命名参数效果～

另外，如果你调用fun({})（传空对象），结果也和无参调用一样，同样会使用属性的默认值哦。

内容的提问来源于stack exchange，提问作者Norfeldt