什么是原型链？

每一个实例对象上有一个proto 属性，指向的构造函数的原型对象，构造函数的原型 对象也是一个对象， 也有 proto 属性，这样一层一层往上找的过程就形成了原型链。

实例对象的 proto 指向构造函数的 prototype，构造函数的__proto__ 指向Object的 prototype，Object的__proto__ 最终指向null

Javascript中任意数据都能沿着自己的原型链最终找到Object.prototype

什么是闭包？ 闭包有哪些优缺点？

闭包（closure）指有权访问另一个函数作用域中变量的函数。简单理解就是 ，一个作用 域可以访问另外一个函数内部的局部变量。

1
2
3
4
5
6
7
8
9
function fn() {
  var num = 10
  function fun() {
    console.log(num)
  }
  return fun
}
var f = fn()
f()

作用： 延长变量作用域、在函数的外部可以访问函数内部的局部变量，容易造成内层泄露，因为闭包中 的局部变量永远不会被回收

常见的继承有哪些？

一、原型链继承

特点： 1、实例可继承的属性有：实例的构造函数的属性，父类构造函数属性，父类原型的属性。（新 实例不会继承父类实例的属性！

缺点： 1、新实例无法向父类构造函数传参。

2、继承单一。

3、所有新实例都会共享父类实例的属性。（原型上的属性是共享的，一个实例修改了原型属 性，另一个实例的原 型属性也会被修改！）

二、借用构造函数继承

重点： 用 .call()和.apply() 将父类构造函数引入子类函数（在子类函数中做了父类函数的自执行（复 制））

特点： 1、只继承了父类构造函数的属性，没有继承父类原型的属性。

2、解决了原型链继承缺点 1、2、3。

3、可以继承多个构造函数属性（call 多个）。

4、在子实例中可向父实例传参。

缺点： 1、只能继承父类构造函数的属性。

2、无法实现构造函数的复用。（每次用每次都要重新调用）

3、每个新实例都有父类构造函数的副本，臃肿。

三、组合继承（组合原型链继承和借用构造函数继承）（常用）

重点： 结合了两种模式的优点，传参和复用

特点： 1、可以继承父类原型上的属性，可以传参，可复用。

2、每个新实例引入的构造函数属性是私有的。

缺点： 调用了两次父类构造函数（耗内存），子类的构造函数会代替原型上的那个父类构造函 数。

四、原型式继承

重点： 用一个函数包装一个对象，然后返回这个函数的调用，这个函数就变成了个可以随意增添属性的 实例或对象。object.create()就是这个原理。

特点： 类似于复制一个对象，用函数来包装。

缺点： 1、所有实例都会继承原型上的属性。 2、无法实现复用。（新实例属性都是后面添加的）

五、class 类实现继承

通过 extends 和 super 实现继承

六、寄生式继承

重点： 就是给原型式继承外面套了个壳子。

优点： 没有创建自定义类型，因为只是套了个壳子返回对象（这个），这个函数顺理成章就成 了创建的新对象。

缺点： 没用到原型，无法复用。

后台管理系统中的权限管理是怎么实现的？

登录成功后，服务端会返回一个 token（该 token 的是一个能唯一标示用户身份的一个 key），之后我 们将 token 存储在本地 cookie 之中，这样下次打开页面或者刷新页面的时候能记住用户的登录状态，不 用再去登录页面重新登录了。

用户登录成功之后，在全局钩子 router.beforeEach 中拦截路由，判断是否已获得 token，在 获得 token 之后我们就要去获取用户的基本信息了 页面会先从 cookie 中查看是否存有 token，没有，就走一遍上一部分的流程重新登录，如果有 token, 就会把这个 token 返给后端去拉取 user_info，保证用户信息是最新的。 当然如果是做了单点登录得功 能的话，用户信息存储在本地也是可以的。当你一台电脑登录时，另一台会被提下线，所以总会重新登 录获取最新的内容。

es6 有哪些新特性？

ES6 是 2015 年推出的一个新的版本、这个版本相对于 ES5 的语法做了很多的优化、例如：新增了let、 const

