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
10-03 16:11