前端总结大全

记住 88 条精简前端面试题，让面试成为享受

• • 前言
  • HTML&CSS
  • JavaScript
  • VUE2.x
  • VUE3.x
  • TypeScript
  • React
  • 微信小程序
  • uniapp
  • 网络
  • 性能相关
  • 项目相关
  • 浏览器
  • 工具
  • 其它

前言

背的最少、说的最好。你的面试我帮你，本博客持续优化改进，请关注收藏。

HTML&CSS

---

• 盒模型、BFC、 清除浮动；

• postiton定位5个值
  

• 水平/垂直居中、 两/三栏布局(圣杯双飞翼)、flex布局；

• 常见的块级/行内/空元素、CSS Hack、src与href的区别、link与@import区别

• css3/H5新特性

• 浏览器兼容性问题

JavaScript

---

js中的三座大山:

1. 原型与原型链
2. 作用域
   闭包、this指针
   垃圾回收和内存泄漏
3. 异步和单线宏任务微任务

js基础

• 数据类型 、手写深拷贝、类型判断
• 数组方法、数组去重、 数组排序、数组扁平化、字符串
• 深拷贝浅拷贝

高频面试题

• for···in和for···of的区别
  
• null和undefined区别
• this, call, apply, bind , 继承 、设计模式

DOM

• js操作DOM

BOM

• js操作BOM

事件

1. 事件绑定、事件流、自定义事件
   
2. 事件委托
3. 封装一个通用的事件绑定函数

Ajax

• 原生ajax创建步骤、jsonp的原理

存储

• cookie、localStorage、sessionStorage

Es6

• let, var, const 区别、 es6解构赋值
  、箭头函数与普通函数区别、class与class继承
• promise使用及实现、async,await、generator函数
  
• Es6中新的数据类型symbol、Es6中Set、WeakSet、Map、WeakMap数据结构
• es6模块规范

VUE2.x

• 更多vue基础内容(最全)

• 为何组件的data必须是一个函数、vue常用的指令、 v-if/v-show区别、vue生命周期

• vue数据双向绑定原理、 Vue 虚拟 Dom 、vue diff算法

• vue组件通信、vuex、watch深度监听

• vue中Computed、Methods、Watch区别
  

• mvvm和mvc

• vue中的事件修饰符、

• vue自定义组件、vue自定义指令、自定义指令使用场景、vue自定义过滤器filter、

• vue-router、vue-router原理、vue脚手架本地开发跨域请求设置

• keep-alive

• v-for中为何要使用key

• slot、vue中的prop验证

• vue中$nextTick()作用

• vue修改数据页面不更新

• vue2和vue3的区别

• vue中的provide和inject (依赖注入)

• vue动画transition

• vue中mixins(混入)的使用
  

• vue项目如何部署到nginx服务器
  

VUE3.x

• vue3语法合成型API(Composition API)
• vue2与vue3双向数据绑定的区别
• vue3脚手架使用
• Vue3 ElementPlus Admin后台管理系统（二次开发）

TypeScript

• TypeScript
  
• TypeScript参考文档

React

• 更新中…

微信小程序

• 微信小程序双向数据绑定,父子传参

• 小程序自定义组件封装

• 使用promise封装wx.request()

• 小程序生命周期钩子函数

• 微信小程序上拉加载更多(scroll-view组件)

• 小程序页面跳转有几种方式

• 微信小程序本地存储

• 小程序如何使用vant
  

• 小程序中的吸顶效果（小程序操作DOM）

• 小程序返回到顶部

• 微信小程序授权登陆

• 小程序微信支付流程
  

• 小程序发布流程

uniapp

• uni-app教程一（项目创建、tabbar配置、运行）
  
• uni-app教程二（微信开发者工具运行项目，icon字体使用，组件）
  
• uni-app教程三（全局模块util.js、全局变量、vuex）
  
• uni-app教程四（uni.requet()、网络模块封装）
  
• uni-app教程五（页面跳转、本地数据缓存）
  
• uni-app教程六（常用事件、生命周期）
  
• uni-app教程七（下拉刷新、上拉加载）
  
  待更新....

网络

• 常见的http状态码、HTTP和HTTPS区别、
• 浏览器从输入url到页面加载完成发生了什么；
• 前端安全（XSS、CSRF、sql注入)
• TCP连接(三次握手, 四次挥手)
• get与post区别

性能相关

• vue项目最强优化
• 图片优化
• 图片懒加载
• 路由懒加载
• 节流防抖
• vue-cli4打包webapck优化
• vue项目首页优化
• vue开发seo优化

项目相关

• vue-cli4+vant+rem+sass+vuex+axios封装+webpack搭建移动端项目

• axios拦截与api接口封装

• 路由拦截

• 支付问题

• 登陆鉴权

• websocket实现客服聊天功能

• 第三方登录

• -vue全家桶+Echarts+百度地图，搭建数据可视化系统
  

• Vue+Element后台管理系统导入导出Excel
  

• js实现放大镜功能

• element-ui自定义表单校验规则及常用表单校验
  

• el-form实现表单和图片手动上传和校验

• require与import的区别和使用(CommonJS规范和es6规范)

• app分类WebApp、HybridApp、 NativeApp，

• webapp开发框架

• 使用Hbuilder打包前端网站为WebApp(Android,ios应用)
  

• vue项目如何打包以及如何变成android、ios应用程序
  

• 什么是RESTful API？
  

浏览器

---

• 浏览器内核
• 浏览器如何渲染UI
• DOM Tree如何构建
• 浏览器重绘与重排
• 浏览器同源策略
• 如何实现跨域

工具

• git&gitHub
  
• Vue调试工具vue-devtools安装
• Chrome 性能调试工具

其它

• 推荐一款画流程图工具processon好工具一定要分享给最好的朋友