react学习

参考来源菜鸟教程
前期需要Node.js和webpack

React

组件化：抽离UI组件
react没有.vue这样的模板文件，一切都是以JS来表现的 script
ES6和ES7(async和await)要合格！

概念

虚拟DOM 文档对象模型

DOM：浏览器端有dom概念，用JS对象来表示页面上的元素，还提供了一些操作DOM对象的API
虚拟DOM：框架中，用JS对象来模拟页面上的DOM和DOM嵌套
为了实现页面上dom元素的高效更新：从内存中获取新旧两个dom树，对比，得到需要按需更新的dom元素
程序员可以手动模拟新旧两个dom树，就是虚拟dom的概念
虚拟dom：用JS对象的形式来模拟页面上dom元素和嵌套关系(虚拟dom以JS对象的形式存在)
目的实现页面元素的高效更新
HTML声明一个dom元素： <div id=”mydiv“ title=”说“ data-index=”0“> 哈哈 <p>你</p> </div> JS一个dom元素: var div = { tagName:'div'， attrs:{ id:'mydiv', title:'说', 'data-index':'0' }, childrens:[ '哈哈'， { tagName:'p', attrs:{}, childrens:[ ‘你’ ] } ] }

网页呈现过程

1.浏览器请求服务器获取页面HTML代码
2.浏览器要先在内存中解析DOM结构，并在浏览器内存中，渲染出一科dom树
3.浏览器把dom树，呈现到页面上

Diff算法

tree diff ：Tree按层对比
component diff：在tree diff中每层组件级别的对比
element diff：组件对比中，类型相同则进行元素级别的对比

React安装

React 可