React 的 PropTypes

在 React 中，prop 是从外部传递给组件的数据，可以说是组件对外的一个接口属性，它也是应该有对应的规范的，比方说：

• 这个组件支持哪些 prop
• 每个 prop 应该是怎么样的格式

而 React 是通过 propTypes 用来规范 prop 必须满足某种规格，如下所示：

export default class MyComponent extends Component {
  //此处代码省略
}

MyComponent.propTypes = {
    name: PropTypes.string.isRequired,
    position: PropTypes.number
};

其中 name 是必须指定并且为 string 类型，而 postion 是 number 类型，可有可无

有了 propTypes 的检查，我们可以在开发阶段轻易发现 prop 使用错误的地方：

 <MyComponent name={10} />

那么在运行时，在浏览器的 Console 就可以看到：

因此一定要写 PropTypes，切莫为了省事而不写

propTypes 虽然能在开发阶段发现代码中的问题，但是这个是存在着一定的性能消耗，而且 propTypes 产生的错误信息也只有开发者才能看懂，因此这个 API 只适合在开发环境下使用

我们在发布产品时，可以使用 babel-react-optimize 对 React 代码进行优化，它会自动将代码中定义的 propTypes 全部去掉