记金三银四的面试题

今年面试，相对于刚毕业那会面了10家拿了4份offer，进步了一丢丢，主要是offer的质量也提升了很多，主要在于准备面试的时候，把面试题做了分类总结，这样有利于记忆并且有利于对知识点的理解，以下是今年准备的面试题以及在面试中被问到的题目总结，记录一下，后续有空更新日常记录的面试题答案

注释1： 序号为主题目，在回答中引申出其他问题，主题目下面的分类则为引申问题

注释2： 面试中除了基础知识，还应该准备项目亮点，以及根据简历可能会引申出的场景题，该处暂不做此记录

CSS

1. 说说css选择器，以及它们的优先级
2. 说说bfc
3. 说说css选择器是从左往右解析还是从右往左解析
4. 实现垂直水平居中

JS基础

1. 说说闭包吧
   • 什么是作用域，作用域链
   • 什么是执行上下文
   • 函数的执行是怎么样的
   • 说说垃圾回收机制
2. 说说原型，原型链
   • 原型链指向null之前的时候指向哪里
   • 说说js继承
   • es6的class继承和es5的区别
3. 说说箭头函数和普通函数的区别
   • 说说this
   • 说说改变this指向的方法
   • 手写apply, bind, call
4. 说说值传递和引用传递的区别
   • 说说js的几种基本类型和引用类型，以及区别
   • 如果判断基本类型和引用类型
5. 说说你熟悉的es6
   • let, const, var的区别
   • for of和for in的区别
     • 什么是迭代器
       • 说说generator函数
       • async await
   • 数组的es6方法
   • 了解Set, weakSet, Map, weakMap吗？
     • Set和weakSet的区别
   • promise
     • 浏览器的事件循环
       • 可能还会问和Node的事件循环的区别

http

1. http的状态码
   • 304代表什么，说说强缓存和协商缓存
2. http1和http2的区别
3. http和https的区别
   • http的响应头有哪些设置
   • 说说CSRF, XSS，以及前端怎么预防
   • cookie和session的区别

浏览器

1. 说说浏览器渲染html的过程
2. 说说重绘回流
3. 说说浏览器的同源策略
4. 说说跨域

Vue

1. 说说你了解的vuex
   • Action和Mutation的区别
   • Action可以有返回值吗？
2. 说说vue-router中的两种模式和区别
   • 说说vue-router的钩子
3. 说说vue响应式
   • 响应式是data影响视图，那视图影响data怎么做的（考察v-model）
   • vue3的响应式做了哪些修改，有什么好处
4. 说说compile过程（模板解析过程）
   • AST解析怎么保证节点层级关系
5. 说说diff
   • diff的时间复杂度
     • 没优化前的diff的时间复杂度，为什么
   • patch过程是哪两个元素的比较
     • 什么是虚拟dom，虚拟dom和真实dom的区别
6. key的作用
   • key应该注意什么
7. 组件data为什么是函数
8. create和mounted的区别
9. computed和watch的区别
10. 组件通信
    • 说说EventBus
11. 说说axios，可以做哪些设置

webpack

1. 说说webpack的解析过程
2. 说说怎么优化打包前的体积以及打包后的速度
   • shaking tree应该注意什么
3. 热更新原理是什么

性能优化

说说你对前端优化的想法

• 什么是节流防抖
  • 手写节流，防抖
• 滚动加载，懒加载
  • 懒加载实现思路，有几种实现办法，有什么最优方法吗

React

这块题目主要来自几个前端朋友的面试描述，我没准备react相关题目，特此记录下

1. react团队为什么要将类组件转为函数式组件，他的根本原因是什么？
2. react的架构是什么样的？（15和16不一样）
   • 15：协调—>渲染
   • 16：调度—>协调->渲染
3. 描述一下 一次update的过程
4. fiber你了解吗？
   • 原理
   • 出现的原因
   • 和15diff对比的优点
   • fiber是如何实现重用上次工作的？
     • 15版本 协调器和渲染器是交替的
     • 16版本 这是因为协调器将所有的对比工作做完才一次性commit给渲染器
5. hooks的原理？
6. redux
   • 原理
   • 三大原则
7. react的diff算法和vue的区别？

算法

这块我主要是按照数据结构的知识点顺序在leetcode上做的算法题，实际面试中遇到算法题不多

1. 斐波那契相关(面试考察最多次)
2. 栈队列相关题目
3. 链表（该知识点考察最多的是快慢指针法，双指针法，例如vue diff就是双指针移动相互比较）
4. 二叉树（前序中序后序遍历，二叉树的高，相似二叉树，等等）

手写题

1. 节流，防抖
2. 深拷贝
3. 手写bind
4. 手写map
5. 手写new函数
6. 手写promise