最近美团前端面试题目整理
代码输出结果
const promise = new Promise((resolve, reject) => {console.log(1);console.log(2);
});
promise.then(() => {console.log(3);
});
console.log(4);输出结果如下：
1
2
4promise.then 是微任务，它会在所有的宏任务执行完之后才会执行，同时需要promise内部的状态发生变化，因为这里内部没有发生变化，一直处于pending状态，所以不输出3。
Nginx的概念及其工作原理
Nginx 是一款轻量级的 Web 服务器，也可以用于反向代理、负载平衡和 HTTP 缓存等。Nginx 使用异步事件驱动的方法来处理请求，是一款面向性能设计的 HTTP 服务器。
传统的 Web 服务器如 Apache 是 process-based 模型的，而 Nginx 是基于event-driven模型的。正是这个主要的区别带给了 Nginx 在性能上的优势。
Nginx 架构的最顶层是一个 master process，这个 master process 用于产生其他的 worker process，这一点和Apache 非常像，但是 Nginx 的 worker process 可以同时处理大量的HTTP请求，而每个 Apache process 只能处理一个。
类组件与函数组件有什么区别呢？
- 作为组件而言，类组件与函数组件在使用与呈现上没有任何不同，性能上在现代浏览器中也不会有明显差异
- 它们在开发时的心智模型上却存在巨大的差异。类组件是基于面向对象编程的，它主打的是继承、生命周期等核心概念；而函数组件内核是函数式编程，主打的是 immutable、没有副作用、引用透明等特点。
- 之前，在使用场景上，如果存在需要使用生命周期的组件，那么主推类组件；设计模式上，如果需要使用继承，那么主推类组件。
- 但现在由于 React Hooks 的推出，生命周期概念的淡出，函数组件可以完全取代类组件。
- 其次继承并不是组件最佳的设计模式，官方更推崇“组合优于继承”的设计概念，所以类组件在这方面的优势也在淡出。
- 性能优化上，类组件主要依靠
shouldComponentUpdate阻断渲染来提升性能，而函数组件依靠React.memo缓存渲染结果来提升性能。 - 从上手程度而言，类组件更容易上手，从未来趋势上看，由于React Hooks 的推出，函数组件成了社区未来主推的方案。
- 类组件在未来时间切片与并发模式中，由于生命周期带来的复杂度，并不易于优化。而函数组件本身轻量简单，且在 Hooks 的基础上提供了比原先更细粒度的逻辑组织与复用，更能适应 React 的未来发展。
生命周期
init
initLifecycle/Event，往vm上挂载各种属性callHook: beforeCreated: 实例刚创建initInjection/initState: 初始化注入和data响应性created: 创建完成，属性已经绑定， 但还未生成真实dom`- 进行元素的挂载：
$el / vm.$mount() - 是否有
template: 解析成render function*.vue文件:vue-loader会将<template>编译成render function
beforeMount: 模板编译/挂载之前- 执行
render function，生成真实的dom，并替换到dom tree中 mounted: 组件已挂载
update
- 执行
diff算法，比对改变是否需要触发UI更新 flushScheduleQueuewatcher.before: 触发beforeUpdate钩子 -watcher.run(): 执行watcher中的notify，通知所有依赖项更新UI- 触发
updated钩子: 组件已更新 actived / deactivated(keep-alive): 不销毁，缓存，组件激活与失活destroybeforeDestroy: 销毁开始- 销毁自身且递归销毁子组件以及事件监听
remove(): 删除节点watcher.teardown(): 清空依赖vm.$off(): 解绑监听
destroyed: 完成后触发钩子
| Vue2 | Vue3 |
|---|---|
beforeCreate
|
❌setup(替代)
|
created
|
❌setup(替代)
|
beforeMount
|
onBeforeMount
|
mounted
|
onMounted
|
beforeUpdate
|
onBeforeUpdate
|
updated
|
nUpdated
|
beforeDestroy
|
onBeforeUnmount
|
destroyed
|
onUnmounted
|
errorCaptured
|
onErrorCaptured
|
| - |
最近美团前端面试题目整理相关推荐
最新文章
热门文章 |