react 面试笔记

react

1。setState 不可变值，可能是异步更新，可能是合并。（setTimeout 是同步更新）

2。　组件生命周期！！

3。Portals 传送门组件渲染到父组件以外。使用场景:
- overflow hidden
- 父组件z-index太小
- fixed需要放在body第一层

return ReactDom.createPortal(
<div className="modal">{props.children}</div>，
document.body//dom 节点
)

以上则是把portals渲染到body上。fixed 元素要放在body上，有更好的浏览器兼容性。（逃离父组件

Context 上下文
5.性能优化：

scu (shouldComponentUpdate):不必每次都用，需要的时候才优化。（总之就是看自己。。。

**接下来的props，nextstate，通过对比  如果一样（true）就不重复渲染，如果返回false不渲染，可以优化性能，默认值是返回true。**。
shouldComponentUpdate(nextProps,nextState){if(nextState.count !==this.state.count){return true//可以渲染}return false //不重复渲染
}
深度比较 （一次性递归到底，耗费性能）必须配合不可变值使用  比如this.state.list.concat({id:"id_Data.now()"})
.isEqual(nextProps.list,this.props.list)

PureComponent(纯组件）和React.memo:

class Demo extends React.PureComponent{xxxxxxxx
}
shouldComponentUpdate(){}//浅比较
其实原理都一样
function MyComponent(props){}//使用props渲染
function areEqual（prevProps，nextProps）{如果把nextprops传入render方法的返回结果将prevProps传入render的返回结果一致就返回true，否则返回false
}
xxxx
export default React.memo(JyComponent,areEqual)

不可变值immutable.js:

 彻底拥抱不可变值基于共享数据（不是深拷贝），速度好

react 默认父组件更新子组件也无条件更新

关于组件公共逻辑的抽离：

高阶组件HOC （hoc是一种模式，类似工厂模式

const HOCFactory=(Compoent)=>{class HOC extends React.Component{//在此定义多个组件的公共逻辑render(){return<Component {...this.props}/>//返回拼装的结果}}return HOC
}
const EnhancedComponent1=HOCFactory(WrappendComponent1)
react redux connect  也是高阶组件

Render Props :
7.Redux :
- 基本概念：store state action reducer
8.React-router
路由配置
路由模式：hash模式，h5 history模式后者需要serve端支持，无特殊需求可以选择前者
获取动态参数(url参数）：import {useParams}from “react-router-dom” const {id}=useParams()
react 原理：函数式编程，vodm和diff ，jsx本质，合成事件，setSTate batchUpdate ，组件渲染过程，前端路由
函数式编程

react 面试笔记相关推荐

React入门笔记（一）
React入门笔记 1.引言 2.什么是React? 3.React基本的使用 4.JSX--react的语法糖 5.理解虚拟Dom 6.手配React项目 7.参考文章 8.视频教程地址 1.引言 ...
应有尽有！这可能是最全的 AI 面试笔记了
点击上方"视学算法",选择"星标"公众号重磅干货,第一时间送达今天给大家推荐一个非常全面的 AI 面试笔记集锦,包含 2018.2019 年的校招.春招.秋 ...
springaop事务逻辑原理_太狠了！阿里大牛手写的Spring核心面试笔记：IOC+AOP+MVC+事务...
Spring作为现在最流行的java 开发技术,其内部源码设计非常优秀.如果你不会Spring,那么很可能面试官会让你回家等通知. Spring是什么? 有一个工地,几百号人在用铁锹铲子挖坑. 如果开 ...
react学习笔记1--基础知识
什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...
react render没更新_web前端教程分享React学习笔记（一）
web前端教程分享React学习笔记(一),React的起源和发展:React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写 ...
炼丹面试官的面试笔记
作者:无名,某小公司算法专家排版:一元,四品炼丹师公众号:炼丹笔记关于Attention和Transformer的灵魂拷问背景现在几乎很多搞深度学习的朋友都把attention和Transf ...
Java高级开发工程师面试笔记
最近在复习面试相关的知识点,然后做笔记,后期(大概在2018.02.01)会分享给大家,尽自己最大的努力做到最好,还希望到时候大家能给予建议和补充 ----------------2018.03.05 ...
labuladong的算法小抄pdf_真漂亮！这份GitHub上爆火的算法面试笔记，助你圆满大厂梦...
前言 Github作为程序员们的后花园,一直以来都是程序员最喜欢逛逛.学习的地方,小编也不例外,最近看到一份对标BAT等一线大厂的算法面试笔记,已经标星68+K了,很是惊讶,看了一下,觉得知识点整理得 ...
（九）React面试真题演练
React面试真题演练组件之间如何通讯 JSX本质是什么 Context是什么?如何应用 shouldComponentUpdate用途 redux单项数据流 setState场景题什么是纯函数 ...
react组件卸载调用的方法_好程序员web前端培训分享React学习笔记（三）
好程序员web前端培训分享React学习笔记(三),组件的生命周期 React中组件也有生命周期,也就是说也有很多钩子函数供我们使用, 组件的生命周期,我们会分为四个阶段,初始化.运行中.销毁.错误处 ...

react 面试笔记

react

react 面试笔记相关推荐

最新文章

热门文章

react 面试 笔记

react

react 面试 笔记相关推荐

最新文章

热门文章

react 面试笔记

react 面试笔记相关推荐