前端面试题

cookies，sessionStorage，localStorage：

cookies：它是网站用来标记用户身份的一段数据，通常情况下时一段加密的字符串，并且默认情况下指回在同源（同域名，同端口，同协议）的http请求中携带
sessionStorage：它是浏览器本地存储的一种方式，以键值对的形式进行存储，并且存储的数据会在浏览器关闭之后自动删除
localStorage：它也是浏览器本地存储的一种方式，以键值对的形式进行存储，不过它存储的是一个持久化的数据，只能手动删除

display：none 与 visibility：hidden

display：none ：会让元素完全从渲染树中消失，不渲染的时候不占有任何空间，非继承属性，通过修改子孙节点的元素属性无法显示
visibility：hidden：不会让元素完全从渲染树中消失，不渲染的时候仍然占有空间，继承属性，通过设置visibility：visible可以让子孙节点显示

为什么要初始化css样式：

因为浏览器的兼容问题，不同浏览器对有些元素的默认样式是不同的，并且默认的样式会影响到项目最终的布局，如果没有对css样式进行初始化，可能会出现浏览器之间的页面显示差异

postcss：

postcss是一个平台，基于这个平台，可以使用一些插件。来优化css代码；比如autoprefixer插件，它需要基于postcss使用，作用是帮助我们为css增加上不同的浏览器前缀

闭包：

闭包就是能读取其他函数内部变量的一个函数。通常情况下，我们会在一个函数中创建另一个函数，然后通过新常见的这个函数来访问上层函数的局部变量，被访问到的局部变量会始终保存在内存之中

webpack：

①webpack是一个js的模块打包工具，可以使用webpack管理项目中的js模块依赖
②webpack提供了一些默认的配置，比如devServer，可以快速启动一个开发时的web服务器
③webpack默认只打包js文件，所以webpack额外提供了loader的概念，可以预处理一些文件，打包除了js文件之外的静态资源
④webpack还提供了插件的概念，来做一些辅助型的工作，比如HTMLWebpackPlugin

promise：

promise是ES6提出的一个异步编程解决方案，相对于传统的容易陷入回调地狱的异步回调方案来说，promise会让异步操作更见优雅
promise是一个构造函数，需要new一个实例对象
promise的构造函数接收一个哈桑农户作为参数，函数中的代码在new Promise的时候会立即执行，可以在这里去执行异步的代码操作。该函数默认存在两个参数分别是resolve和reject，这两个参数也是函数，用来标记异步执行的状态；resolve在异步操作成功时调用，reject在异步操作失败时调用
这两个标记状态可以通过promise实例对象的then方法和catch方法接收；then是异步完成的回调，catch是异步失败的回调

null和undefind

undefind：不存在这个值，它是一个变量最原始的状态
null：它是一个具体的值，只不过这个值是一个空值

eventLoop：

JavaScript语言的一大特点就是单线程，同一时间只能做一件事
所有任务需要排队，前一个任务结束，再回执行后一个任务。如果前一个任务耗时很长，后一个任务就不得不一致等着
所有任务分成两种，同步任务和异步任务
同步任务：在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务
异步任务：不进入主线程，而进入任务队列，只有任务队列通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行
当主线程中的任务完成之后，主线程从任务队列中读取事件，这个过程是循环不断的，这就是Event Loop（事件循环）

typeof 和 instanceof

typeof：返回一个值的类型。对于基本数据类型，除了null都可以返回正确的类型。而对于null返回object；对于引用数据类型来说，除了函数（返回function）之外，其他都会返回object
instanceof：用来判断一个对象是否是另一个对象的实例，它只能用来判断对象

vue实现双向数据绑定的原理：

采用数据劫持和发布者-订阅者模式
数据劫持：通过Object.defineProperty()来劫持对象各个属性的setter，getter
发布者-订阅者：在数据变动时发布者发布消息给订阅者，触发相应监听回调

vue路由实现：hash模式和history模式

hash模式：vue-router的默认模式，使用hash，URL中会出现#号字符，#及其后面的字符称之为hash。特点：hash虽然在URL中，但是不被包括在http请求中
history模式：需要后台配合进行，因为vue打包的项目通常是一个单页面的应用，也就是任何的URL其实指向的都是一个HTML文件，所以我们需要在apach或者nginx中进行配置，当URL匹配不到资源时，指向同一个HTML页面

keepAlive：

包裹动态组件时，会缓存不活动的组件实例，主要用于保留组件状态或避免重新渲染