TypeScript函数中被{}包裹的参数及后续类型标注是什么含义？

语法含义解释 #

这是ES6对象解构语法和TypeScript类型标注的组合用法，分为两部分理解：

• 大括号包裹的{ data }属于ES6对象解构赋值特性：代表这个位置的入参是一个对象，我们直接从该对象中提取data属性作为当前函数作用域内可直接调用的变量，不需要手动写入参对象.data来取值。
  不使用解构的等价写法如下：

  addArrivingTruckSuggestions(state: ITruckState, payload: { data: IOperationalTruck[] }) {
    // 解构语法已经自动完成了下面这行的取值操作
    const data = payload.data;
    state.arrivingTruckSuggestions = searchService.createTruckSuggestions(data);
  }
  

• 冒号后跟随的{ data: IOperationalTruck[] }是TypeScript对这个入参对象的类型定义：要求该入参必须是一个对象，且对象下必须存在data属性，属性值的类型为IOperationalTruck数组，不符合该结构的入参在编译阶段就会抛出类型错误。

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