react基础知识
1.什么是pwa?
pwa=渐进式web应用
pwa的好处:实现类似于app的离线缓存功能
react中的registerServiceWorker+manifest.json就是用来实现这个功能的
2.react定位
2.1 声明式开发:面向数据(区别于jquery和原生js:面向过程)
* 比如造房子:react提供图纸即可自动进行 ,jquery:需要明确每一步做什么
2.2 单项数据流 : 为什么要单向数据流?-----父组件向子组件传递值之后,子组件不允许修改父组件中的值,因为一旦修改所有用 到这个值得元素全部改变,不利于定位bug位置
2.3 视图层框架:大型项目中数据传递比较复杂,只有react是远远不够的
2.4 函数式编程:面向测试的编程,如果都是函数的话很容易测试
3.虚拟dom是什么?
以前我也百思不得其解虚拟dom到底是什么?虽然知道有render函数,它是用一个数组来存储标签信息的。
原来虚拟dom就是这个数组。
虚拟dom的本质--------------js对象,如下:
* 虚拟DOM:['div',{id:'abc'},['span',{},'Hello World']]
* 真实DOM:`<div><span>Hello World</span></div>`
4.虚拟dom为什么能够提升性能?
前言:对真实DOM的操作极大耗费性能,而使用js对象来进行数据的比对,性能能得到优化
于是将数据的变化反应到虚拟dom上,更新之后再反应到真实dom上面
diff算法:组件树子上而下来进行比对,如果哪一个不同那么后面的就无需比对直接替换掉了
5.react的生命周期?
* initialization
* mounting
* componentWillMount:组件即将被挂载到页面时执行(只执行1次)
* render:页面挂载
* componentDidMount:页面挂载之后执行(只执行1次)---ajax请求
* updating
* props
* componentWillReceiveProps props改变比status改变前面多了一个,从父组件接收了参数,父组件render重新执行之后子组件则会执行
* shouldComponentUpdate(组件更新前,返回布尔值,是否需要更新)
* componentWillUpdate
* render
* componentDidUpdate
* componentWillUnmount