摘要：拋出的錯誤對象會被方法回調函數接收到命令命令后面是一個對象，返回該對象的結果。有人將其稱之為宏任務微任務，定時器就屬于宏任務的范疇。

上一篇 前端面試題-JavaScript（一）, 感興趣的小伙伴也可以移步這里查看 完整版JavaScript面試題，面試題會不定期更新加進去一些個人工作中遇到的或者認為比較重要的東西，后面會涉及到前端的各個方面，感興趣的小伙伴可以關注哦！

如果文章中有出現紕漏、錯誤之處，還請看到的小伙伴留言指正，先行謝過

以下 ↓

同步模式

同步模式，又稱阻塞模式。javascript 在默認情況下是會阻塞加載的。當前面的 javascript 請求沒有處理和執行完時，會阻止瀏覽器的后續處理

異步模式

異步加載又叫非阻塞，瀏覽器在下載執行 js 同時，還會繼續進行后續頁面的處理

異步加載 JavaScript

動態添加 script 標簽

defer

async

defer屬性和async都是屬于 script 標簽上面的屬性，兩者都能實現 JavaScript 的異步加載。不同之處在于：async 在異步加載完成的時候就馬上開始執行了，defer 會等到 html 加載完畢之后再執行

由于瀏覽器的 同源策略，在出現 域名、端口、協議有一種不一致時，就會出現跨域，屬于瀏覽器的一種安全限制。

解決跨域問題有很多種方式，常用的就是以下幾種：

jsonp 跨域：動態創建script，再請求一個帶參網址實現跨域通信.缺點就是只能實現 get 一種請求

document.domain + iframe跨域：兩個頁面都通過js強制設置document.domain為基礎主域，就實現了同域.但是僅限主域相同，子域不同的跨域應用場景

跨域資源共享（CORS）：只服務端設置Access-Control-Allow-Origin即可，前端無須設置，若要帶cookie請求：前后端都需要設置

nginx反向代理接口跨域：同源策略是瀏覽器的安全策略，不是HTTP協議的一部分。服務器端調用HTTP接口只是使用HTTP協議，不會執行JS腳本，不需要同源策略，也就不存在跨越問題

WebSocket協議跨域

在 JavaScript 中，研究 this 一般都是 this 的指向問題，核心就是 this 永遠指向最終調用它的那個對象，除非改變 this 指向或者箭頭函數那種特殊情況

function test() {
    console.log(this);
}

test() // window

var obj = {
  foo: function () { console.log(this.bar) },
  bar: 1
};

var foo = obj.foo;
var bar = 2;

obj.foo() // 1
foo() // 2

// 函數調用的環境不同，所得到的結果也是不一樣的

相同點：三者都可以改變 this 的指向

不同點：

apply 方法傳入兩個參數：一個是作為函數上下文的對象，另外一個是作為函數參數所組成的數組

var obj = {
    name : "sss"
}

function func(firstName, lastName){
    console.log(firstName + " " + this.name + " " + lastName);
}

func.apply(obj, ["A", "B"]);    // A sss B

call 方法第一個參數也是作為函數上下文的對象，但是后面傳入的是一個參數列表，而不是單個數組

var obj = {
    name: "sss"
}

function func(firstName, lastName) {
    console.log(firstName + " " + this.name + " " + lastName);
}

func.call(obj, "C", "D");       // C sss D

bind 接受的參數有兩部分，第一個參數是是作為函數上下文的對象，第二部分參數是個列表，可以接受多個參數

var obj = {
    name: "sss"
}

function func() {
    console.log(this.name);
}

var func1 = func.bind(null, "xixi");
func1();

apply、call 方法都會使函數立即執行，因此它們也可以用來調用函數
bind 方法不會立即執行，而是返回一個改變了上下文 this 后的函數。而原函數 func 中的 this 并沒有被改變，依舊指向全局對象 window
bind 在傳遞參數的時候會將自己帶過去的參數排在原函數參數之前

function func(a, b, c) {
    console.log(a, b, c);
}
var func1 = func.bind(this, "xixi");
func1(1,2) // xixi 1 2

內存泄漏：是指一塊被分配的內存既不能使用，又不能回收，直到瀏覽器進程結束

可能造成內存泄漏的操作：

意外的全局變量

閉包

循環引用

被遺忘的定時器或者回調函數

你可能還需要知道 垃圾回收機制 此外，高程上面對垃圾回收機制的介紹也很全面，有興趣的小伙伴可以看看

事件代理：通俗來說就是將元素的事件委托給它的父級或者更外級元素處理
原理：利用事件冒泡機制實現的
優點：只需要將同類元素的事件委托給父級或者更外級的元素，不需要給所有元素都綁定事件，減少內存空間占用，提升性能; 動態新增的元素無需重新綁定事件

AMD和CMD都是為了解決瀏覽器端模塊化問題而產生的，AMD規范對應的庫函數有 Require.js，CMD規范是在國內發展起來的，對應的庫函數有Sea.js

AMD和CMD最大的區別是對依賴模塊的執行時機處理不同

1、AMD推崇依賴前置，在定義模塊的時候就要聲明其依賴的模塊 
2、CMD推崇就近依賴，只有在用到某個模塊的時候再去require

參考：AMD-中文版 CMD-規范

ECMAScript 6.0 是 JavaScript 語言的下一代標準

新增的特性：

聲明變量的方式 let const

變量解構賦值

字符串新增方法 includes() startsWith() endsWith() 等

數組新增方法 Array.from() Array.of() entries() keys() values() 等

對象簡潔寫法以及新增方法 Object.is() Object.assign() entries() keys() values()等

