我有下一个代码在我的react js应用程序:
interface Input {
name: string;
type?: 'email' | 'text';
}
const Input = ({type}: Input) => {
return <input type={type}/>
}
组件只能接收email和text类型。如果用户将number添加为道具，那么编译器将在编译时抛出错误。例:
<Input type="number"/>
Type '"password"' is not assignable to type '"text" | "email".
，但同时我们也可以输入:
<Input type="number"/>
即使有这个错误，也可以抑制错误。
:我应该限制type道具只使用typescript在我的情况下，或者我应该使用javascript来排除type将number的情况?
这是对安全性、速度和您自己的开发时间的权衡。您需要根据您的用例来决定:这是一个判断问题，而不是通用的最佳实践问题。尽管运行时检查将使您的代码更安全，在运行时测试更完整，但对于您是唯一用户的组件，并且您使用次数有限的组件，它可能没有提供太多价值。
我可以看到它朝任何一个方向发展;你需要根据你对收益和成本的理解来决定。
是时候添加额外的防御检查了，即使TypeScript不太可能出错:
- 在大量使用
any的迁移代码库中，隐式或显式 - 在有外部用户或大量内部用户的大型代码库中
- 风险高的地方:组件是关键的，或者错误使用会在以后引入微妙的错误
- 在组件初始化或每个应用程序很少发生的情况下，其中额外检查的开销可以忽略不计
- 用于经常动态或用户提供的值，如
value - ，其他地方的自动化测试很难，或者不太可能捕捉到这个
相反，在这些情况下，运行时防御检查可能是多余的:
- 在这里TypeScript的使用是地方性的:不太可能有人会重写类型检查
- 在小型代码库中，你可能是唯一调用这个 的人
- 在低风险环境中，要么因为行为明显是错误的，要么它的后果很小
- 在紧密的内循环中，或者在运行时检查将是昂贵的性能方面
- 用于不太可能由用户提供的值，如
type - ，其他测试可能会发现这个