如何在TypeScript函数中对参数内的解构对象进行类型检查

你之前的写法function myfun({carengine:CarEngine,cartransmission:CarTransmission})是JavaScript的解构重命名语法，作用是把解构出来的carengine变量重命名为CarEngine，完全不是类型标注，所以不会生效。

方式1：使用TypeScript标注类型 #

要给整个解构的参数对象加类型标注，写法如下：

// 写法1：内联标注类型
function myfun({carengine, cartransmission}: {carengine: CarEngine, cartransmission: CarTransmission}) {
  // 业务代码
}

// 写法2：提前定义参数类型，可读性更好
interface MyFunParams {
  carengine: CarEngine;
  cartransmission: CarTransmission;
}
function myfun({carengine, cartransmission}: MyFunParams) {
  // 业务代码
}

如果允许参数缺省，还可以加可选标注和默认值：

interface MyFunParams {
  carengine?: CarEngine;
  cartransmission?: CarTransmission;
}
function myfun({carengine, cartransmission}: MyFunParams = {}) {
  // 业务代码
}

方式2：原生JS使用JSDoc做类型检查（不需要TS编译） #

如果你用的是原生JS，只想在编辑器里获得类型检查能力，可以用JSDoc标注：

/**
 * @param {Object} params
 * @param {CarEngine} params.carengine
 * @param {CarTransmission} params.cartransmission
 */
function myfun({carengine, cartransmission}) {
  // 业务代码
}

方式3：运行时类型检查（适合生产环境校验入参） #

如果需要在代码实际运行时做类型校验，不是只靠编译/编辑器检查，可以手动加判断：

function myfun({carengine, cartransmission}) {
  if (!(carengine instanceof CarEngine)) {
    throw new TypeError('carengine 必须是 CarEngine 类型的实例')
  }
  if (!(cartransmission instanceof CarTransmission)) {
    throw new TypeError('cartransmission 必须是 CarTransmission 类型的实例')
  }
  // 业务代码
}

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