TypeScript函数参数对象解构语法解析：为何无编译错误？

先看你给出的代码：

const func: ( newState: { newState: number }) => void = ({ newState: newState }) => {
    console.log(newState);
}

你疑惑的({ newState: newState })是对象解构赋值的完整写法，之所以不会报错，核心原因是冒号前后的newState含义完全不同：

• 冒号左侧的newState：指的是要从传入的对象参数中提取的属性名，对应函数类型定义里{ newState: number }中的属性名。
• 冒号右侧的newState：指的是要把属性值绑定到的变量名，也就是函数内部可以使用的参数变量。

在JavaScript和TypeScript中，当提取的对象属性名和要绑定的变量名相同时，允许简写为{ newState }，但写完整的{ newState: newState }也是完全合法的语法——编译器能清晰区分冒号两边的不同角色，不会判定为重复定义或语法错误。

举个更直观的对比例子：

// 完整写法：提取obj的newState属性，赋值给变量newState
const { newState: newState } = { newState: 123 };
// 简写写法：效果和上面完全一致
const { newState } = { newState: 123 };
// 重命名写法：提取newState属性，赋值给变量num
const { newState: num } = { newState: 123 };

回到你的代码，函数实现里的({ newState: newState })就是显式完成了「从传入的对象参数中提取newState属性，绑定到同名变量」的操作，完全符合语法规范，所以不会出现编译错误。

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