两个前提

1. 上级只在意业务功能，没人在意前后端具体实现；
2. 督促平级后端交付高质量接口的沟通成本远大于前端写几行map的开发成本。

故结论：前端兼容。

问题是

由于种种原因，可能某个字段，在不同的后端接口里，命名各不相同，甚至值的类型也不同。 导致在写TypeScript时，要反复定义结构相似的type/interface，还很难起名。

看个例子

现在我有两个接口：

// 通过ID查用户
const res = fetch.get('/user', { id: 1 })
console.log(res.body) // { id: 1, name: 'alice' }

// 通过ID改用户名
const res = fetch.post('/user', { user_id: '1', new_username: '' })
console.log(res.body) // { code: 0 }

很难受吧，后端query和update的接口字段居然不一致。

怎么办？

作为前端，我的用户ID究竟叫id还是user_id？

类型究竟是number还是string？

很简单，按前端方便来：

type User = {
  userId: string,
  username: string
}

<div>
  <div>用户ID：{{userId}}</div>
  <div>用户名：<input type="text" value="{{username}}" /></div>
</div>

？？？

因为JavaScript常用驼峰命名，userId通常只是展示，不会涉及什么数值运算，绑定<input />之类也比较方便…

哈哈，你肯定早知道这些，我知道你在疑惑，接口怎么办？

别急

我们知道，TypeScript类型系统很好，除非any泛滥。 要想抑制any渗入我们的代码，就要知道any从哪产生。