gogogo).节流和防抖
防抖：在事件被触发n秒后在执行回调，如果这n秒内又被触发就重新调用节流：规定在一定事件内，只能触发一次函数，如果触发多次，只有一次生效
1).闭包
要了解闭包，就要先了解他的作用域，全局作用域，局部作用域，块级作用域js函数内部可以访问函数外部的变量，函数外部无法访问函数内部的变量，闭包就是为了解决这一难题而产生的闭包就是函数内部和外部连接起来，闭包有一个封闭性的特定，一旦形成闭包，尾部就无法访问闭包里面的数据了优点：可以模仿块级作用域，有所有成员的存在，变量不会就行回收存储在内存中，防止变量污染缺点：因为变量存储在内存中，使用不当会造成内存泄露，让使用过后的变量无法进行回收，一直站着内存使用场景：节流，防抖，定时器
2).作用域
1.全局作用域(js最外层的作用域)2.函数作用域(通过函数创建函数作用域，可以嵌套)3.块级作用域(ES6提供) if{},for(){},while(){}
3).原型原型链
原型
1.每个实例对象都有__proto__属性，叫隐士原型，他指向自身构造函数的显示原型prototype2.每个函数都有一个prototype属性，叫显示原型3.每个prototype原型上都有一个constructor，指向他关联的构造函数
原型链
1.实例化对象的__proto__指向构造函数的prototype2.构造函数prototype的__proto__指向Object.prototype3.Object.prototype的__proto__指向null
4).继承
原型链继承
//吧父类的实例指向子类的实例//缺点：不可传参function Fu(){this.arr=['red','yellow']}function Zi(){}Zi.prototype=new Fu()let a=new Zia.arr.push('green')console.log(a.arr)
构造函数继承
//在子类里通过call或apply修改this指向//可以传参function Fu(){this.arr=['red','yellow']}function Zi(){Fu.call(this)}let a=new Zi()a.arr.push('green')console.log(a.arr)
组合式继承
//就是把原型链继承和构造函数继承组合起来用
class类继承
//通过extends来说明，super来继承class Fu{constructor(){this.arr=['red','yellow']}}class Zi extends Fu{constructor(){super()}}
5).深拷贝，浅拷贝
深拷贝
//深拷贝就是吧引用地址和对象都复制过来let a=[1,2,3]let b=JSON.stringify(a)let c=JSON.parse(b)a[0]=999console.log(a,c)
浅拷贝
//浅拷贝只是复制一成引用地址let a=[1,2,3]let b=aa[0]=999console.log(a,b)
6).promise，async/await
promise
promise可以让异步同步化，按照期望的顺序执行，返回预期的效果，从语法上讲是一个对象，里面是返回的结果目的就是解决地域回调问题，提供了简介的API，让操作异步更简单有三个状态，正在进行，成功，失败，状态一旦更变就无法进行修改了使用方式:new Promise(),有两个参数resolve，reject
async/await
async是在方法前面写，会返回一个promise对象，await是在异步前面写，表示上一步操作完成之后在进行下一步，同步化用了async和await之后就不需要用promise的API方法了，可以直接结构赋值到变量中
7).双向数据绑定
数据劫持订阅者和发布者，通过Object.defineProperty()劫持各个属性的setter，getter，当数据发生改变时通知订阅者，触发相应的监听回调
8).虚拟DOM，diff算法
虚拟DOM
就是把真实dom节点中的操作在虚拟dom中完成，比如添加，删除节点虚拟dom的最终目的就是把节点插入到真实的dom中
diff算法
就是创建一个虚拟的DOM树，然后变成真实的dom树插入到节点中，当数据发生改变时，从新创建一个dom数，比较并保存两个的差异，通知视图进行更新
9).组件通信
父传子
1.在父组件中先通过import引入子组件，然后注册，在页面写入标签2.在父组件的子组件标签中自定义属性，等于要传输的变量3.在子组件中通过props来接收
子传父
1.在子组件中写方法通过this.$emit('方法',传的值)2.在父组件中先通过import引入子组件，然后注册，在页面写入标签3.在父组件的子组件标签中写在子组件中定义的方法
兄弟组件传值
1.创建一个Bus.js事件中心2.使用时通过import引入3.传递是通过this.$emit()传递，this.$on()接收//还可以通过vuex传递
10).vuex
vuex有5个状态status,mutations,getters,actions,modules1.status是保存数据的2.mutations是可以直接操作status中的数据的3.getters相当于计算属性，依赖于status4.actions异步操作5.modules模块分发
11).keep-alive
是vue提供给我们的一个组件，可以保存当前组件的状态使用方式：1.在router要设置缓冲的路由里设置meta属性，里面写一个keep-alive为true2.在router-view通过if判断是否存在keep-alive，如何存在就可以缓冲
12).自定义组件
1.命名要用驼峰命名法2.引入用i没import来引入,然后注册3.页面写入标签
13).自定义指令
很多时候我们需要直接操作 dom 元素，如果只是个别需要操作 dom 元素，我们可以通过 ref 获取当前 dom 元素，并对其进行操作，但是如果特别多的时候，我们不可能每次都去写一遍 ref 还有方法，所以这时候自定义指令就可以帮你轻松解决这个问题分为全局和局部;钩子函数：bind：只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。inserted：被绑定元素插入父节点时调用update：所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前。componentUpdated：指令所在组件的 VNode 及其子 VNode 全部更新后调用。unbind：只调用一次，指令与元素解绑时调用。钩子函数的参数：**el**: 指令所绑定的元素，可以用来直接操作 DOM，就是放置指令的那个元素。**binding**: 一个对象，里面包含了几个属性：value:指令的绑定值，name:指令名等；**vnode**：Vue 编译生成的虚拟节点。**oldVnode**：上一个虚拟节点，仅在 update 和 componentUpdated 钩子中可用。
14).路由守卫
1.全局守卫（前，后）2.路由独享守卫3.组件内守卫
15).生命周期
beforeCreate(创建前)：这是数据创建完成之前，这个阶段实例的data,methods这些是都访问不到的Created(创建后)：数据加载完成，是最早能够获取数据的函数无法获取DOM节点，这个阶段已经完成了数据观测，属性和方法的运算，但是数据并没有在DOM元素上进行渲染；可以从服务器获取一些初始化的数据，还有通过ajax向服务器发送一些数据。beforeMounted(挂载前)：数据加载完成之后，DOM加载完成之前，只是模板和数据进行结合，但是没有挂载到页面上，可以在这里进行数据的最后修改Mounted(挂载后)：DOM节点挂载完成之后，最早可以操作DOM的函数；可以完成模板中的html渲染到页面上。这里面可以进行ajax交互。可以进行axios数据请求；而且mounted只会执行一次；beforeUpdate(更新前)：在数据更新之前调用；会更新当前组件数据，但不会在页面渲染出来；Updated(更新后)：data数据改变的时候，影响到DOM的时候；在这里可以获取到最新的DOM结构；beforeDestroy(销毁前)：在实例销毁之前调用，这个时候实例还可以使用，在这里可以清除一些组件中的定时器和监听dom事件Destroy(销毁后)：实例化销毁的时候触发；所有的事件监听器都会被清除，这个函数在服务器端渲染期间不被调用；第一次加载页面只会触发前四个钩子函数；
16).跨域
1.jsonp2.后台允许跨域3.代理跨域
17).常见状态码
200：表示请求成功400:请求错误401：没权限403：拒绝访问404：为找到该资源408：请求超时500：服务端错误
18).输出url到页面发生了什么
1. 通过DNS服务器：url=>ip地址；2. 到达ip地址对应的服务器；3. 服务器接收用户的请求；4. 把处理后的结果返回给客户端；5. 客户端把结果渲染到浏览器即可，最后页面显示出来输入了一个域名,域名要通过DNS解析找到这个域名对应的服务器地址(ip),通过TCP请求链接服务,通过WEB服务器(apache)返回数据,浏览器根据返回数据构建DOM树,通过css渲染引擎及js解析引擎将页面渲染出来,关闭tcp连接
19).异步加载图片
function Create(url) {return new Promise((resolve, reject) => {let oimg = new Image();//创建img标签oimg.onload = () => {resolve(oimg)}oimg.onerror = () => {reject(`'${oimg}' is not find`)}oimg.src = url})}Create('./img/1.jpg').then(res => {document.body.append(res)console.log(res)})