箭頭函數、rest 參數、函數參數默認值等

新的數據結構： Set 和 Map

Proxy

Promise對象

async函數 await命令

Class類

Module 體系 模塊的加載和輸出方式

了解更多，參考 ES6入門-阮一峰

ES6 允許使用“箭頭”（=>）定義函數

var f = v => v;

// 等同于
var f = function (v) {
  return v;
}

注意點：

函數體內的 this 對象，就是定義時所在的對象，而不是使用時所在的對象

不可以當作構造函數，也就是說，不可以使用 new 命令，否則會拋出一個錯誤

不可以使用 arguments 對象，該對象在函數體內不存在。如果要用，可以用 rest 參數代替

Promise 是異步編程的一種解決方案，比傳統的解決方案——回調函數和事件——更合理和更強大.所謂Promise，簡單說就是一個容器，里面保存著某個未來才會結束的事件（通常是一個異步操作）的結果 --ES6入門-阮一峰
Promise 對象代表一個異步操作，有三種狀態：pending（進行中）、fulfilled（已成功）和 rejected（已失敗）。只有異步操作的結果，可以決定當前是哪一種狀態，任何其他操作都無法改變這個狀態

特點：

對象的狀態不受外界影響

一旦狀態改變，就不會再變，任何時候都可以得到這個結果

Promise 新建后就會立即執行

const promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 異步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
})

Promise實例生成以后，可以用then方法分別指定resolved狀態和rejected狀態的回調函數

promise.then(function(value) {
  // success
}, function(error) {
  // failure
})

then 方法返回的是一個新的Promise實例
Promise.prototype.catch 用于指定發生錯誤時的回調函數,具有“冒泡”性質，會一直向后傳遞，直到被捕獲為止。也就是說，錯誤總是會被下一個catch語句捕獲

getJSON("/post/1.json").then(function(post) {
  return getJSON(post.commentURL);
}).then(function(comments) {
  // some code
}).catch(function(error) {
  // 處理前面三個Promise產生的錯誤
});

catch 方法返回的還是一個 Promise 對象，因此后面還可以接著調用 then 方法

出去上述方法，Promise還有其他用法，小伙伴們可以在這里查看大佬寫的文章 ES6入門-阮一峰

async 函數是什么？一句話，它就是 Generator 函數的語法糖

了解Generator函數的小伙伴，這里 傳送門

async 特點：

async 函數返回一個 Promise 對象，可以使用 then  方法添加回調函數。當函數執行的時候，一旦遇到 await 就會先返回，等到異步操作完成，再接著執行函數體內后面的語句
async 函數內部 return 語句返回的值，會成為 then 方法回調函數的參數
async 函數返回的 Promise 對象，必須等到內部所有 await 命令后面的 Promise 對象執行完，才會發生狀態改變，除非遇到 return 語句或者拋出錯誤
async 函數內部拋出錯誤，會導致返回的 Promise 對象變為 reject 狀態。拋出的錯誤對象會被 catch 方法回調函數接收到

function timeout(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

async function asyncPrint(value, ms) {
  await timeout(ms);
  console.log(value);
}

asyncPrint("hello world", 50);

await 命令: await 命令后面是一個 Promise 對象，返回該對象的結果。如果不是 Promise 對象，就直接返回對應的值

async function f() {
  // 等同于
  // return 123;
  return await 123;
}

f().then(v => console.log(v))
// 123

await 命令后面是一個thenable對象（即定義then方法的對象），那么await會將其等同于 Promise 對象.也就是說就算一個對象不是Promise對象，但是只要它有then這個方法， await 也會將它等同于Promise對象

使用注意點：

await 命令后面的 Promise 對象，運行結果可能是 rejected，所以最好把 await 命令放在 try...catch 代碼塊中

多個 await 命令后面的異步操作，如果不存在繼發關系，最好讓它們同時觸發

await 命令只能用在 async 函數之中，如果用在普通函數，就會報錯

了解更多，請點擊 這里

export 與 export default 均可用于導出常量、函數、文件、模塊等
在一個文件或模塊中，export、import 可以有多個，export default 僅有一個
通過 export 方式導出，在導入時要加 { }，export default 則不需要
使用 export default命令，為模塊指定默認輸出，這樣就不需要知道所要加載模塊的變量名; export 加載的時候需要知道加載模塊的變量名
export default 命令的本質是將后面的值，賦給 default 變量，所以可以直接將一個值寫在 export default 之后

參見 雅虎14條前端性能優化

首選明確兩點：

JavaScript 是單線程語言
JavaScript 的 Event Loop 是 JS 的執行機制, 也就是事件循環

console.log(1)
    
setTimeout(function(){
    console.log(2)
},0)

console.log(3)

// 1 3 2

JavaScript 將任務分為同步任務和異步任務，執行機制就是先執行同步任務，將同步任務加入到主線程，遇到異步任務就先加入到 event table ，當所有的同步任務執行完畢，如果有可執行的異步任務，再將其加入到主線程中執行

視頻詳解，移步 這里

setTimeout(function(){console.log(1);},0);
new Promise(function(resolve){
     console.log(2);
     for(var i = 0; i < 10000; i++){
         i == 99 && resolve();
     }
 }).then(function(){
     console.log(3)
 });
 
 console.log(4);
 
 // 2 4 3 1

在異步任務中，定時器也屬于特殊的存在。有人將其稱之為 宏任務、微任務，定時器就屬于宏任務的范疇。

參考 JS引擎的執行機制

總結的過程，自己確實也獲益頗多，感謝前行的小伙伴。

GitHub完整版面試題，歡迎小伙伴們star關注

預祝大家都能找到自己滿意的工作

以上