类组件
使用class定义组件的时候，首先要先从react中解构出React.Component,并继承它
class Test extends Component{ //继承Component，Component相当于React.Component render(){ return <div>我是class定义的一个组件</div> }} ReactDOM.render()
当组件是一个类定义的时候，执行ReactDOM.render函数的原理：
1、首先找到组件对应的类，并new了这个类的一个实例
2、通过实例找到原型上的render函数，让render执行
3、ReactDOM.render接收到原型上render函数retrun的虚拟的dom
4、将虚拟dom转换成真实dom，插入到页面中
setState是react类组件中最常用的一个react API，使用它可以改变state从而改变页面。
this.setState是异步的
在你调用了this.setState后在他的下面输出他的结果还是没变的状态
this.setState({count:this.state.count+1}) console.log(this.state,‘000’) //结果式之前的，不是最新的
this.setState的第一个参数可以是一个对象，也可以是一个函数返回一个对象，
函数的参数是上一次的state
this.setState((prevState)=>({count:prevState.count+1}))
this.setState的第二个参数是它的回调函数，在前面重新给state赋值后执行
this.setState({count:this.state.count+1},()=>{ console.log(this.state.count) })
注：多次调用state会合并为一次,只有当更新结束后 state 才会改变
多次调用state,同时执行
setTimeout(()=>{ this.setState({count:this.state.count+1}) this.setState({count:this.state.count+1}) this.setState({count:this.state.count+1}) },100)
组件之间的区别
函数式组件和类组件的区别
- 语法上的区别：
函数式组件是一个纯函数，它是需要接受props参数并且返回一个React元素就可以了。
类组件是需要继承React.Component，而且class组件需要创建render并且返回React元素，
语法上来讲更复杂。
调用方式：
函数式组件可以直接调用，返回一个新的React元素；
类组件在调用时是需要创建一个实例的，然后通过调用实例里的render方法来返回一个React元素。
状态管理(state)：
函数式组件没有状态管理，类组件有状态管理。
使用场景：
类组件没有具体的要求。
函数式组件一般是用在大型项目中来分割大组件（函数式组件不用创建实例，所有更高效），
一般情况下能用函数式组件就不用类组件，提升效率。
组件的状态（state）和属性（props）之间有何不同
State 是一种数据结构，用于组件挂载时所需数据的默认值。 State 可能会随着时间的推移而发生突变，但多数时候是作为用户事件行为的结果。 Props(properties 的简写)则是组件的配置。 props 由父组件传递给子组件，并且就子组件而言，props 是不可变的(immutable)。 组件不能改变自身 的 props，但是可以把其子组件的 props 放在一起(统一管理)。 Props 也不仅仅是数据–回调函数也可以通过 props 传递。
什么是有状态组件？什么是无状态组件？
有状态组件和无状态组件指的是组件是否有自己的数据（state）
有状态组件
class App extends React.Component { constructor() { super(); this.state = { name: '张三' } } render() { return ( <div> <h1>{this.state.name}</h1> </div> ) } } 注：类组件继承React.Component组件，会从父类中继承一个state属性，通过这个属性可以定义自己的状态
无状态组件
function App() { return ( <div> <h1>hello</h1> </div> ) } 注：函数式组件没有继承React.Component组件，没有state属性，没有自己的状态 (使用HOOK可以给函数式组件添加状态)
函数式无状态组件特点
● 它是为了创建纯展示组件，这种组件只负责根据传入的props来展示，不涉及到state状态的操作。
● 组件不能访问this对象
● 不能访问生命周期方法
函数式组件的性能优化
减少重新 render 的次数。因为在 React 里最重(花时间最长)的一块就是 reconction(简单的可以理解为 diff)，如果不 render，就不会 reconction。
减少计算的量。主要是减少重复计算，对于函数式组件来说，每次 render 都会重新从头开始执行函数调用。
总结：
以上就是 React 中类组件，组件间的区别，有无状态组件，不懂得也可以在评论区里问我，以后会持续发布一些新的功能，敬请关注。
