function move({x=0,y=0}={}){
    return[x,y];
}
move({x:3,y:8});
move({x:3});
move({});
move();

function move({x,y}={x:0,y:0}){
    return[x,y];
}
move({x:3,y:8});
move({x:3});
move({});
move();
有什么区别

在第一段函数中

{x = 0, y = 0} = {} 是函数参数的解构赋值语法,同时{}作为默认参数值。这意味着:

  • 如果调用函数时没有提供任何参数,或者提供的参数不是一个对象,那么解构赋值会使用空对象{}作为默认值。
  • 由于xy在解构赋值时都有默认值0,因此无论传入的对象中是否包含xy属性,xy都将有确定的值(要么是传入对象中的值,要么是默认值0)。

因此,执行结果如下:

move({x: 3, y: 8}); 返回 [3, 8]

move({x: 3}); 返回 [3, 0]

move({}); 返回 [0, 0]

move(); 返回 [0, 0](因为使用了默认参数值{},然后解构赋值时xy都取默认值0

在第二段函数中

{x, y} = { x: 0, y: 0 } 是函数参数的解构赋值语法,同时{ x: 0, y: 0 }作为默认参数值。这里与第一段函数的主要区别在于解构赋值时没有为xy提供默认值。

  • 如果调用函数时没有提供任何参数,或者提供的参数不是一个对象,那么解构赋值会使用{ x: 0, y: 0 }作为默认值。
  • 但是,如果传入的对象缺少xy属性,并且没有为该属性在解构赋值时提供默认值,那么该属性的值将是undefined

因此,执行结果如下:

move({x: 3, y: 8}); 返回 [3, 8]

move({x: 3}); 返回 [3, undefined](因为y在传入的对象中不存在,且解构赋值时没有为y提供默认值)

move({}); 返回 [undefined, undefined](因为传入的是空对象,没有xy属性,且解构赋值时没有为它们提供默认值)

move(); 返回 [0, 0](因为使用了默认参数值{ x: 0, y: 0 }

本站无任何商业行为
个人在线分享 » ES6中的难点
E-->