前端 面经

1说一说cookie sessionStorage localStorage 区别？

解题思路

得分点 数据存储位置、生命周期、存储大小、写入方式、数据共享、发送请求时是否携带、应用场景 标准回答 Cookie、SessionStorage、 LocalStorage都是浏览器的本地存储。 它们的共同点：都是存储在浏览器本地的 它们的区别：

cookie是由服务器端写入的，

SessionStorage、 LocalStorage都是由前端写入的，

cookie的生命周期是由服务器端在写入的时候就设置好的，

LocalStorage是写入就一直存在，除非手动清除，

SessionStorage是页面关闭的时候就会自动清除。

cookie的存储空间比较小大概4KB，SessionStorage、 LocalStorage存储空间比较大，大概5M。Cookie、SessionStorage、 LocalStorage数据共享都遵循同源原则，SessionStorage还限制必须是同一个页面。在前端给后端发送请求的时候会自动携带Cookie中的数据，但是SessionStorage、 LocalStorage不会 加分回答 由于它们的以上区别，所以它们的应用场景也不同，Cookie一般用于存储登录验证信息SessionID或者token，LocalStorage常用于存储不易变动的数据，减轻服务器的压力，SessionStorage可以用来检测用户是否是刷新进入页面，如音乐播放器恢复播放进度条的功能。

2说一说你对闭包的理解？

函数内部的函数可以访问外部函数的变量称为闭包

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

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

同源限制、协议、域名、端口、CORS、node中间件、JSONP、postmessage

5说一说BFC

BFC（Block Formatting Context），即块级格式化上下文，它是页面中一个独立的容器，容器中的元素不会影响到外面的元素

触发条件

触发BFC的条件包含不限于：

根元素，即HTML元素

浮动元素：float值为left、right

overflow值不为 visible，为 auto、scroll、hidden

display的值为inline-block、inltable-cell、table-caption、table、inline-table、flex、inline-flex、grid、inline-grid

position的值为absolute或fixed

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

Vuex是集中管理项目公共数据的

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

typeof、instanceof、Object.prototype.toString.call()（对象原型链判断方法）、 constructor (用于引用数据类型) 标准回答 JavaScript有4种方法判断变量的类型，分别是typeof、instanceof、Object.prototype.toString.call()（对象原型链判断方法）、 constructor (用于引用数据类型) typeof：常用于判断基本数据类型，对于引用数据类型除了function返回’function‘，其余全部返回’object'。 instanceof：主要用于区分引用数据类型，检测方法是检测的类型在当前实例的原型链上，用其检测出来的结果都是true，不太适合用于简单数据类型的检测，检测过程繁琐且对于简单数据类型中的undefined, null, symbol检测不出来。