react 学习笔记

001
模块化：从代码角度可服用代码，抽离出来，便于维护和开发。
组件化：从UI揭秘哪角度进行扽袭，抽离出来，便于维护和开发。好处在于页面的拼接组装即可。
002
vue实现组件化通过单个vue文件即可。
react组件没有模版文件，但是都是通过js表现出来的。
003
DOM本质：浏览器中的概念。用你js对象来表示页面元素，提供了操作DOM对象的API。
虚拟DOM是框架中的概念，用JS对象来模拟页面上的DOM和DOM嵌套。
。作用是更高效的更新DOM。----- 用JS对象的形式来模拟页面上的DOM嵌套关系。
004
diff算法
新旧两颗DOM树，逐层对比的过程就是tree diff。当两颗对比完成后，则所有需要被更新的，都会被更新。
005
webpack
webpack-dev-server 是在内存里实现了热更新
html-webpack-plugin 导入在内存中自动生成index.html页面的插件。

006
0061 导入包
import React from ‘react’;// 创建组件虚拟、Dom元素、生命周期
import ReactDom from ‘react-dom’; // 把建好的组件渲染到页面上
0062 创建虚拟dom
const dom1= React.creatElement(‘h1’,{ id:‘title’,title:‘this is hhhh’ },‘这是内容’)；
// 参数1 是创建的元素类型，字符串，元素的名称–标签类型
// 参数2: Dom元素的属性，是一个对象或者null-- 标签节点
// 参数3: 子节点
// 参数n：子节点
0063 虚拟节点渲染到界面上
ReactDom.render(dom1,document.getElementById(‘app’))
// 参数1: 需要渲染的Dom元素
// 参数2 指定页面上的Dom元素，作为容器

007
组件创建的两种方式，class有自己的生命周期和私有数据。但是functin创建的组件只有props其他的都没有。用构造函数创建的组件叫做有状态组件；用class创建的叫做有状态组件，区别就在于有没有static。