2021年秋招前端复盘_前端工作复盘怎么写

面试注意问题：开始先说好，说的不对的希望可以指出来；

1、实现元素的居中

行内元素：
块级元素：

2、flex布局以及属性

3、ES6新特性

4、数组有哪些方法？map和filter的区别？for of和for in的区别？

for in是用来遍历对象的，得到对象的key
for of 是用来遍历数组 set map 的，set得到每一个元素值，map得到数组形式的键值对
for in 遍历数组的话会得到索引值
for of 遍历对象的话会报错 输出不可迭代

5、js异步有哪些方式？promise和async/await的区别

6、vue的生命周期 哪些拿到dom 哪些拿到data

7、学习前端多久了？怎么学的前端？

是从去年开始接触前端，截止到今天刚好是11个月。
首先，第一遍的时候是跟着视频课程的老师过的HTML css js的基础部分，之后开始仿写pc端项目的时候，就结合着犀牛书又过了一遍基础知识，项目中碰到的问题大多是去csdn上搜答案，了解问题出现的原因，寻找最优的解决方法，以及做好总结，避免以后犯类似的错误。
之后的vue.js是看的官网文档，项目也是跟着视频课老师学的，项目中出现的问题，碰到的问题也基本是按照三大步骤解决的。

8、css3新特性有哪些？动画怎么实现的

1、边框 border-radius box-shadow
2、渐变色 线性渐变和径向渐变
3、2d和3d效果 transform: translate(移动)、rotate(旋转顺时针)、scale(缩放倍数)
4、过渡transition(属性 时间 线性变化 延迟时间再去过渡)
5、动画 用@keyframes 动画名称去定义动画，调用的时候animation: 动画名字持续时间
6、盒子模型 box-sizing
7、媒体查询配合rem做响应式

9、三栏布局

10、this指向问题

11、迭代器

语句迭代器：iterator:用Symbol.interator()生成一个迭代器，这个迭代器有一个next函数，函数中有两个参数，第一个是value第二个是done,value表示当前值，done表示是否遍历完成。他可以迭代数组和set不可以迭代对象和map

var obj = [3,4,5]
var arr = obj[Symbol.iterator]()
console.log(arr.next()); //会得到一个对象 包括 value 和 done
1
2
3

12、数组的扁平化

13、事件循环是什么和一道分析输出题目

浏览器的事件循环：首先要说一下浏览器的事件执行有主线程 宏任务和微任务队列。常见的宏任务队列有script脚本 setimeout setinterval 微任务有promise的then方法。先执行script脚本的同步代码，碰到宏任务的时候把它扔到宏任务队列，碰到微任务的时候把它扔到微任务队列，当执行完主线程的同步代码之后，执行微任务队列里的微任务，然后执行下一个宏任务。
try catch的用法：用来捕获同步任务中的错误的，如果里边放的是异步错误，则捕获不到

14、vue2和vue3的区别

首先从原理上来看，数据监听是一个区别，对数据的懒观察是一个(vue2是把所有的data刚开始就添加上所有的监听，但是vue3是只对初始渲染的部分添加监听)，在一个是watcher的区别，vue2中通过vue.set给对象添加新属性的时候依赖该对象的所有watcher都会重新走一遍，但是vue3只对依赖的相关属性重新走一遍。
然后从组件使用上来看：vue2使用的是option api vue3使用的是composition api，所以对与创建数据，方法属性，计算属性，生命周期hooks, props 事件的使用上都发生了变化
1、创建数据，vue2的话是放在data中的，但是vue3是响应式数据 这就要求把响应式导入reactive 然后通过setup方法去创建数据state，在表单使用数据的时候不能只写数据名称，也要把state加上。
2、methods。vue2中的方法是直接放在methods中的，vue3中的方法是放在setup中的
3、computed属性。vue2中直接放在computed这个api中的，但是vue3中这是一个单独的api,所以要导入然后在setup的state中去定义
4、声明周期hooks 也是一个单独的api，vue3中没有全局的声明周期，比如组件挂载onmounted,要先把这个api引入，然后在setup中使用
5、this指向和props属性。vue2的this是指向该组件的，所以可以拿到props中的数据，但是vue3中要把props作为setup的第一个参数，然后通过props.数据名去调用数据
6、事件，vue2中通过this.$emit就可处理事件，vue3把emit作为setup的第二个参数，然后才能使用。

15、node.js和mongdb是如何接触的

最近接触的美团移动端的一个项目中后端用的是node+mongdb写的，并且现在前端的主流趋势也应该是往大前端发展，所以就入门了一下，首先node.js是一个内置V8引擎的JS运行环境，内置NODE API，并且webpack npm都是基于node开发的。node的执行过程大概是这样的。。。优点：java是多线程的，所以他处理I/O操作的能力不如node，所以node使用于处理I/O操作多 高并发的情况，但是他的计算速度不如Java。我经常用的大概就是全局模块__dirname __filename 系统模块 fs http(项目中用的是express库) 还有一些自定义的模块。
mongdb我就是学了基本的操作命令，mongod开启本地数据库 mongo连接本地数据库 show dbs, use 库名，show collections, db.集合名.insert/remove/updata/find()等命令，在这里就是用复制命令把项目中的数据放到了本地。

16、http和HTTPS的区别

1、HTTPS使用数字证书，费用较高，HTTP不需要
2、HTTP采用明文传输，HTTPS采用SSL加密传输，更安全
3、HTTP协议的端口号是80端口，HTTPS协议的端口号是443端口
4、HTTP协议是无状态的简单的连接，HTTPS可以加密传输还能验证身份查看数据包的完整性。

17、实现一个字符串的拼接输出结果

例如get(obj, a.b.c.d)
思路：给定一个字符串和他的拼接键值，把键值分割成数组，遍历这个数组，查看obj[keys[i]]是否有值，有的话就给obj重新赋值

const obj = {
   
            a: {
   
                b: {
   
                    c: {
   
                        d: 1
                    }
                }
            }
}
function get(obj, keys) {
   
            if(typeof keys !== 'string') {
   
                console.error('type error')
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17