1、 Vue里面的 computed和watch区别和应用场景能简单介绍一下吗？
computer: (多对一) 使用场景：当一个值受多个属性影响的时候------------购物车商品结算;
watch:(一对多) 使用场景：当一条数据的更改影响到多条数据的时候---------搜索框;
区别：
1、功能上：computed是计算属性，watch是监听一个值的变化，然后执行对应的回调。
2、是否调用缓存：computed中的函数所依赖的属性没有发生变化，那么调用当前的函数的时候会从缓存中读取，而watch在每次监听的值发生变化的时候都会执行回调。
3、是否调用return：computed中的函数必须要用return返回，watch中的函数不是必须要用return。
4, watch 支持异步操作,computed内有异步操作时无效，无法监听数据的变化
2、为什么要在created周期获取数据? beforeMount 什么时候触发？
1, 如果要在created阶段中进行dom操作，就要将操作都放在 Vue.nextTick() 的回调函数中，因为created() 钩子函数执行的时候 DOM 其实并未进行任何渲染，而此时进行 DOM 操作无异于徒劳，所以此处一定要将 DOM 操作的 js 代码放进 Vue.nextTick() 的回调函数中。
2, created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。
注意：对于会影响html布局的数据（比如表格列字段），我建议用created进行初始化，而不是用mounted，否则可能会造成页面卡顿,空标签等...
3,beforMount 载入前（完成了data和el数据初始化），但是页面中的内容还是vue中的占位符，data中的message信息没有被挂在到Dom节点中，在这里可以在渲染前最后一次更改数据的机会，不会触发其他的钩子函数，一般可以在这里做初始数据的获取
3、$emit有什么用？
1、父组件可以使用 props 把数据传给子组件。
2、子组件可以使用 $emit 触发父组件的自定义事件。
4、为什么组件data里面是个函数？
组件最大优点是可被复用，因为对象是一个引用数据类型，如果data是一个对象的情况下会造成所有组件共用一个data。而当data是一个函数的情况下，每次函数执行完毕后都会返回一个新的对象，这样的话每个组件都会维护一份独立的对象（data）
5、hash和history两种模式的区别？
hash模式url里面永远带着#号，我们在开发当中默认使用这个模式。
如果用户考虑url的规范那么就需要使用history模式，因为history模式没有#号，是个正常的url适合推广宣传
功能也有区别，比如我们在开发app的时候有分享页面，有的app里面url是不允许带有#号的，所以要将#号去除那么就要使用history模式
但是使用history模式还有一个问题就是，在访问二级页面的时候，做刷新操作，会出现404错误，那么就需要和后端人配合让他配置一下apache或是nginx的url重定向，重定向到你的首页路由上就ok啦。
6、vue中虚拟DOM原理是什么？
1，数据和模板相结合生成虚拟dom
2，虚拟dom转化成真实dom渲染到页面上
3，当数据发生改变时，新的数据和模板相结合会生成新的虚拟dom
4，新旧虚拟dom进行比对找差异
5，找到差异后根据差异改变dom
6，老的虚拟dom被清除，新的虚拟dom变成老的虚拟dom
7、问一个场景比如给你个列表，后台反馈的数据一万条页面比较卡，在不允许分页的前提下怎么解决这个问题？（如果回答不上来就不问后面的按需加载）
按需加载的实现原理: 当滚动高度与可见高度大于或等于内容高度时，加载下一页的数据。
8、es6中 let和const 还有 var 什么区别？
var : 变量提升,可以重复声明,支持修改;
let : 没有变量提升,不可以重复声明,支持修改;暂时性死区: 快级作用域内存在let命令，它所声明的变量就绑定在这个区域，不再受外部影响
const: 没有变量提升,不可重复声明,不支持修改;
9、es6中扩展运算符 三个点...有用过吗？它有哪些用途？
es6中引入扩展运算符（...），它用于把一个数组转化为用逗号分隔的参数序列，它常用在不定参数个数时的函数调用，数组合并等情形。因为typeScript是es6的超集，所以typeScript也支持扩展运算符。
应用场景: 可变参数个数的函数调用 , 更便捷的数组合并,替代es5的apply方法
10、vue的结构赋值有用过吗？怎么用的？
解构赋值语法是一个 Javascript 表达式，这使得可以将值从数组或属性从对象提取到不同的变量中。
应用场景: 1,可以从数组中提取值，按照对应位置，对变量赋值。
2, 字符串也可以解构赋值。这是因为此时，字符串被转换成了一个类似数组的对象 3, 函数的参数也可以使用解构赋值。
11、秒杀商品时，客户端与服务端的时间是不一致的，如何做倒计?
需要注意：
1.应该使用服务器时间而不是本地时间（本地时间存在时区不同、用户自行设置等问题）。
2.要考虑网络传输的耗时。
3.获取时间时可直接从AJAX的响应头中读取（通过getResponseHeader('Date')来获得），服务器端不需要专门写时间生成脚本。
之前在网上看到有人提问，如何在页面上同步显示服务器的时间，其实实现方法有几种，可能一般人立马就想到可以使用Ajax每隔一秒去请求服务器，然后将服务器获取到时间显示在页面上，这样虽然能够实现，但存在一个很大的问题，那就是每隔一秒去请求服务器，这样如果用户多了，服务器就会崩溃（内存占用率会很大），所以在我看来，这种方法不可行，我这里给出一种解决方案，能够实现同步服务器时间、同步倒计时，却不占用服务器太多资源，下面我给写实现的思路
第一步，当用户第一次浏览页面时，服务器首先获取当前时间并显示在页面上
第二步，设置一个每隔一秒就计算新的时间（新时间以服务器时间为初始值，然后每隔一秒累加一秒并生成新的时间）
第三步，显示第二步计算的时间
是不是很简单，总结成一句话就是：以服务器时间为初始值，然后在页面上自动每隔一秒就累加一秒生成新时间，这样就能保证与服务器时间同步了
12、浏览器渲染机制（如果一段html后面跟一段js，再往后一段html会怎么去执行）
1,加载html->执行script->渲染html;
2,加载第一段html, 执行 js , 渲染第一段html, 加载且渲染第二段html;
13、vue双向绑定，从数据劫持角度会问道为什么data里面数组也能被监听到;
因为vue2将数组方法进行了重写!Vue对数组的7个变异方法（push、pop、shift、unshift、splice、sort、reverse）实现了响应式
14、如果data有一个数组，数组里的数据我把index为0的数据改了但是视图没改，是什么原因怎么解决; Proxy
vue2.x中无法通过数组索引来实现响应式数据的自动更新是vue本身的设计导致的，不是 defineProperty 的锅。
官方文档中对于这两点都是简要的概括为“由于JavaScript的限制”无法实现;尤大大回答是因为性能问题;
15、js的事件循环机制;
渲染进程 => js引擎线程,GUI渲染线程,js事件触发线程,定时触发线程,异步请求线程 => 同步任务 => 异步微任务 => 宏任务:
浏览器器内核拿到内容后，渲染大概可以划分成以下几个步骤：
- 解析html建立dom树
- 解析css构建render树（将CSS代码解析成树形的数据结构，然后结合DOM合并成render树）
- 布局render树（Layout/reflow），负责各元素尺寸、位置的计算
- 绘制render树（paint），绘制页面像素信息
- 浏览器会将各层的信息发送给GPU，GPU会将各层合成（composite），显示在屏幕上。
6. 渲染完毕后就是load事件了，之后就是自己的JS逻辑处理了
16、es6常用的（箭头函数和function区别）;
1.写法不同,箭头函数更加简洁!
2.this的指向不同,箭头函数没有自己的this，它里面的this是继承所属上下文中的this,而且使用call与apply都无法改变
3.箭头函数不可以当构造函数,箭头函数没有prototype，而construct在prototype里面。
4.function存在变量提升，可以定义在调用语句后,箭头函数不存在;
5,箭头函数自带reurn;
17、js的属性;
js的只读属性: 要设置一个对象的值可读，我们可以用更简单的办法,使用defineProperty，将其writable设为false;
js的私有属性:
我们可以知道，实现私有属性，只要是外部无法知道这个属性名，只有内部知道的属性名，就可以做到外部无法访问的特性，基于ES6的新语法symbol和weakMap，我们可以去实现这个能力。
ES2019中已经增加了对 class 私有属性的原生支持，只需要在属性/方法名前面加上 '#' 就可以将其定义为私有，并且支持定义私有的 static 属性/方法，同时我们现在也可以通过 Babel 已使用（babel会把#编译成上面weakMap的形式来实现私有属性），并且 Node v12 中也增加了对私有属性的支持。
18、介绍浏览器的http缓存
1,浏览器缓存(Brower Caching)是浏览器对之前请求过的文件进行缓存，以便下一次访问时重复使用，节省带宽，提高访问速度，降低服务器压力;
2, http缓存机制主要在http响应头中设定，响应头中相关字段为Expires、Cache-Control、Last-Modified、Etag。
3,强缓存：浏览器不会像服务器发送任何请求，直接从本地缓存中读取文件并返回Status Code: 200;
4,协商缓存: 向服务器发送请求，服务器会根据这个请求的request header的一些参数来判断是否命中协商缓存，如果命中，则返回304状态码并带上新的response header通知浏览器从缓存中读取资源；
