水平垂直居中
总结：分为定宽高和不定宽高
**1、定宽高：**
绝对定位 + margin
绝对定位 + transform
绝对定位 + left、right、top、bottom
flex
grid
table-cell + vertical-align + inline-block/margin: auto
**2、不定宽高**
绝对定位 + transform
table-cell
flex
flex变异布局（flex + margin：auto）
ES6新特性
如何终止一个请求
XMLHTTPRequest：XMLHTTPRequest.abort()
axios：CancelToken.source();
前端常见单位
vue自定义指令
Promise原理
nextTick实现原理
VUEX相关问题
vuex mutation为什么不能使用异步
async await怎么捕获异常？
zhuanlan.zhihu.com/p/114487312
变量提升 函数提升
apply、call、bind
VUE 30题
发布订阅模式、观察者模式
Vue 主要通过以下 4 个步骤(发布订阅 )来实现数据双向绑定的：
实现双向绑定Proxy比defineproperty优劣如何
Proxy 的优势如下:
Proxy 可以直接监听对象而非属性； Proxy 可以直接监听数组的变化； Proxy 有多达 13 种拦截方法,不限于 apply、ownKeys、deleteProperty、has 等等是 Object.defineProperty 不具备的； Proxy 返回的是一个新对象,我们可以只操作新的对象达到目的,而 Object.defineProperty 只能遍历对象属性直接修改； Proxy 作为新标准将受到浏览器厂商重点持续的性能优化，也就是传说中的新标准的性能红利；
Object.defineProperty 的优势如下:
兼容性好，支持 IE9，而 Proxy 的存在浏览器兼容性问题,而且无法用 polyfill 磨平，因此 Vue 的作者才声明需要等到下个大版本( 3.0 )才能用 Proxy 重写。
vue编译过程
编译模块分为三个阶段
- parse：使⽤用正则解析template中的vue的指令(v-xxx) 、template、slot变量量等等形成抽象语法树AST
2. optimize：标记⼀一些静态节点，⽤用作后⾯面的性能优化，在diff的时候直接略略过
3. generate：把第⼀一部⽣生成的AST 转化为渲染函数 render function
mixin生命周期
async script标签
浏览器输入url后发生了什么
强缓存协商缓存
合理的使用缓存，能有效提升资源加载速度，并且可以节约带宽、减轻服务器压力。
例如，缓存在内存中的文件读取几乎不耗时，缓存在硬盘中的文件一般要几毫秒，而未缓存的文件，加载时间一般要几十毫秒甚至上千毫秒。 如果强制缓存和协商缓存的字段同时存在，强制缓存优先
-
强制缓存
强制缓存会给资源设置一个有效期，如果资源在有效期内则不向远程服务器发起请求，直接读取浏览器缓存，速度最快。
哪些静态资源适用该缓存策略？
- 内容不会变更的文件，比如有版本号的第三方库：xbongbong.oss-cn-hangzhou.aliyuncs.com/cdnfile/js/…
- 内容改变其文件名也会改变的静态文件，比如webpack打包后携带版本号的文件：protfrontweb.zjk.taeapp.com/static/js/a…
-
协商缓存
请求会被发送到服务端，由服务端决定该静态资源是否有修改，如果未改动则告知客户端从浏览器缓存读取，节约了资源从服务端下载到本地的时间。但由于请求已经被发送给了服务端，且由服务端处理并给出响应，因此效率不及强制缓存。
哪些静态资源适用该策略？
- 有可能会被修改的文件，如省市区信息：dingtalkapi.xbongbong.com/js/data.cit…
vue.extend
可枚举和不和枚举属性
可枚举的属性通过Object.keys(target)以及for in/of获取，可枚举和不可枚举的都可以通过Object.getOwnPropertyNames(target)获取）
对象私有属性
计时器不准怎么办
js 为什么是单线程
因为js会用于操作dom，这就决定了js只能是单线程，就比如两个线程的js对同一个dom进行操作，一个删除，一个修改，就会带来复杂的同步问题，避免这种复杂性，js就被设计成了单线程。
js运行环境
- EC（Exucution Context）：执行上下文
- EC（G）：全局执行上下文
- VO （Variable object）：变量对象，当前上下文中，存放创建的变量和值的地方 （每一个执行上下文都会有一个自己的变量对象，函数私有的上下文叫做AO（ACTIVE OBJECT）：活动变量对象）
打开一个网页后浏览器会开辟一块内存，用来供代码执行的=》（ECStack) 执行环境栈，同时浏览器会生产一个全局对象GO，浏览器把内置的一些方法放到单独的内存中，堆内存（heap）返回的16位内存地址给window
全局执行上下文，进入栈内存当中。
函数执行
开辟堆内存空间，将函数以字符串的形式存在内存空间中，返回内存地址给当前函数，方便下次寻找执行。
构造函数执行
形成私有的作用域（栈内存）形参赋值=》变量提升=》在js代码自上而下执行之前，当前栈内存中开辟一个堆内存，并且让函数的执行主体THIS指向这个堆内存。代码执行完毕之后，返回之前创建的内存地址（浏览器默认返回）。如果写了return，如果是基本值则依然是实例，如果返回的是引用值，则覆盖默认返回的实例。new Fn 和 new Fn()没有区别，同样都为创建实例。
hasOwnProperty ： 检测私有属性
js变量提升
js执行顺序
垃圾回收机制
数组去重
v-for 如果数据改变 是如何进行对比
vue中循环数组对象不建议用index作为v-for的key
当我们修改了数据，数据的变动会触发订阅该数据变化的dom对象的更新，这个过程大致可分为三个阶段：
- 首选是会重新构建虚拟dom树
- 然后对比新旧虚拟dom树的节点,这里使用的就是大名鼎鼎的
differ算法，也是这里要展开讲述的核心 - 根据对比结果，删除、添加、更新真实的dom节点。而非全部更新替换，这也就是虚拟dom的优势所在。
v-for v-if优先级在vue2、vue3区别
2.x 语法
2.x 版本中在一个元素上同时使用 v-if 和 v-for 时，v-for 会优先作用。
# 3.x 语法
3.x 版本中 v-if 总是优先于 v-for 生效
304状态码
301 redirect: 301 代表永久性转移(Permanently Moved)
302 redirect: 302 代表暂时性转移(Temporarily Moved )
304 Not Modified: 当协商缓存命中时会返回这个状态码（如果是强制缓存命中呢）
html,xhtml区别
- 用途不同 html用于显示数据，xhtml用于数据传输和存储
- XHTML 元素必须被关闭，非空标签必须使用结束标签：
- XHTML 元素必须小写：
tcp，udp区别 断开连接了该怎么知道（心跳检测）
CP向上层提供面向连接的可靠服务 ，UDP向上层提供无连接不可靠服务。 虽然 UDP 并没有 TCP 传输来的准确，但是也能在很多实时性要求高的地方有所作为 对数据准确性要求高，速度可以相对较慢的，可以选用TCP
ajax同步和异步
在mounted中this.xxx = xxx 这样的做法的好处是什么
xxx可以不是响应式的变量 同时又能在模板template中使用 适合一般不会改变的数据
css盒模型
浮动的元素怎么居中
css如何选择一个列表中的奇数行或者偶数行
li:nth-of-type(odd) {......} /*--这是奇数行--*/
li:nth-of-type(even) {......} /*--这是偶数行--*/
xss攻击
排好序的数组如何打乱顺序
浏览器请求的并发量
不同浏览器对并发限制也不尽相同：
http1.0和2.0
HTTP2.0和HTTP1.X相比的新特性
新的二进制格式（Binary Format） ，HTTP1.x的解析是基于文本。基于文本协议的格式解析存在天然缺陷，文本的表现形式有多样性，要做到健壮性考虑的场景必然很多，二进制则不同，只认0和1的组合。基于这种考虑HTTP2.0的协议解析决定采用二进制格式，实现方便且健壮。
多路复用（MultiPlexing） ，即连接共享，即每一个request都是是用作连接共享机制的。一个request对应一个id，这样一个连接上可以有多个request，每个连接的request可以随机的混杂在一起，接收方可以根据request的 id将request再归属到各自不同的服务端请求里面。
header压缩，如上文中所言，对前面提到过HTTP1.x的header带有大量信息，而且每次都要重复发送，HTTP2.0使用encoder来减少需要传输的header大小，通讯双方各自cache一份header fields表，既避免了重复header的传输，又减小了需要传输的大小。
服务端推送（server push） ，同SPDY一样，HTTP2.0也具有server push功能。
css如何选择带有某个属性的元素
CSS [attribute] 选择器，[attribute] 选择器用于选取带有指定属性的元素。
下例选择所有带有 target 属性的 元素；
a[target] {
background-color: yellow;
}
计算属性缓存 vs 方法
composition API
用reduce实现map方法
Array.prototype._map = function(callback){
if(typeof callback === 'function') {
return this.reduce((prev,item,index,arr) => {
prev.push(callback(item,index,arr))
return prev
},[])
} else {
console.log(new Error('callback is not function'))
}
}
TS比JS的优势
虚拟列表
如果有一百个接口需要请求，如何在最短时间内请求完毕（同一时间内请求数量不能超过五个）
typeof、instanceof的缺陷及解决办法
如何遍历对象中不可枚举属性
如何判断是数组？
let arr = []
- arr isntanceof Array
- arr.proto === Array.prototype
- arr.constructor === Array
- Object.prototype.toString.call(arr) === '[object Array]'
- Array.isArray(arr)
其中方法1，2，3 主要是通过原型去判断的， 4是通过object类型的副属性class去判断的，其中函数的class是Function，结果是[object Function]， 普通的对象是Object，结果是[object Object]，5是es6新增的方法
如何实现a == 1 && a== 2
在页面中渲染一万条数据的最优解
如何防止重复发送请求？
vue页面中某个表格中的数据修改了，怎么让数据局部刷新，不影响整体？
key
vuex刷新数据会初始化原理？怎么解决？
LS
