这是我参与8月更文挑战的第4天，活动详情查看：8月更文挑战 1.redux中间件的原理是什么?\
改装dispatch,中间件middleware是action和store中间
2.你会把数据统一放到redux中管理，还是共享数据放在redux中管理？
是的，都放在redux中管理。redux+immutable，性能最好facebook测试过
3.componentWillReceiveProps的调用时机
子组件发生改变时，会调用这个
4.react性能优化的最佳方案。 class Test extends React.PureComponent{ // PureComponent自带shouldComponentUpdate可以减少手动update render // PureComponent和Component基本上完全相同。当props或者state改变时，// PureComponent将对props和state进行浅比较。 constructor(props){ super(props) } render(){ return
hello
} } PureComponent和immutable.js库结合可以完美实现性能优化 antD插件babel如何实现按需加载 babel-plugin-import插件
5.虚拟dom是什么？为什么虚拟dom会提升react性能 虚拟dom是真实dom的js对象。 没有虚拟dom的时候，2个真实dom比对，资源消耗是虚拟dom的几万倍。因为真实dom上面有很多绑定了很多事件属性方法等等。所以把dom比对，换成js对象的比对。 如果key值一样，就比对key值，不用循环。 diff算法是同层比较，把算法范围降到n
6.webpack中，react是借助loader完成jsx代码转换，还是babel?
babel-preset-react
7.调用setState后，发生了什么？ 常规写法是: this.setState({ age:this.state.age +1 // 这种异步，频繁点击+1，容易看见一次增加了4-5，而下面函数调用就不会 })
//养成好习惯，推荐用这种方法，坑少 this.setState((preState)=>({ age:++ preState.age }))
8.setState是异步的，遇到过什么坑？
获取setState后的数据，需要在setState回调函数里面写。否则可能是老数据
9.refs的作用，在什么业务场景下使用refs
渲染了一个图片，如放大镜，想获取图片的宽高。
// 如果用reudx，不用写constructor，直接connect
constructor(props){
super(props)
this.state ={
top:0
}
this.handleWindowScroll = this.handleWindowScroll.bind(this)
}
handleWindowScroll(){
this.setState({
top:document.body.scrollTop
})
}
componentDidMount(){
// 当页面滚动时,top值发生变化
window.addEventListener(‘scroll’, this.handleWindowScroll)
}
componentWillUnmounte(){
window.removeEventListener(‘scroll’, this.handleWindowScroll)
}
render(){
return
{this.state.top}
}
}
10.ref写成函数，有什么好处? 1.直接this.elem获取到这个标签 2.有效的清空ref里面的东西，销毁dom后不会内存泄露。所以不要用字符串了ref=“abc” class Test extends Component{ componentDidMount(){ this.elem } render(){ return <div ref={(div)}=>{this.elem=div}}>div test } }
11.高阶组件你是怎么理解的，它的本质是什么？
组件是一个函数，高阶组件是参数是函数，返回值还是函数.
下面是高阶组件回调地狱，如果用hook就可以解决回调地狱，并且代码量减半。
12.受控组件与非受控组件的区别
受控组件：value参数被state控制
非受控组件：
因为react是数据驱动页面的，所以建议都用受控组件。
13.函数组件和hooks
hooks可以给函数组件状态，生命周期。useState
把业务逻辑放在hooks里
14.this指向问题一般怎么解决
箭头函数,bind
15.函数组件优化 React.memo，减少render次数 React.memo(function Test(props){ return
123434311111
}) 16.哪个生命周期里发送ajax? compontentDidMount里,因为: 1.compontentWillMount在新版本react已经被废弃了 2.ssr中componentWillMount要做服务器端数据获取，所以不能占用
17.ssr的原理是什么？ ssr是服务端渲染，核心是因为虚拟dom，所以可以在node服务器端执行代码。
18.redux-saga的设计思想是什么？什么是sideEffects?
19.react,jquery,vue是否可以共存在一个项目中。 可以,
jquery 20.组件是什么，类是什么，类被编译成什么？ // 模块,webpack // 组件是指页面的一部分，带有ui设计
21.你是如何跟着社区成长的。 react的twitter是最新的
22.如何避免ajax数据重新获取 redux进行状态管理
23.react-router4的核心思想是什么，和3有什么区别?
react-router4的核心思想是组件式 25.reselect是做什么使用的？ 类似vue的computed计算属性，缓存提升代码性能
26.react-router的基本原理，hashHistory,browserHistory browserhistory看起来漂亮，但是要后端配合，所以一般用hashHistory createBrowserHistory： http://localhost:8084/second createHashHistory： http://localhost:8084/#/second
27.什么情况下使用异步组件 reloadable库
28.xss攻击在react中如何防范？ dangerousslySetInnerHTML={{__html:‘’}}
29.getDerivedStateFromProps和getSnapshotBeforeUpdate 新出来的生命周期，取代componentWillReceiveProps
