这回的面试整的我有点虚，上来第一个问题就把我问住了，说实话确实没难度，但我就是忘了！写篇书记，简单总结下面试过程。
1：cookie、sessionStorage与localStorage的区别？
我虽然知道咋回事，当时就是想不起来，那个场景，太尴尬了！！！
共同点：都是保存在浏览器端，且同源的，一样都是用来存储客户端临时信息的对象。他们均只能存储字符串类型的对象
不同点：
- 生命周期：cookie：可设置失效时间，没有设置的话，默认是关闭浏览器后失效
localStorage：除非被手动清除，否则将会永久保存。
sessionStorage： 仅在当前网页会话下有效，关闭页面或浏览器后就会被清除。
- 存放数据大小：cookie：4KB左右
localStorage和sessionStorage：可以保存5MB的信息。
- HTTP请求：cookie：每次都会携带在HTTP头中，如果使用cookie保存过多数据会带来性能问题
localStorage和sessionStorage：仅在客户端（即浏览器）中保存，不参与和服务器的通信
- 易用性：
cookie：需要程序员自己封装，源生的Cookie接口不友好
localStorage和sessionStorage：源生接口可以接受，亦可再次封装来对Object和Array有更好的支持
2：如何实现垂直居中？
这个的话方法太多，我就简单举2例，典型的如Flex布局实现垂直居中，另外可以通过绝对定位+负margin实现
3：讲下CSS3中的动画如何绘制？
4：说下如何实现移动端的适配？
媒体查询、grid栅格、还可以通过rem或者vw/vh这些实现
- 通过媒体查询的方式：css3的media queries
media queries :主要通过查询不同的宽度来执行不同的css代码，最终以达到界面的配置。
核心语法：
@media screen and(max-width:600px){
/**
*/
html{
font-size:32px;
}
}
- flex+vw的布局方式/flex+百分比的布局方式，实现移动端适配
- rem+viewport缩放
5：说下js的基本数据类型？
number/string/boolean/undefined/null
Object/Symbol/bigInt
6: 说说ES6中的箭头函数和普通函数区别？
箭头函数的定义要比普通函数定义简洁、清晰得多，很快捷
主要是this的差别，箭头函数不会创建自己的this（重要！！深入理解！！）。
MDN上的解释：箭头函数不会创建自己的this，所以它没有自己的this，它只会从自己的作用域链的上一层继承this。
箭头函数没有自己的this，它会捕获自己在定义时（注意，是定义时，不是调用时）所处的外层执行环境的this，并继承这个this值。所以，箭头函数中this的指向在它被定义的时候就已经确定了，之后永远不会改变。
.call()/.apply()/.bind()无法改变箭头函数中this的指向
在箭头函数中使用rest参数代替arguments对象，来访问箭头函数的参数列表！
转换案例
const obj = {
a: 1,
fn: () => {console.log(this.a)}
}
//转换成
var this = this; var obj = { a: 1, fn: function fn() {console.log(this.a)}}
7：讲下你理解的this？
this 就是你 call 一个函数时，传入的第一个参数。
fn()
this => window/global
obj.fn()
this => obj
fn.call(xx)
this => xx
fn.apply(xx)
this => xx
fn.bind(xx)
this => xx
new Fn()
this => 新的对象
fn = ()=> {}
this => 外面的 this
8：你说下在箭头函数中如何实现和arguments类似的功能？
在箭头函数中使用rest参数代替arguments对象，来访问箭头函数的参数列表！
rest参数和扩展运算符都是ES6新增的特性。
rest参数的形式为：...变量名；扩展运算符是三个点（...）。
扩展运算符可以看做是 rest 参数的逆运算
如 let arr=[1,2,3];
(...arr)=>{ console.log(...arr)};
9：讲下Vuex?
管理全局状态.比如登录状态,用户信息状态.或者多页面共用的状态数据
各子页面的状态一般在单个Vue文件管理了.
state-用来存放数据
mutation：用来存放操作数据的方法
action：用来进行异步处理或则进行多批次同步操作，可以通过commit提交mutation中的方法
10: 说说vue中如何进行组件通信？
父子：父传子通过Prop，子传父通过this.$emit
兄弟组件：event Bus、Vuex
11：data中通常有两种放数据的方式，一种是通过函数，一种是通过对象，说下这两者情况？（为什么组件的data要写成函数而不是对象？）
因为如果是对象，那你在所有的地方用的都是同一份数据；
而写成函数，在组建创建的时候，会自动调用一次函数，用函数返回值作为data,，这样的话每次创建组件所用到的data都是不一样的
data可以是一个对象，也可以是一个函数，vue规定了第二种写法，一个函数返回一个对象，只是为了防止数据重用；
12: v-show和v-if的区别？
答: 共同点：都能控制元素的显示和隐藏；
不同点：实现本质方法不同，v-show本质就是通过控制css中的display设置为none，控制隐藏，只会编译一次；v-if是动态的向DOM树内添加或者删除DOM元素，若初始值为false，就不会编译了。而且v-if不停的销毁和创建比较消耗性能。
总结：如果要频繁切换某节点，使用v-show(切换开销比较小，初始开销较大)。如果不需要频繁切换某节点使用v-if（初始渲染开销较小，切换开销比较大）
13：<keep-alive></keep-alive>的作用是什么?
答:keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。
