关于一段es6函数参数解构的代码

Question

function f({ x = 10 } = {}, { y } = { y: 10 }) {
    console.log( x + " " + y +"
");
}

f(); // 10 10  
f( undefined, undefined ); // 10 10  
f( {}, undefined ); // 10 10  
f( {}, {} ); // 10 undefined  
f( undefined, {} ); // 10 undefined  
f( { x: 2 }, { y: 3 } ); // 2 3

希望有人能解释一下这段代码对的运行原理，关于参数解构这一块总是很迷糊

Answer 1

1. 检验传入的函数参数是否是undefined或者没有传参；

2. 对于没有传参的情况或者传入的是undefined，则查看有没有参数默认值，如果有则对参数默认值进行解构赋值

3. 如果传入的参数，则忽略参数默认值，对传入的参数进行解构赋值

4. 对于上述2,3步的解构赋值，如果解构成功则使用解构的值，如果解构失败则查看有没有解构默认值，如果有则使用解构默认值，如果没有则为undefined