React类组件：是否需在构造函数中赋值props为实例属性？

兄弟，直接给你拍板——绝对不要在构造函数里把props赋值到组件实例的this.propName上，直接通过this.props.propA访问才是React官方推荐的最佳实践。为啥这么说？给你唠明白：

1. 赋值会丢失props的响应式更新 #

React的props是随父组件传递动态变化的，但你在构造函数里把props.propA赋值给this.propA，这个操作只会在组件初始化时执行一次。之后如果父组件更新了propA的值，this.propA会停留在旧值上，而this.props.propA会自动同步最新值，这就会导致组件内部数据不一致，出现莫名其妙的bug，排查起来贼头疼。

2. 完全是多此一举，违反React设计逻辑 #

React本身已经把外部传入的props挂载到组件实例的this.props属性上了，额外把props赋值到实例的自定义属性上，既增加了冗余代码，又混淆了props的来源——props是外部传入的只读数据，没必要再做一层拷贝。

3. 可读性和维护性拉胯 #

当其他开发者接手你的代码时，看到this.propA第一反应会疑惑：这是组件自己的state？还是外部传的props？而this.props.propA一眼就能明确是外部传入的属性，代码意图更清晰，维护起来也省心。

举个实际的反例场景 #

假设父组件给你的组件传递了userName="张三"，之后父组件把userName更新成了"李四"：

• 如果你用this.userName访问，methodA打印的还是"张三"
• 如果你用this.props.userName访问，methodA会打印最新的"李四"

所以别搞那些花里胡哨的操作，直接用this.props.xxx就完事了，既符合React的设计规范，又能避免不必要的坑，代码还更简洁。

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