前言

题目来自ConardLi的blog
写的是自己的题解，水平有限，所以仅供参考
代码会整合在github，觉得有帮助就给个star吧~

正文

一、Javascript基础

执行机制

1、为何try里面放return，finally还会执行，理解其内部机制

因JavaScript依靠着语句的Completion Record类型，在语句的复杂嵌套结构中，实现各种控制。

• try就属于控制型语句，并且属于对内部有影响的语句
• finally属于控制型语句，并且属于对内部有影响的语句
• return也属于控制型语句，但是他属于对外部有影响的语句

因为finally中的内容必须保证执行，所以try/catch执行完毕，即使得到的结果是非normal型的完成记录，也必须要执行finally

2、JavaScript如何实现异步编程，可以详细描述EventLoop机制

异步编程

ES6之前:

• 回调函数
• setTimeout
• setInterval
• Promise
• 事件监听

ES6:

• generator

ES6+:

• async await

EventLoop机制：

• JavaScript事件队列每16ms循环一次，先执行同步队列，再执行宏任务(第一次是执行script里的内容)，后执行微任务

掘金：这一次，彻底弄懂JavaScript的执行机制

js引擎存在monitoring process进程，会持续不断的检查主线程执行栈是否为空，一旦为空，就会去Event Queue那里检查是否有等待被调用的函数。

• setTimeout&&setInterval

不是每过ms秒会执行一次fn，而是每过ms秒，会有fn进入Event Queue

3、宏任务和微任务分别有哪些

宏任务：

• setTimeout
• setInterval
• setTmmediate
• promise中的executor

微任务：

• Promise
• messageChannel
• mutationObersve
• process.nextTick

4、可以快速分析一个复杂的异步嵌套逻辑，并掌握分析方法

题目一：

async function async1() {
    console.log("async1 start");
    await  async2();
    console.log("async1 end");
}

async  function async2() {
    console.log( 'async2');
}

console.log("script start");

setTimeout(function () {
    console.log("settimeout");
},0);

async1();

new Promise(function (resolve) {
    console.log("promise1");
    resolve();
}).then(function () {
    console.log("promise2");
});

console.log('script end');

同步队列->微任务->宏任务

输出顺序：
script start
async1 start
async2
promise1
script end

async1 end
promise2

settimeout

async await的代码到底做了些什么，我们可以来写一下

5、使用Promise实现串行

.then调用

6、Node与浏览器EventLoop的差异

暂时不会

7、如何在保证页面运行流畅的情况下处理海量数据

分页，worker

8、冒泡和捕获的机制

你有没有想过，在单击按钮的同时，你也单击了按钮的容器元素，甚至也单击了整个页面。

事件冒泡
IE的事件流叫做事件冒泡（event bubbling），即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。

事件捕获
Netscape Communicator 团队提出的另一种事件流叫做事件捕获（event capturing）。其思想是不太具体的节点应该更早接收到事件，而最具体的节点应该最后接收到事件。事件捕获的用意在于事件到达预订目标之前捕获它。

9、script defer与async

• <script src="script.js"></script>
  没有 defer 或 async，浏览器会立即加载并执行指定的脚本，“立即”指的是在渲染该 script 标签之下的文档元素之前，也就是说不等待后续载入的文档元素，读到就加载并执行。

• <script async src="script.js"></script>
  有 async，加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行（异步）。

• <script defer src="myscript.js"></script>
  有 defer，加载后续文档元素的过程将和 script.js 的加载并行进行（异步），但是 script.js 的执行要在所有元素解析完成之后，DOMContentLoaded 事件触发之前完成。

在现实当中， 延迟脚本并不一定会按照顺序执行，也不一定会在 DOMContentLoaded 事件触发前执行， 因此最好只包含一个延迟脚本。
——泽卡斯(Zakas. Nicholas C.). JavaScript高级程序设计(第3版) (图灵程序设计丛书) (Kindle 位置 639-641). 人民邮电出版社. Kindle 版本.