前言
这是我第一次写掘金博客了，有些内容可能表述得不是很好，欢迎大家来指正。由于我们学校的软件工程专业大三下开始就不用上课了，所以我这两三个月都在自学前端相关知识准备找实习还要忙着考驾照啥的，直到六月中旬才把简历准备好，然后开始投简历找实习。以下就是面试的大概内容了。
第一家公司
1、es6新增了哪些内容？
解构与赋值、块级作用域、模板字符串、扩展运算符、Set、Map、Symbol、proxy、箭头函数、promise、async/await、for ... of、Reflect等等。
关于es6相关的内容我强烈推荐看阮一峰的《es6入门教程这本书》
2、对脚手架的理解？
一句话概括：就是快速构建项目环境的工具
安装完脚手架之后我们可以通过一些命令来快速实现项目基础环境的搭建，不用手动从零去配置各种文件，脚手架会帮我们自动生成了规范性的项目文件目录。例如，在vue项目中我们就可以使用脚手架用npm install -g @vue/cli来帮我们快速搭建vue项目环境，然后使用vue create *** 来创建项目。
3、vue如何实现动态路由？
什么是动态路由？
动态路由，我们可以根据自己不同的需求加载不同的路由，做到不同的实现及页面的渲染，动态路由的使用一般结合角色权限控制一起使用。动态的路由存储可分为两种，一种是将路由存储到前端。另一种则是将路由存储到数据库。
怎么实现动态路由？
以路由存储到前端为例：
在路由配置里，通过meta属性，扩展权限相关的字段，在路由守卫里通过判断这个权限标识，实现路由的动态增加，及页面跳转；如：我们增加一个role字段来控制角色。
以路由存储在数据库为例：
一般我们在登录的时候，根据登录用户的角色返回此角色可以访问的页面的路由，前端将路由存储到vuex(vuex存储的数据必须可持久的，不要一刷新页面就不见),我们在路由前置守卫处动态添加拿到的路由，对页面进行渲染。
4、jq和js对象如何相互转换？
js对象转换成jq对象的语法：$(js对象)
var obj=document.getElementById('obj') //js对象
var obj=$(obj) //jq对象
jq对象转换成js对象的语法：jq对象[索引] 或 jq对象.get(索引)
//第一种方法
var jq=$('#btn')
var js=jq[0]
//第二种方法
var js=jq.get[0]
5、new操作符做了什么？
第一步：创建一个空对象
第二步：绑定原型，将对象的原型设置为函数的prototype对象
第三步：绑定this，执行构造函数的代码，为这个新对象添加属性
第四步：返回这个对象
6、写一下数组的冒泡排序算法？
function bubbleSort(arr) {
for (var i = 0; i < arr.length; i++) {
for (var j = 0; j < arr.length - 1 - i; j++) {
if (arr[j] > arr[j + 1]) {
var temp=null
temp = arr[j + 1];
arr[j + 1] = arr[j];
arr[j] = temp;
}
}
}
return arr;
}
7、display:none 和 visibility:hidden的区别
display:none
元素隐藏，不占据文档流，属于非继承属性
visibility:hidden
元素隐藏，仍占据文档流，属于继承属性
8、描述一下cookies、localStorage和localStorage的区别
生命周期
cookie：可设置失效时间，没有设置的话，默认是关闭浏览器后失效
localStorage：储存时间没有限制，除非被手动清除，否则将会永久保存
sessionStorage： 仅在当前网页会话下有效，关闭页面或浏览器后就会被清除
存放数据大小
cookie < localStorage、sessionStorage
http请求
cookie：每次都会携带在HTTP头中
localStorage和sessionStorage：仅在客户端（即浏览器）中保存，不参与和服务器的通信
第二家公司
1、vue的生命周期的理解？
Vue 实例有⼀个完整的⽣命周期，也就是从开始创建、初始化数据、编译模版、挂载Dom -> 渲染、更新 -> 渲染、卸载 等⼀系列过程，称这是Vue的⽣命周期。
1、beforeCreate ：数据观测和初始化事件还未开始，此时 data 的响应式追踪、event/watcher 都还没有被设置，也就是说不能访问到data、computed、watch、methods上的方法和数据。
2、created ：实例创建完成，实例上配置的 options 包括 data、computed、watch、methods 等都配置完成，但是此时渲染得节点还未挂载到 DOM，所以不能访问到 $el 属性。
3、beforeMount ：在挂载开始之前被调用，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数据和模板生成html。此时还没有挂载html到页面上。
4、mounted ：在el被新创建的 vm.$el 替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html 页面中。此过程中进行ajax交互。
5、beforeUpdate ：响应式数据更新时调用，此时虽然响应式数据更新了，但是对应的真实 DOM 还没有被渲染。
6、updated：在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。此时 DOM 已经根据响应式数据的变化更新了。调用时，组件 DOM已经更新，所以可以执行依赖于DOM的操作。然而在大多数情况下，应该避免在此期间更改状态，因为这可能会导致更新无限循环。该钩子在服务器端渲染期间不被调用。
7、beforeDestroy ：实例销毁之前调用
8、destroyed ：实例销毁后调用，调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。该钩子在服务端渲染期间不被调用。
另外还有 keep-alive 独有的生命周期，分别为 activated 和 deactivated 。用 keep-alive 包裹的组件在切换时不会进行销毁，而是缓存到内存中并执行 deactivated 钩子函数，命中缓存渲染后会执行 activated 钩子函数。
2、vue和uni-app的理解（区别）？
uni-app是一个使用vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web、以及各种小程序、快应用等多个平台。
vue在web上是为单页应用而生的，在app上，单页应用会卡死。uni-app还有自动的框架预载，加载页面的速度更快。
uni-app使用小程序的标签，而vue使用web端的标签。
uni-app不支持使用vue-router,使用自带的路由。
uni-app支持使用vuex来管理数据。
3、对UDP和TCP的理解？
4、如何做到图片懒加载和路由懒加载？
图片懒加载
我后面会结合一个简单demo来解释
路由懒加载
component:()=>import('组件路径')
5、对防抖与节流的理解？你在项目中如何使用它？
防抖：在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时，以最后一次为准。使用场景，例如搜索框的搜索联想功能，用户在不断输入值时，用防抖来节约请求资源。
节流：规定在一个单位时间内，只能触发一次函数。如果这个单位时间内触发多次函数，只有一次生效。使用场景，鼠标不断点击触发，单位时间内只触发一次回调。
我在项目是直接使用lodash库提供的_.debounce()函数和_.throttle()函数。
6、对lodash库的原理你有了解吗？过程大概是怎样的？
可以参考以下两篇文章：
7、你是如何实现前端大文件上传的？
主要是用到了分片上传和断点续传的技术
后续我会结合一个简单demo来解释
8、描述一下你在项目中在如何处理数据
以Vue项目为例，我会先在Vue页面的生命周期函数created写异步请求，将请求回来的数据存储在vuex中，在computed中向vuex仓库中获取数据，并对数据进行简化处理，再渲染到页面上。
第三家公司
1、计算机网络有几层？
按照OSI参考模型有七层
2、你对tcp/udp的理解？
上面有
3、说一下tcp三次握手的过程？
TCP三次握手：
首先客户端向服务器发送一个 SYN 连接请求报文段和一个随机序号，服务端接收到请求后向客户端发送一个 SYN ACK报文段，确认连接请求，并且也向客户端发送一个随机序号。
客户端接收服务器的确认应答后，进入连接建立的状态。
同时向服务器也发送一个ACK 确认报文段，服务器端接收到确认后，也进入连接建立状态，此时双方的连接就建立起来了。
4、你项目中的token鉴权是怎么做的？
5、token加密的方式有几种？
base64、SHA-256 安全散列算法的一种（hash）、HMAC-SHA256、RSA256非对称加密
6、微信小程序的项目结构是怎样的？以及它们各自的作用？
各个文件的作用
pages：存放所有小程序的页面，通常一个页面包含4个不同扩展名的.wxml、.wxss、.js和.json文件，分别用来表示页面结构文件、页面样式文件、页面逻辑文件和页面配置文件
app.js：小程序项目的入口文件（配置第三方插件等）
app.json：小程序项目的全局配置文件（所有页面路径、窗口外观、界面表现、底部 tab等）
app.wxss：小程序项目的全局样式文件
project.config.json：项目的配置文件（项目名称，账号id等）
sitemap.json：用于配置小程序及其页面是否允许被微信索引
7、说一下vue的生命周期
上面有
8、懒加载你是怎么做的？
上面有
9、图片懒加载后你是如何释放资源的？
10、做过性能优化吗？性能优化的方式有哪些？
使用CDN来加速这些资源（媒体文件、软件、文档等）的访问
使用懒加载的方式在长网页中延迟加载图片数据，是一种较好的网页性能优化的方式
按需加载UI库中的组件
使用防抖与节流函数减少请求次数，减轻服务器的压力
小图使用 base64 格式，修饰图片完全可以用 CSS 去代替
Webpack优化：
压缩代码：删除多余的代码、注释、简化代码的写法等等⽅式。可以利⽤webpack的 UglifyJsPlugin 和 ParallelUglifyPlugin 来压缩JS⽂件， 利⽤ cssnano （css-loader?minimize）来压缩css
利⽤CDN加速: 在构建过程中，将引⽤的静态资源路径修改为CDN上对应的路径。可以利⽤webpack对于 output 参数和各loader的 publicPath 参数来修改资源路径
Tree Shaking: 将代码中永远不会⾛到的⽚段删除掉。可以通过在启动webpack时追加参数 --optimize-minimize 来实现
Code Splitting: 将代码按路由维度或者组件分块(chunk),这样做到按需加载,同时可以充分利⽤浏览器缓存
提取公共第三⽅: SplitChunksPlugin插件来进⾏公共模块抽取,利⽤浏览器缓存可以⻓期缓存这些⽆需频繁变动的公共代码
11、你对echarts的理解？
12、对session的理解？
cookie存在于客户端，session存在于服务端，当用户登录网站后，会生成一个session对象，里面存着用户的信息，然后服务器将sessionid以cookie的形式返回给客户端，同时session安全性也比cookie高，存储大小比cookie要大（session大小无限制，但cookie只有4kb大小）
13、浏览器的工作原理？
14、git的常用命令有哪些？以及如何合并分支？
git init : 在当前目录新建一个代码库
git config : 设置代码提交时候的信息，例如用户名，电子邮件地址
git clone ：从服务器端克隆项目到本地
git status ：查看文件修改状态
git diff : 查看该文件与上次提交修改代码的差别
git checkout –b 分支名称 : 新建一个临时分支
git checkout 分支名称 : 切换分支
git branch : 查看所有的分支
git branch –D temp : 强制删除一个分支
git pull : 将服务端代码更新到本地
git add 文件路径 : 提交文件到暂冲区
git add –A : 提交所有的需要add 的文件到缓冲区
git commit –m ‘提交说明’ : 将缓冲区的文件提交到本地库中
git push origin master : 将已经提交到本地的仓库的代码push到远程服务器
git log : 显示提交的日志
git show [commit 的Id] : 显示某次提交的元数据和内容变化
git show [commit Id] –-stat : 显示提交的文件名称
git checkout : 恢复暂存区的所有文件
git reset [file/commit ID] : 重置暂存区的指定文件。用来撤销git commit
git reset –hard [commit 的Id] : 将本地版本退回到提交之前的版本。这个操作会将自己新写的代码全部撤销没了
git cherry-pick temp : 合并临时分支到当前分支
git commit –amend : 修改最近一次提交说明的内容同时可以合并提交
最后
有时间再来慢慢整理剩余的部分，非常抱歉.......
