如何为含x、y、z键的函数对象参数设置默认值？

嘿，我来帮你搞定这个问题！创建一个接收对象参数且每个属性都带默认值的函数其实很直观，我给你几种靠谱的写法，都是日常开发里常用的：

写法1：参数直接解构+兜底空对象 #

这是最简洁的写法，直接在函数参数里完成解构和默认值设置：

function calculatePosition({ x = 0, y = 0, z = 0 } = {}) {
  console.log(`坐标：x=${x}, y=${y}, z=${z}`);
}

👉 关键细节：后面的= {}是必须的！如果调用时不传任何参数（比如calculatePosition()），它会默认使用空对象，避免解构undefined时抛出错误。
测试几个调用场景：

• calculatePosition() → 输出 坐标：x=0, y=0, z=0
• calculatePosition({x: 5}) → 输出 坐标：x=5, y=0, z=0
• calculatePosition({y: 10, z: 15}) → 输出 坐标：x=0, y=10, z=15

写法2：内部解构保留原始参数对象 #

如果你需要在函数里使用完整的参数对象（比如要做额外的对象校验、合并操作），可以把解构放到函数内部：

function calculatePosition(params = {}) {
  // 从参数对象中解构并设置默认值
  const { x = 0, y = 0, z = 0 } = params;
  // 这里既可以用单个属性，也能操作原始的params对象
  console.log(`坐标：x=${x}, y=${y}, z=${z}`, `原始参数：`, params);
}

如果是在TS项目里，我们可以先定义接口来约束参数类型，再设置默认值：

// 定义可选属性的接口
interface Coordinate {
  x?: number;
  y?: number;
  z?: number;
}

function calculatePosition({ x = 0, y = 0, z = 0 }: Coordinate = {}) {
  console.log(`坐标：x=${x}, y=${y}, z=${z}`);
}

这样既保证了类型安全，又实现了默认值的需求。

常见坑提醒 #

千万别漏掉参数末尾的= {}！如果只写function calculatePosition({x=0,y=0,z=0})，当你不传参数调用时，JS会尝试解构undefined，直接抛出Cannot destructure property 'x' of 'undefined' as it is undefined.的错误。

内容的提问来源于stack exchange，提问作者Olivier.B