React 中定义组件的两种方式

1.函数式定义

function MyComponent(params) {
            return <div>函数式创建组件myComponent</div>
        }
        ReactDOM.render(<MyComponent/>, document.getElementById('test'))
        const TDOM = document.getElementById('test')

2.类定义

// 1.创建类式组件
        class MyComponent extends React.Component{
            // render是放在哪里的？ ---MyComponent的原型对象上，供实例使用
            // render中的this是谁？ ---MyComponent实例对象  <=> MyComponent组件实例对象 
            render(){
                console.log(this,'<===?')
                return <div>类继承式创建组件myComponent</div>
            }
        }
        // 2.渲染组件到页面
        ReactDOM.render(<MyComponent/>, document.getElementById('test'))
    /*
    执行了ReactDOM.render(<MyComponent/>...)后发生了什么
          1.React解析了组件标签，找到了MyComponent组件
          2.发现组件是使用类定义的，随后new出来该类的实例，并通过该实例调用到原型上的render方法
          3.将render返回的虚拟DOM转为真实DOM，随后渲染到页面
    */
        const TDOM = document.getElementById('test')