1. null，undefined 的区别？
null 表示一个对象被定义了，值为“空值”；
undefined 表示不存在这个值。
2. 防抖函数和节流函数的共同点和区别
相同:在不影响客户体验的前提下,将频繁的回调函数,进行次数缩减.避免大量计算导致的页面卡顿.
不同:防抖是将多次执行变为最后一次执行，节流是将多次执行变为在规定时间内只执行一次.
防抖函数定义
指触发事件后在规定时间内回调函数只能执行一次，如果在规定时间内又触发了该事件，则会重新开始算规定时间。
网上有这个比喻:函数防抖就是法师发技能的时候要读条，技能读条没完再按技能就会刷新技能,重新进行读条
四个字总结就是 延时执行
防抖函数场景
搜索框输入查询，如果用户一直在输入中，没有必要不停地调用去请求服务端接口，等用户停止输入的时候，再调用，设置一个合适的时间间隔，有效减轻服务端压力。
表单验证
按钮提交
浏览器窗口缩放，resize事件等
3. HTTP状态码及其含义
200：请求成功
201：请求成功并且服务器创建了新的资源
302：服务器目前从不同位置的网页响应请求，但请求者应继续使用原有位置来响应以后的请求。
304：自从上次请求后，请求的网页未修改过。服务器返回此响应时，不会返回网页内容。
400：服务器不理解请求的语法。
404：请求的资源（网页等）不存在
500：内部服务器错误
全部状态码：
1XX：信息状态码
100 Continue 继续，一般在发送post请求时，已发送了http header之后服务端将返回此信息，表示确认，之后发送具体参数信息
2XX：成功状态码
200 OK 正常返回信息
201 Created 请求成功并且服务器创建了新的资源
202 Accepted 服务器已接受请求，但尚未处理
3XX：重定向
301 Moved Permanently 请求的网页已永久移动到新位置。
302 Found 临时性重定向。
303 See Other 临时性重定向，且总是使用 GET 请求新的 URI。
304 Not Modified 自从上次请求后，请求的网页未修改过。
4XX：客户端错误
400 Bad Request 服务器无法理解请求的格式，客户端不应当尝试再次使用相同的内容发起请求。
401 Unauthorized 请求未授权。
403 Forbidden 禁止访问。
404 Not Found 找不到如何与 URI 相匹配的资源。
5XX: 服务器错误
500 Internal Server Error 最常见的服务器端错误。
503 Service Unavailable 服务器端暂时无法处理请求（可能是过载或维护）。
4. 请描述一下 cookies，sessionStorage 和 localStorage 的区别？
cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（通常经过加密）
cookie数据始终在同源的http请求中携带（即使不需要），记会在浏览器和服务器间来回传递
sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存
存储大小：
cookie数据大小不能超过4k
sessionStorage和localStorage虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大
有期时间：
localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据
sessionStorage 数据在当前浏览器窗口关闭后自动删除
cookie 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭
原文：blog.poetries.top/FE-Intervie… 拓展：cookie和session的认识
- session存储于服务器，可以理解为一个状态列表，拥有一个唯一识别符号sessionId，
通常存放于cookie中。服务器收到cookie后解析出sessionId，再去session列表中查找，
才能找到相应session。依赖cookie
- cookie类似一个令牌，装有sessionId，存储在客户端，浏览器通常会自动添加。
- token也类似一个令牌，无状态，用户信息都被加密到token中，
服务器收到token后解密就可知道是哪个用户。需要开发者手动添加。
5. viewport
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
// width 设置viewport宽度，为一个正整数，或字符串‘device-width’
// device-width 设备宽度
// height 设置viewport高度，一般设置了宽度，会自动解析出高度，可以不用设置
// initial-scale 默认缩放比例（初始缩放比例），为一个数字，可以带小数
// minimum-scale 允许用户最小缩放比例，为一个数字，可以带小数
// maximum-scale 允许用户最大缩放比例，为一个数字，可以带小数
// user-scalable 是否允许手动缩放
6. 闭包例子
闭包就是定义在函数内部，能够读取其他函数内部变量的函数。私有化变量
举例：用闭包实现一个计数器
function createCounter() {
let counter = 0;
return function () {
counter = counter + 1;
return counter
};
}
const increment = createCounter();
const c1 = increment();
const c2 = increment();
const c3 = increment();
console.log('example increment', c1, c2, c3);//1,2,3
闭包的用途：
1.可以读取函数内部的变量，
2.让这些变量的值始终保持在内存中。
使用闭包注意点
1.由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大（及时销毁）
2.闭包会在父函数外部，注意不能随便改变父函数内部变量的值
7. this的指向
this的指向总共可以分为五种：
默认绑定（非严格模式-window，严格模式-undefined）浏览器环境
隐式绑定（一般是上下文，特殊情况指向window或者undefined）
显式绑定（指向绑定的对象，特殊情况指向window或者undefined）
new绑定（一般指向新对象，但是返回function或object时，指向返回的对象）
箭头函数绑定（指向上下文中的this）
原文：mp.weixin.qq.com/s/yVCPFaoH9… 深入理解this：mp.weixin.qq.com/s/acyUB0HxM…
8. promise实例
const promise = new Promise(function(resolve, reject) {
if(success) {
resolve(value)
} else {
reject(error)
}
})
Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。它们是两个函数，由JavaScript引擎提供，不用自己部署。
resolve函数的作用是，将Promise对象的状态从"未完成"变成"成功"。（即从pending变为resolved）。在异步操作成功的时候调用，并将异步操作结果作为参数传递出去；
reject函数的作用是，将promise对象的状态从"未完成"变成"失败"（即从pending变为rejected）。在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去
9. js实现一个继承方法
// 借用构造函数继承实例属性
function Child () {
Parent.call(this)
}
// 寄生继承原型属性
(function () {
let Super = function () {}
Super.prototype = Parent.prototype
Child.prototype = new Super()
})()
10. call、apply、bind三个区别
在JS中，call、apply和bind是Function对象自带的三个方法，这三个方法的主要作用是改变函数中的this指向。
call、apply、bind方法的共同点和区别：
共同点：
1.三者都是用来改变函数的this对象的指向的；
2.三者第一个参数都是this要指向的对象，也就是想指定的上下文（函数的每次调用都会拥有一个特殊值
——本次调用的上下文（context）——这就是this关键字的值。）；
3.三者都可以利用后续参数传参；
区别：
bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用 。
apply、call 二者而言，作用完全一样，只是接受参数的方式不太一样。
var func = function(arg1, arg2) {};
func.call(this, arg1, arg2); //不限制参数数
func.apply(this, [arg1, arg2])//只有俩个参数，传数组
func.bind(this, arg1, arg2)() //当时不调用
其中 this 是你想指定的上下文，他可以是任何一个 JavaScript 对象(JavaScript 中一切皆对象)，call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。 
原文：https://mp.weixin.qq.com/s/yVCPFaoH9cfb8XH-YfeDRw
11. var、let 和 const 区别的实现原理是什么?
1.var 命令会发生“变量提升”现象，即变量可以在声明之前使用，值为 undefined 。
内层变量可能覆盖外层变量
用来计数的循环变量泄露为全局变量
2.let声明的全局变量不会挂在顶层对象下面
所声明的变量一定要在声明后使用，否则报错，报错 ReferenceError
暂时性死区，只要块级作用域内存在 let 命令，它所声明的变量就“绑定”（ binding ）这个区域，不再受外部的影响，在代码块内，使用 let 命令声明变量之前，该变量都是不可用的。
不允许重复声明
3.const声明的全局变量不会挂在顶层对象下面
const 声明之后必须马上赋值，否则会报错
const 简单类型一旦声明就不能再更改，复杂类型(数组、对象等)指针指向的地址不能更改，内部数据可以更改。
const 一旦声明变量，就必须立即初始化，不能留到以后赋值。
const 命令声明的常量也是不提升，同样存在暂时性死区，只能在声明的位置后面使用。
12. BFC（块级格式化上下文）
BFC 的原理
其实也就是 BFC 的渲染规则（能说出以下四点就够了）。包括：
BFC 内部的子元素，在垂直方向，边距会发生重叠。
BFC在页面中是独立的容器，外面的元素不会影响里面的元素，反之亦然。
BFC区域不与旁边的float box区域重叠。（可以用来清除浮动带来的影响）。
计算BFC的高度时，浮动的子元素也参与计算。
如何生成BFC
新方法：display:flow-root
方法1：overflow: 不为visible，可以让属性是 hidden、auto。【最常用】
方法2：浮动中：float的属性值不为none。意思是，只要设置了浮动，当前元素就创建了BFC。
方法3：定位中：只要posiiton的值不是 static或者是relative即可，可以是absolute或fixed，也就生成了一个BFC。
方法4：display为inline-block, table-cell, table-caption, flex, inline-flex
BFC应用
阻止margin重叠
可以包含浮动元素 —— 清除内部浮动(清除浮动的原理是两个div都位于同一个 BFC 区域之中)
自适应两栏布局
可以阻止元素被浮动元素覆盖