let 和 const具有块级作用域，不存在变量提升的问题。新增了箭头函数，简化了定义函数的写法，

同时 可以巧用箭头函数的 this、（注意箭头函数本身没有 this,它的 this 取决于外部的环境），

新增了promise 解决了回调地域的问题，新增了模块化、利用 import 、export 来实现导入、导出。

新增了结构赋值， ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构 （Destructuring）。

新增了class 类的概念，它类似于对象。

v-for 循环为什么一定要绑定 key ?

页面上的标签都对应具体的虚拟 dom 对象(虚拟 dom 就是 js 对象), 循环中 ,如果没有唯一 key , 页面上删除 一条标签, 由于并不知道删除的是那一条! 所以要把全部虚拟 dom 重新渲染, 如果知道 key 为 x 标签被删除 掉, 只需要把渲染的 dom 为 x 的标签去掉即可!

平时都是用什么实现跨域的？

jsonp: 利用 标签没有跨域限制的漏洞，网页可以得到从其他来源动态产生的 JSON 数据。JSONP 请求一 定需要对方的服务器做支持才可以。

JSONP 优点是简单兼容性好，可用于解决主流浏览器的跨域数据访问的问题。缺点是仅支持 get 方法具 有局限性,不安全可能会遭受 XSS 攻击。

声明一个回调函数，其函数名(如 show)当做参数值，要传递给跨域请求数据的服务器，函数形参为要获 取目标数据(服务器返回的 data)。 创建一个 <script> 标签，把那个跨域的 API 数据接口地址，赋值给 script 的 src,还要在这个地址中向服 务器传递该函数名（可以通过问号传参:?callback=show）。

服务器接收到请求后，需要进行特殊的处理：把传递进来的函数名和它需要给你的数据拼接成一个字符 串,例如：传递进去的函数名是 show，它准备好的数据是 show(‘我不爱你’) 。

最后服务器把准备的数据通过 HTTP 协议返回给客户端，客户端再调用执行之前声明的回调函数 （show），对返回的数据进行操作。

CORS：跨域资源共享（CORS）是一种机制；当一个资源访问到另外一个资源(这个资源放在 不同的域名或者不同的协议或者端口)，资源就会发起一个跨域的 HTTP 请求需要浏览器和服务器同时支持；

1.整个 CORS 通信，都是浏览器自动完成。浏览器发现了 AJAX 请求跨源，就会自动添加一些附加的头 信息，有时还会多出一次附加的请求，但用户不会有感觉；

2.实现 CORS 的关键是服务器，只要服务器实现了 CORS 接口，就可以跨源通信

3.服务器对于不同的请求，处理方式不一样； 有简单请求和非简单请求

cookie 、localstorage 、 sessionstrorage 之间有什么区别？

  • 与服务器交互：
    • cookie 是网站为了标示用户身份而储存在用户本地终端上的数据（通常经过加密）
    • cookie 始终会在同源 http 请求头中携带（即使不需要），在浏览器和服务器间来回传递
    • sessionStorage 和 localStorage 不会自动把数据发给服务器，仅在本地保存
  • 存储大小：
  • cookie 数据根据不同浏览器限制，大小一般不能超过 4k
  • sessionStorage 和 localStorage 虽然也有存储大小的限制，但比 cookie 大得多，可以达到 5M 或更大
  • 有期时间：
    • ocalStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据
    • sessionStorage 数据在当前浏览器窗口关闭后自动删除
    • cookie 设置的 cookie 过期时间之前一直有效，与浏览器是否关闭无关

this 的指向有哪些？

1、普通函数中的 this 指向 window

2、定时器中的 this 指向 window

3、箭头函数没有 this,它的 this 指向取决于外部环境、

4、事件中的 this 指向事件的调用者 黑马程序员

5、 构造函数中 this 和原型对象中的 this,都是指向构造函数 new 出来实例对象

6、类 class 中的 this 指向由 constructor 构造器 new 出来的实例对象

7、自调用函数中的 this 指向 window

谈谈你平时都用了哪些方法进行性能优化？

减少 http 请求次数、打包压缩上线代码、使用懒加载、使用雪碧图、动态渲染组件、CDN 加载包。