想要通过前端面试顺利进入一线大厂成就高薪前端梦。那么首先，我们得知道前端面试中，社招和校招究竟有啥区别？
对于前端开发来说，如果说社招更看重对前端技术体系的深入理解，以及解决问题的能力话，那校招更看重的其实是基本功和学习能力（或者说是潜力）。
但其实，无论是社招还是校招，面试的时候都会问到一些曾经操作过的项目，尤其是大厂，或者热门高薪部门，面试官除必问的技术经验外，也会对技术深度进行一个基础的考核，那在这种情况下如何hold住大厂面试呢？
前端面试三要素：简历、个人介绍、技术能力。下面，就来分别聊一聊。
1、简历筛选关：
HR一般会去看简历中所提的技术栈是否匹配，怎么看呢？我们可以抓住简历中的技术名词，一般来说如果一点技术名词都没有提到，那么大概有以下几种可能：很水、很牛但概率很小、不会写简历。所以，一部分人可能会因为简历的问题没有了面试机会，这点是需要非常注意的。
2、个人介绍关：
通过了简历筛选阶段，就真正到了面试环节。这时候一定要准备好一段最多3分钟的个人介绍。请注意，最多3分钟！言简意赅的说明自己的工作时间，擅长技术栈和自己的工作预期。
3、项目经验表达：
对前端开发学习者而言，JS并不陌生，但大厂的JS面试题却总是显得很“陌生”，怎么样能够真正做到深入理解与高级应用？这不仅是面试过程中对前端求职者的要求，也是大多数前端开发者的痛点。
大厂面试中，面试官除了关注你的项目经验外，还往往喜欢和面试者深入探讨前端某些技术领域成体系的前端知识。比如：模块化、异步解决方案、网络、框架及原理、线程等，但在与面试官的正面battle中，求职者总会败下阵来。
所以，建议大家在Web前端面试前一定要注重这三个方面的内容。注重了这些想找找到一份适合的Web前端开发工作并不是难事。
Vue面试题，React面试题，JS面试题，HTTP面试题，工程化面试题，CSS面试题，算法面试题，大厂面试题，高频面试题都需要刷刷。
v-if和v-show区别
当条件不成立时，v-if不会渲染DOM元素，v-show操作的是样式(display)
v-if 适用于在运行时很少改变条件，不需要频繁切换条件的场景；
v-show 则适用于需要非常频繁切换条件的场景。
为什么 v-for 和 v-if 不建议用在一起
当 v-for 和 v-if 处于同一个节点时，v-for 的优先级比 v-if 更高，这意味着 v-if 将分别重复运行于每个 v-for 循环中。如果要遍历的数组很大，而真正要展示的数据很少时，这将造成很大的性能浪费
虚拟DOM树
组件中的data为什么是一个函数
一个组件被复用多次的话，也就会创建多个实例。本质上，这些实例用的都是同一个构造函数。
如果data是对象的话，对象属于引用类型，会影响到所有的实例。所以为了保证组件不同的实例之间data不冲突，data必须是一个函数。
事件 事件冒泡
性能优化
vue和小程序区别
null和undefined
1.null 表示一个值被定义了，定义为“空值”；undefined 表示根本不存在定义。
2.设置一个值为 null 是合理的；设置一个值为 null 是合理的。
Vue事件绑定原理是什么
原生事件绑定是通过addEventListener绑定给真实元素的，组件事件绑定是通过Vue自定义的$on实现的。
route 和router的区别
router为VueRouter的实例，相当于一个全局的路由器对象，里面含有很多属性和子对象，例如history对象。。。经常用的跳转链接就可以用this.$router.push，和router-link跳转一样
route相当于当前正在跳转的路由对象，可以从里面获取name,path,params,query等
父子传参的方式
父向子传值props
子向父传参 emitemitemiton
v-model 双向数据绑定原理
v-model是用来在表单控件或者组件上创建双向绑定的
他的本质是v-bind和v-on的语法糖
在一个组件上使用v-model，默认会为组件绑定名为value的prop和名为input的事件
cookies，sessionStorage和localStorage的区别？
共同点：都是保存在浏览器端，且是同源的。
区别：cookies是为了标识用户身份而存储在用户本地终端上的数据，始终在同源http请求中携带，即cookies在浏览器和服务器间来回传递，而sessionstorage和localstorage不会自动把数据发给服务器，仅在本地保存。
存储大小的限制不同。cookie保存的数据很小，不能超过4k，而sessionstorage和localstorage保存的数据大，可达到5M。
数据的有效期不同。cookie在设置的cookie过期时间之前一直有效，即使窗口或者浏览器关闭。sessionstorage仅在浏览器窗口关闭之前有效。localstorage始终有效，窗口和浏览器关闭也一直保存，用作长久数据保存。
作用域不同。cookie在所有的同源窗口都是共享；sessionstorage不在不同的浏览器共享，即使同一页面；localstorage在所有同源窗口都是共享.
响应式/兼容
对响应式布局的看法
响应式布局有缺点也有优点。PC端页面需要兼容那些浏览器
浏览器不断更新，人们所熟知所使用的浏览器已不再是电脑自带的浏览器，vuex
关于vuex的面试题网上的比较多，仅作参考
1、有哪几种属性
有 5 种，分别是 state、getter、mutation、action、module
state => 基本数据
getters => 从基本数据派生的数据
mutations => 提交更改数据的方法，同步！
actions => 像一个装饰器，包裹mutations，使之可以异步。
modules => 模块化Vuex
2、vuex 的 store 特性是什么
(1) vuex 就是一个仓库，仓库里放了很多对象。其中 state 就是数据源存放地，对应于一般 vue 对象里面的 data
(2) state 里面存放的数据是响应式的，vue 组件从 store 读取数据，若是 store 中的数据发生改变，依赖这相数据的组件也会发生更新
(3) 它通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性
3、 vuex 的 getter 特性是什么
(1) getter 可以对 state 进行计算操作，它就是 store 的计算属性
(2) 虽然在组件内也可以做计算属性，但是 getters 可以在多给件之间复用
(3) 如果一个状态只在一个组件内使用，是可以不用 getters
4、vuex 的 mutation 特性是什么
action 类似于 muation, 不同在于：action 提交的是 mutation,而不是直接变更状态
action 可以包含任意异步操作
5、vue 中 ajax 请求代码应该写在组件的methods中还是vuex 的action中
如果请求来的数据不是要被其他组件公用，仅仅在请求的组件内使用，就不需要放入 vuex 的 state 里
如果被其他地方复用，请将请求放入 action 里，方便复用，并包装成 promise 返回
6、不用 vuex 会带来什么问题
可维护性会下降，你要修改数据，你得维护3个地方
可读性下降，因为一个组件里的数据，你根本就看不出来是从哪里来的
增加耦合，大量的上传派发，会让耦合性大大的增加，本来Vue用Component就是为了减少耦合，现在这么用，和组件化的初衷相背
复制代码