导入
简介
让我们来看一下如何验证并确保 React 组件接收到正确的数据类型。
类型检查
类型检查是一种避免应用程序中潜在错误的简单方法。我们已经讨论过一些避免潜在错误的基本原则，其中最重要的一点是 纯组件 的存在，即组件不产生副作用。没有副作用意味着：对于相同的输入参数（在 React 中，指的是 props 和 state），组件始终渲染出相同的结果。
我们应该提前明确哪些 props 会被传入组件，以及它们如何被处理。为了更轻松地实现这一点，可以采用 类型检查。JavaScript 在这方面有些特殊：一个原本是 字符串 类型的变量可以轻易地转换为 数字 或甚至 对象，而 JavaScript 解释器不会报错。
尽管这在开发中看似灵活，但却容易引入错误，迫使我们必须手动检查数据类型。例如，当我们尝试访问嵌套属性 user.settings.notifications.newMessages 时，必须先确认 user 是否确实是一个对象而不是 null，然后依次检查 settings 等每一层属性。否则，就可能遇到类似如下的类型错误：
...
React 在访问空的嵌套属性时抛出的错误
PropTypes、Flow 与 TypeScript
类型检查 能帮助我们在错误发生之前就发现它们。除了 React 自带的轻量级解决方案 PropTypes 外，还有 Flow 和 TypeScript 这类支持静态类型的语言工具。虽然 Flow 和 TypeScript 也可用于普通 JavaScript 应用，但 PropTypes 仅限于 React 组件中使用。如果你对静态类型感兴趣，可以进一步了解 Flow 或 TypeScript。