1.JavaScript 中 null 和 undefined 的区别？
1 | typeof(null)//"object" |
以下参考：https://www.cnblogs.com/ly0612/p/6696982.html
null：Null类型，代表“空值”，代表一个空对象指针，使用typeof运算得到 “object”，可以认为它是一个特殊的对象值。undefined：Undefined类型，当声明了一个变量未初始化时，得到的就是undefined。
null是javascript的关键字，可以认为是对象类型，它是一个空对象指针，和其它语言一样都是代表“空值”，不过 undefined 却是javascript才有的。undefined是在ECMAScript第三版引入的，为了区分空指针对象和未初始化的变量，它是一个预定义的全局变量。没有返回值的函数返回为undefined，没有实参的形参也是undefined。
javaScript高级程序设计： 在使用var声明变量但未对其加以初始化时，这个变量的值就是undefined。 null值则是表示空对象指针。
我的理解就是： undefined是访问一个未初始化的变量时返回的值，而null是访问一个尚未存在的对象时所返回的值。因此，可以把undefined看作是空的变量，而null看作是空的对象。
在定义一个想保存对象的变量时，就可以让该变量先保存null值，这样既能体现null是一个空指针对象，也能更好的区分null和undefined。
2.event loop
其实之前就对这件js是单线程的有疑惑，因为是单线程的但是又为什么会有异步同步事件。今天通过别人的告知终于明白了这其中的关键是什么。就是这个关键词event loop。好像之前看文章的时候有看到这个关键词，但是好像当时内容没有吸引我看下去，就耽搁了哭唧唧。还有就是下面这篇文真的是太厉害了，简单易懂，又把其中的道理我觉得是说明白了。
以下参考：https://zhuanlan.zhihu.com/p/37994177event loop 即事件循环。首先先进入正题哈哈哈
想要了解event loop我们就要从js的工作原理说起。首先，大家都知道js是单线程的。所谓单线程就是进程中只有一个线程在运行。那么，js为什么是单线程而不是做成多线程的呢？个人理解，js是用来实现浏览器与用户之间的交互的。如果同时要处理用户点击，用户输入，用户关闭等操作，浏览器无法知道这个时间我到底应该做什么。所以js是从上至下按顺序运行下去的。这里谈及到两个名词，线程和进程。简单介绍：进程，可以理解为正在运行的程序的实体。例如，在手机中打开一个app，打开了一个后台进程。那么，线程又是什么呢？线程是程序执行流的最小单位，也叫轻量级的进程。是程序执行的过程中，一个单一的顺序控制流程。一个进程中，包含很多的线程。单线程，程序执行的过程中，所走的程序路径按照连续的顺序排下来。前面的必须处理好，后面的才会执行。
按照单线程的思想，顺序执行我们的代码，那么，如果我们的js中间向后台发送一个ajax请求，就要等到请求等到结果后才会继续向下执行。如果请求耗时10秒，页面就要停在这里10秒。这样的用户体验很不好。。。因此，就有了同步任务、异步任务的区别。所谓异步任务，就好比我们在烧水的同时看书，等到水烧好了，再用烧好的水煮面。这就是一个简单的异步操作。异步可以提高处理事件的效率。异步任务就可以解决单线程按照顺序依次执行，不可以同时进行多个任务的问题。
同步任务和异步任务在js中是如何执行的呢？js的代码运行会形成一个主线程和一个任务队列。主线程会从上到下一步步执行我们的js代码，形成一个执行栈。同步任务就会被放到这个执行栈中依次执行。而异步任务被放入到任务队列中执行，执行完就会在任务队列中打一个标记，形成一个对应的事件。当执行栈中的任务全部运行完毕，js会去提取并执行任务队列中的事件。这个过程是循环进行的，这就是我们今天想要了解的event loop。
这里简单粗暴的理解一下异步任务，什么样的任务会被放到任务队列中呢？简单理解，有callback函数的就可以被看做是异步任务，会被放到任务队列中执行。大家可能在使用vue的时候用到过$nextTick方法，这个方法的主要目的就是把事件直接插入到执行栈的最后，而不是放入到任务队列中去执行。这个执行流程就变成了执行栈的任务——>$nextTick——>任务队列。
我们回过头再来看一下最开始提到的问题。console.log(1)和console.log(4)在主线程的执行栈中执行完，此时，执行栈被清空，js开始执行任务队列中的两个setTimeOut事件。先执行延迟时间设置为0秒的setTimeOut打印出3，再执行1秒的setTimeOut事件，打印出2。最后的输出结果就是1、4、3、2
因为js的event loop机制，所以大家不要认为setTimeOut设置的事件到了延迟时间就是被执行。如果你的执行栈任务没有被全部执行完，清空。setTimeOut事件执行的时间很有可能是要大于你设置的延时参数。
随着ES6的广泛应用。同样解决异步问题的Promise对象，可以通过它的链式写法，达到写同步代码的手法实现异步任务的效果。那么，Promise和setTimeout在事件队列里是否一样呢？
这里就要引入两个新名词，microtask、macrotask。即宏任务和微任务。宏任务：需要多次事件循环才能执行完，事件队列中的每一个事件都是一个宏任务。浏览器为了能够使得js内部宏任务与DOM任务有序的执行，会在一个宏任务执行结束后，在下一个宏执行开始前，对页面进行重新渲染 （task->渲染->task->…）鼠标点击会触发一个事件回调，需要执行一个宏任务，然后解析HTML。setTimeout的作用是等待给定的时间后为它的回调产生一个新的宏任务。微任务：微任务是一次性执行完的。微任务通常来说是需要在当前task执行结束后立即执行的任务，例如对一些动作做出反馈或者异步执行任务又不需要分配一个新的task，这样便可以提高一些性能。只要执行栈中没有其他的js代码正在执行了，而且每个宏任务都执行完了，微任务队列会立即执行。如果在微任务执行期间微任务队列加入了新的微任务，会将新的微任务加入队列尾部，之后也会被执行。简单理解，宏任务在下一轮事件循环执行，微任务在本轮事件循环的所有任务结束后执行。
宏任务主要包括了：setTimeout、setInterval、setImmediate、I/O、各种事件（比如鼠标单击事件）的回调函数
优先级：主代码块 > setImmediate > MessageChannel > setTimeout / setInterval
微任务主要包括了：process.nextTick、Promise、MutationObserver
优先级：process.nextTick > Promise > MutationObserver
宏任务，微任务可参考：http://note.youdao.com/noteshare?id=6bdfda7e31dbc0635a24f378525207f4
3.display:none;和visibility:hidden;的区别
display: none; //不占据空间，无法点击visibility: hidden; //占据空间，无法点击
1.空间占据
2.回流与渲染
3.株连性
display:none隐藏产生reflow和repaint(回流与重绘)，而visibility:hidden没有这个影响前端性能的问题；第三点估计是不少同行不知道的，就是“株连性”方面的差异。
所谓“株连性”，就是如果祖先元素遭遇某祸害，则其子子孙孙无一例外也要遭殃。display:none就是“株连性”明显的声明：一旦父节点元素应用了display:none，父节点及其子孙节点元素全部不可见，而且无论其子孙元素如何不屈地挣扎都无济于事。
在实际的web应用中，我们要经常实现一些显示隐藏的功能，由于display:none本身特性以及jQuery潜在的驱动，使得我们对display:none这种隐藏特性相当熟知。因此，久而久之会形成比较牢固的情感化认识，并无法避免地将这种认识迁移到其他类似表现属性(eg. visibility)的认识上，再加上一些常规经验……
举例来说吧，通常情况下，我们给一个父元素应用visibility:hidden，则其子孙后代也都会全部不可见。于是，我们就会有类似的认识迁移：应用了visibility:hidden声明下的子孙元素如何不屈地挣扎都摆脱不了不可见被抹杀的命运。而实际上却存在隐藏“失效”的情况。
何时隐藏“失效”？很简单，如果子孙元素应用了visibility:visible，那么这个子孙元素又会刘谦般地显现出来。
对比总结：
display:none是个相当惨无人道的声明，子孙后代全部搞死（株连性），而且连块安葬的地方都不留（不留空间），导致全体民众哗然（渲染与回流）。
visibility:hidden则具有人道主义关怀，虽然不得已搞死子孙，但是子孙可以通过一定手段避免（伪株连性），而且死后全尸，墓地俱全（占据空间），国内民众比较淡然（无渲染与回流）。
参考：https://www.jb51.net/web/73987.html
4.v-show和v-if的区别
v-show 仅仅控制元素的显示方式，将 display 属性在 block 和 none 来回切换；而v-if会控制这个 DOM 节点的存在与否。当我们需要经常切换某个元素的显示/隐藏时，使用v-show会更加节省性能上的开销；当只需要一次显示或隐藏时，使用v-if更加合理。
5.v-show怎么显示和隐藏元素
display:block; 和 display:none; 来回切换
6.1px的线怎么画
设置高度为11
2
3
4.line{
width: 230px;
height: 1px;
}
7.如何优化SPA应用的首屏加载速度慢的问题？
1.将公用的JS库通过script标签外部引入，减小app.bundel的大小，让浏览器并行下载资源文件，提高下载速度；
2.在配置路由时，页面和组件使用懒加载的方式引入，进一步缩小 app.bundel 的体积，在调用某个组件时再加载对应的js文件；
3.加一个首屏 loading 图，提升用户体验
8.路由守卫
在router文件的index.js文件里定义router.beforeEach()函数
9.HTTP中Get、Post的区别
区别一:GET重点从服务器上获取资源,POST重点向服务器发送数据.
区别二:get传输数据是通过URL请求，置于URL后，并用”?”连接，多个请求数据间用”&”连接.post传输数据通过Http的post机制，将字段与对应值封存在请求实体中发送给服务器，这个过程对用户是不可见的；
区别三:Get传输的数据量小，因为受URL长度限制，但效率较高；Post可以传输大量数据，所以上传文件时只能用Post方式；
区别四:get是不安全的，因为URL是可见的，可能会泄露私密信息，如密码等；post较get安全性较高；
区别五:get方式只能支持ASCII字符，向服务器传的中文字符可能会乱码。post支持标准字符集，可以正确传递中文字符。