前端面试框架 #3
Description
vue
vue基本
一、 vue的生命周期： beforeCreate、created、beforeMounte、mounted、beforeUpdate、updated、beforeDestory、destroyed；
二、 Vue组件通信：
- props(emit)；
- $attr和$listeners，
- 事件bus对象(bus.$on, bus.$emit)，
- provide(inject)，
- v-model(props:value, emit:input )，
- $children，
- vuex
三、keep-alive使用及原理，LRU算法
四、vue的v-show和v-if的区别；vue的watch和computed的区别；
五、其他：vue的服务端渲染，例如框架nuxt的使用；前端组件库的使用，如element-ui；
vue2与vue3
3是Proxy+Reflect，2是Object.defineProperty；dom-diff的优化；componentApi等
vue-router
- 实现的模式：hash & history；两者的区别和分析
- 事件：全局：beforeEach、afterEach；路由：beforeEnter；组件内：beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave
- 实现原理，源码
vuex
- vuex是什么？vuex官网
- state、getters、mutations(commit)、actions(dispatch)、module
- mapState、mapMutations、mapGetters、mapActions；subscribe，subscribeAction
- 实现原理，源码等
react
一、生命周期
1.react16之前的生命周期是什么？
2.react16之后的生命周期是什么？
3.react16和react16之前的版本有什么区别？
4.requestAnimationFrame是什么？requestIdleCallback是什么？如何实现requestAnimationFrame
// 实现requestAnimationFrame
var lastTime = 0
window.requestAnimationFrame = function (callback) {
let now = Date().now;
let timeCall = Math.max(0, 16 - (lastTime - now));
let id = setTimeout(function () {
callback(now + timeCall)
}, timeCall)
lastTime = now + timeCall;
return id;
}
二、react-hooks
1.常用的reacthooks都有哪些？
2.使用useEffect模拟componentDidMount和componentDidUpdate
3.useEffect返回的是什么？做什么用的？
4.useEffect和useLayoutEffect的区别是什么？
5、useMemo和useCallback是什么？做什么用的？有什么区别？
三、react-router
1.如何实现路由切换，有几种方式？
2.有哪几个钩子函数？onEnter和routerWillLeave
3.link与a标签的区别什么？
四、redux
1.redux是什么？做什么的？与vuex有什么区别？
2.redux包含哪几块？state，reducers，actions
五、其他：
1.服务端渲染next；
2.组件库antd；
3.PureComponent与Component的区别是什么？
4.react的性能优化有什么建议？
5.封装一个promise的setState
// 使用promise封装setState
function setStateP(state) {
return new Promise(resolve => {
this.setState(state, resolve)
})
}
工具型-webpack
- 1.webpack是什么？
- 2.webpack的工作原理是什么？
- 3.写过plugin吗？怎么实现的？
- 4.loader是做什么的？loader和plugin的区别什么？
- 5.关于webpack的优化建议等
聊聊webpack