原生js
1、jQuery.delegate() 函数详解
答：由js动态加载出来的子元素,通过delegate都可以监听得到，delegate主要是一个事件委托
2、js 事件机制有哪些？ 冒泡的实现方式
答：1、事件冒泡 2、事件捕获 3、事件目标
3、js基本数据类型
答：Undefined、Null、Boolean、Number、String、symbol
3、js引用数据类型
答：object、array、function
4、什么是闭包？闭包的原理？优缺点？
答：有权访问另一个函数作用域中的变量的函数
原理：
闭包的实现原理，其实是利用了作用域链的特性，我们都知道作用域链就是在当前执行环境下访问某个变量时，如果不存在就一直向外层寻找，最终寻找到最外层也就是全局作用域，这样就形成了一个链条
闭包优缺点：
作用1：隐藏变量，避免全局污染
作用2：可以读取函数内部的变量
同时闭包使用不当，优点就变成了缺点：
缺点1：导致变量不会被垃圾回收机制回收，造成内存消耗
缺点2：不恰当的使用闭包可能会造成内存泄漏的问题
Es6
1、es6 箭头函数和普通函数的区别?
1、语法上更加简洁
2、箭头函数不会创建自己的this
3、箭头函数的this指向在定义的时候继承自外层第一个普通函数的this。
4、call()/.apply()/.bind()无法改变箭头函数中this的指向（箭头函数的this定义时就已经确定且永远不会改变）
5、箭头函数没有自己的arguments （箭头函数依赖于父级有没有arguments）
6、箭头函数没有prototype(原型)，所以箭头函数本身没有this
2、用es5实现箭头函数？
(function(){
for(var i = 0; i < 5; i ++){
console.log(i) // 0 1 2 3 4
}
})();
console.log(i)
3、let var const 区别？
1、变量提升
使用 var 声明变量 会引起变量提升， let，const不会。
2、块级作用域
let存在块级作用域，var没有
3、重复声明
var可以重复声明
let不允许在相同作用域内，重复声明同一个变量
const 声明一个只读的常量，一旦声明，常量的值就不允许改变
4、暂时性死区
使用let、const命令声明变量之前，该变量都是不可用的（暂时性死区）
4、Map和WeakMap的主要区别：
1.Map对象的键可以是任何类型，但WeakMap对象中的键只能是对象引用
2.WeakMap不能包含无引用的对象，否则会被自动清除出集合（垃圾回收机制）。
css相关
1、css 盒模型？两者的区别？
- IE盒模型 和 w3c盒模型
区别：IE的content部分包含了border和pading
标准的盒模型：标准W3C盒模型包含：内容(content)、填充(padding)、边界(margin)、边框(border)
2、position 都有什么属性？ realive 和 absoult 有什么区别 fixed和 absoult 区别是什么？fixed 是相对谁定位？
static、absolute、relative、fixed
static：没有定位
absolute：绝对定位，相对于static以外的第一个父元素进行定位
relative：相对定位，相对于其正常位置进行定位
fixed：绝对定位，相对于浏览器窗口进行定位
3、css中间自适应两边宽度固定实现？
方案一 浮动：
左: float:left;width:200px 右：width：200px ;float:right
方案二 绝对定位：
左：width:200px ；position: absolute; left:0; 右：width:200px position:absolute;right:0;margin-left:200px;margin-right:200px
方案三 flex:
父元素 display:flex; 左：width:200px 右：宽200px 中间：flex:1
webpack配置
1、webpack属性有哪些?分别是干什么的？
2、webpack 常用plugin有哪些？
3、webpack 配置mock.js 在哪配置？
vue相关
1、vue父子组件与兄弟组件是怎么传递的？ 爷孙怎么传递的？ 孙爷怎么传递的？
父子：props 子父：$emit 兄弟：vuex 爷孙：$attrs 孙爷：$listeners
2、vue生命周期？vue生命周期除了常用的六个 还有其它的么 都在什么情况下用到了？
Beforecreat 实例初始化之后被调用
Created 实例创建完成后被立即调用
beforemount 挂载之前被调用
Mounted 实例挂载后调用
beforeupdate 数据更新时调用
updated 数据更新之后调用
beforedestroy 实例销毁之前调用
destroyed 实例销毁后调用 （在清除定时器的时候使用）
activated keep-alive 组件激活的时候调用
deactivated keep-alive 组件停用的时候调用
3、vue key的作用?
key 的作用说到底就是更新组件是判断两个节点是否相同，相同就复用，不相同就删除旧的创建新的
4、vue for循环key为什么最好不要用index设置？
1、更新DOM的时候会出现性能问题
2、会发生一些状态bug
5、vue diff算法原理？
diff 过程整体遵循 深度优先，同层比较
6、vue2.0与vue3.0区别？
a、在模板里可以放入2个子节点：
<template >
<div>第一个</div>
<div>第二个</div>
</template>
b、data -> setup()
生命周期
beforeMount -> onBeforeMount
mounted -> onMounted
beforeUpdate -> onBeforeUpdate
updated -> onUpdated
destroyed -> onUnmounted
errorCaptured -> onErrorCaptured
import {reactive, ref, onMounted} from 'vue'
export default {
setup(){
const name = reactive({
name:'王'
})
const count=ref(0)
const increamt=()=>{
count.value++
}
onMounted(()=>{
console.log('123')
})
return {name,count,increamt}
}
c、如果要想在页面中使用生命周期函数需要去引用
import {reactive, ref, onMounted} from 'vue'
d、 采用了Proxy来代替Object.defineProperty，
可以做到监听对象属性的增删和数组元素和长度的修改，
还可以监听Map、Set、WeakSet、WeakMap，
同时还实现了惰性的监听，
不会在初始化的时候创建所有的Observer，而是会在用到的时候才去监听。
但是，虽然主流的浏览器都支持Proxy，ie系列却还是不兼容。
e、把作用于插槽改成了函数的方式，这样只会影响子组件的重新渲染，提升了渲染的性能。
f、修改了组件的声明方式，改成了类式的写法，这样使得和TypeScript的结合变得很容易。
7、双向数据绑定的原理？
8、什么是mvvm？什么是mvc？mvc怎么交互的？
9、vue data 里面数组的修改 dom上面能更新么 为什么要用this.$set才能更新？
10、vuex是什么？
11、父子组件传值生命周期执行顺序是什么？
执行的先后顺序为父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted。
12、watch 和 computed 区别？
1、computed 支持缓存,不支持异步
2、watch 支持异步，不支持缓存
3、watch监听的函数接收两个参数，第一个参数是最新的值；第二个参数是输入之前的值
13、聊聊 Vue 的双向数据绑定，Model 如何改变 View，View 又是如何改变 Model 的
Model 改变 View的过程： 依赖于ES5的object.defindeProperty，通过 defineProperty 实现的数据劫持，getter 收集依赖，setter 调用更新回调（不同于观察者模式，是发布订阅 + 中介）
View 改变 Model的过程： 依赖于 v-model ,该语法糖实现是在单向数据绑定的基础上，增加事件监听并赋值给对应的Model
react 相关
1、react shouldcomponentupdata 是做什么的？
2、react setstate是异步还是同步的？ 异步的
异步
网络相关
1、跨域的解决办法？ cors 怎么实现前后端通信的？ 跨域携带cookie 怎么实现？
jsonp: 利用script标签 利用src属性把接口跟一个callback参数传递给服务端
cors:需要浏览器和服务器同时支持 Access-Control-Allow-Origin
postMessage
websocket
跨域携带cookie 怎么实现：withCredentials：true
2、http哪些状态码
200 成功
301 ：永久重定向
302：临时重定向
400：错误的请求
403：禁止访问
404：页面找不到
405：method not allow
500：服务期端错误
3、options请求原理？
就是预检请求原理以获知服务器是否允许该实际请求
4、http和https区别？
https需要ca证书
https相对于http更安全
http端口是80 https端口是443
http应用层 https 传输层
5、 http缓存都有哪些？
强缓存：
协商缓存：
6、get post区别 ？
get用来获取数据，post用来提交数据
get参数有长度限制（受限于url长度，具体的数值取决于浏览器和服务器的限制，最长2048字节），而post受限于服务器的配置。
get请求的数据会附加在url之 ，以 " ？ "分割url和传输数据，多个参数用 "&"连接，而post请求会把请求的数据放在http请求体中。
get是明文传输，post是放在请求体中，但是开发者可以通过抓包工具看到，也相当于是明文的。
get请求会保存在浏览器历史记录中，还可能保存在web服务器的日志中
移动端
1、rem、em、px 、vw、 vh、rpx区别？
rem: 相对于根元素
em： 相对于父元素
px： 像素，长度单位
vw: 可视范围宽度
vh: 可视范围高度
rpx:微信小程序解决自适应屏幕尺寸的尺寸单位
2、移动端rem怎么实现的？
3、原生APP怎么嵌入H5
通过原生wkwebview 组件去回调地址（跟小程序类似 ）
然后h5和安卓和ios沟通方式如下
安卓：Native.postMessage
ios：window.webkit.messageHandlers.Native.postMessage
小程序
1、小程序首页优化方案
控制包的大小-- 必要时做一下分包处理,分包之后总大小16M--图片尽量放cdn--数据大的请求将返回数据放在缓存里--数据做异步处理--路由懒加载
2、小程序的分享怎么实现的？
button 上 open-type="share" 设置send-message-img
3、小程序的登录流程是什么样的？
wx.login - 获取code - request请求code2Session 获取到openid 和session-key 是否有手机号？
库里没有的话？-跳到手机号授权页面-根据iv, encryptedData、code 获取用户的手机号、token值，将token值存缓存
4、mpvue或原生 遇到哪些问题？
mpvue:不支持ElmentUI和Vue-router
不支持部分javascript渲染表达式
不支持使用filters过滤
现在已经支持v-html
原生：navigateto 跳转页面路由不能超过10个
一个主包不可大于2m
接口内容限制1024k
5、小程序生命周期有哪些？组件内生命周期都有哪些？组件间通信方式？
页面内生命周期：onload、onShow、onReady、onHide、onUnload、onPullDownRefresh
组件内生命周期：created、attached、ready、moved、detached、error 可以在这个字段声明（lifetimes）
父传子：直接赋值 子传父：triggerEvent
6、微信小程序怎么判断登录是否过期？
checksession
7、小程序组件是怎么引入的？
useingCompnents
性能优化：
前端性能优化
专题页：打包优化--分包处理--压缩--分域名解析--cdn--缓存---异步--
单页面：路由懒加载--分包处理-chunk把各个功能分包-减少首屏的加载速度--（组件异步）
