积累面试题

**

说一说你对闭包的理解？

闭包形成的原理：作用域链，当前作用域可以访问上级作用域中的变量 闭包解决的问题：能够让函数作用域中的变量在函数执行结束之后不被销毁，同时也能在函数外部可以访问函数内部的局部变量。 闭包带来的问题：由于垃圾回收器不会将闭包中变量销毁，于是就造成了内存泄露，内存泄露积累多了就容易导致内存溢出。 加分回答 闭包的应用，能够模仿块级作用域，能够实现柯里化，在构造函数中定义特权方法、Vue中数据响应式Observer中使用闭包等。

说一说cookie sessionStorage localStorage 区别？

1.都是浏览器存储 2.都存储在浏览器本地 区别： 1.cookie由服务器写入， sessionStorage以及localStorage都是由前端写入 2.cookie的生命周期由服务器端写入时就设置好的，localStorage是写入就一直存在，除非手动清除，sessionStorage是由页面关闭时自动清除 3.cookie存储空间大小约4kb， sessionStorage及localStorage空间比较大，大约5M 4.3者的数据共享都遵循同源原则，sessionStorage还限制必须是同一个页面 5.前端给后端发送请求时，自动携带cookie, session 及 local都不携带 6.cookie一般存储登录验证信息或者token，localStorage常用于存储不易变动的数据，减轻服务器压力，sessionStorage可以用来监测用户是否是刷新进入页面，如音乐播放器恢复进度条功能

说一说promise是什么与使用方法？

1. 概念：异步编程的一种解决方案，解决了地狱回调的问题
2. 使用方法：new Promise((resolve,reject) => { resolve（）; reject（）; })里面有多个resovle或者reject只执行第一个。如果第一个是resolve的话后面可以接.then查看成功消息。如果第一个是reject的话，.catch查看错误消息。

说一说跨域是什么？如何解决跨域问题？

跨域：当前页面中的某个接口请求的地址和当前页面的地址如果协议、域名、端口其中有一项不同，就说该接口跨域了。
跨域限制的原因：浏览器为了保证网页的安全，出的同源协议策略。
跨域解决方案
cors：目前最常用的一种解决办法，通过设置后端允许跨域实现。
res.setHeader(‘Access-Control-Allow-Origin’, ‘*’);
res.setHeader(“Access-Control-Allow-Methods”, “GET, PUT, OPTIONS, POST”);

node中间件、nginx反向代理：跨域限制的时候浏览器不能跨域访问服务器，node中间件和nginx反向代理，都是让请求发给代理服务器，静态页面面和代理服务器是同源的，然后代理服务器再向后端服务器发请求，服务器和服务器之间不存在同源限制。

JSONP：利用的原理是script标签可以跨域请求资源，将回调函数作为参数拼接在url中。后端收到请求，调用该回调函数，并将数据作为参数返回去，注意设置响应头返回文档类型，应该设置成javascript。

postmessage：H5新增API，通过发送和接收API实现跨域通信。

说一说BFC

1.定义：块级格式化上下文，独立的渲染区域，不会影响边界外的元素
2.形成条件： a.flaot b.position 3. overflow 4.display
3.布局规则： a.区域内box从上到下排列 b.box垂直方向的距离由margin决定 c.同一个bfc内box margin会重叠 d.bfc不会与flaot重叠 e.bfc计算高度 也会计算float元素

说一说Vuex是什么，每个属性是干嘛的，如何使用

1. 概念：Vuex是全局状态管理仓库，相当于window对象挂载了一个全局变量。
2. 属性：state（数据源）、actions（处理异步事件）、mutations（处理同步事件）、getters(过滤数据)和modules（模块）

说一说JavaScript有几种方法判断变量的类型？

1.typeof 判断基本类型 判断引用类型时，除了function 其他的为object null
2.instance of left proto 是否在 right prototype上
3.constructor 4.Object.prototype.toString().call()

说一说数组去重都有哪些方法？

new Set() 、indexOf、hasOwnProperty、reduce+includes、filter

说一说null 和 undefined 的区别，如何让一个属性变为null

undefined 是windwon 的一个全局属性，是一个变量没有被赋值或者一个函数没有返回值或者访问一个对象不存在的属性或者一个函数定义了形参，但是没有传递实参的，这些时候都是undefined. undefined 通过typeof 判断类型 ‘undefined’.undefined == undefined === 也相等； null 代表的对象的值未设置。相当于一个对象没有设置指针的地址就是null. == === 都相等 null == undefined null !== undefined. undefined相等一个变量的初始值，null 是人为置空； null 的类型是 Null. typeof 判断是 Object,是二进制前三位 是0 ，为 Object. null全是0

说一说es6中箭头函数？

1. 没有自己的this，即不能作为构造函数，里面的this是执行上下文的this
2. 不能被new
3. 没有arguments对象
4. 不能作为generator函数，不能用yied命令
5. 没有prototype属性

说一说call apply bind的作用和区别？

bind改变this指向不直接调用、call和apply改变this指向直接调用、apply接收第二个参数为数组 、call用于对象的继承 、伪数组转换成真数组、apply用于找出数组中的最大值和最小值以及数组合并、bind用于vue或者react框架中改变函数的this指向 标准回答 call、apply、bind的作用都是改变函数运行时的this指向。 bind和call、apply在使用上有所不同，bind在改变this指向的时候，返回一个改变执行上下文的函数，不会立即执行函数，而是需要调用该函数的时候再调用即可，但是call和apply在改变this指向的同时执行了该函数。 bind只接收一个参数，就是this指向的执行上文。 call、apply接收多个参数，第一个参数都是this指向的执行上文，后面的参数都是作为改变this指向的函数的参数。但是call和apply参数的格式不同，call是一个参数对应一个原函数的参数，但是apply第二个参数是数组，数组中每个元素代表函数接收的参数，数组有几个元素函数就接收几个元素。
应用场景： 对象的继承，在子构造函数这种调用父构造函数，但是改变this指向，就可以继承父的属性和方法

说一下Diff算法？

1.出现：主流框架中多采用VNode更新结点，更新规则为diff算法。
2.原理：框架会将所有的结点先转化为虚拟节点Vnode，在发生更改后将VNode和原本页面的OldNode进行对比，然后以VNode为基准，在oldNode上进行准确的修改。（修改准则：原本没有新版有，则增加；原本有新版没有，则删除；都有则进行比较，都为文本结点则替换值；都为静态资源不处理；都为正常结点则替换）