类组件和函数组件的区别

类组件与函数组件本质上代表了两种不同的设计思想与心智模式。

• 类组件的根基是 OOP（面向对象编程），所以它有继承、有属性、有内部状态的管理。
• 函数组件的根基是 FP，也就是函数式编程。它属于“结构化编程”的一种，与数学函数思想类似。也就是假定输入与输出存在某种特定的映射关系，那么输入一定的情况下，输出必然是确定的。

相较于类组件，函数组件更纯粹、简单、易测试。这是它们本质上最大的不同。

类组件需要考虑到 this 有一定的模糊性，而在函数组件闭包中，它捕获的值永远是确定且安全的。

设计模式上的区别

在设计模式上，因为类本身的原因，类组件是可以实现继承的，而函数组件缺少继承的能力。

当然在 React 中也是不推荐继承已有的组件的，因为继承的灵活性更差，细节屏蔽过多，所以有这样一个铁律，组合优于继承。

作为组件而言，类组件与函数组件在使用与呈现上没有任何不同，性能上在现代浏览器中也不会有明显差异。

它们在开发时的心智模型上却存在巨大的差异。类组件是基于面向对象编程的，它主打的是继承、生命周期等核心概念；而函数组件内核是函数式编程，主打的是 immutable、没有副作用、引用透明等特点。