作者：Joanne Lee-(Vivi)
譯者： 前端小智
來源：medium
你知道的越多，你不知道的越多
點贊再看，養成習慣
本文 GitHub：github.com/qq449245884… 上已經收錄，更多往期高贊文章的分類，也整理了很多我的文件，和教程資料。歡迎Star和完善，大家面試可以參照考點複習，希望我們一起有點東西。
為了保證的可讀性，本文采用意譯而非直譯。
1.如何理解 JS 中的this關鍵字？
JS 初學者總是對 this 關鍵字感到困惑，因為與其他現代程式語言相比，JS 中的這this關鍵字有點棘手。 “this” 一般是表示當前所在的物件，但是事情並沒有像它應該的那樣發生。JS中的this關鍵字由函式的呼叫者決定，誰呼叫就this就指向哪個。如果找不到呼叫者，this將指向windows物件。
來幾個粟子
第一個例子很簡單。 呼叫 test物件中的 func()，因此func() 中的'this'指向的是 test 物件，所以列印的 prop 是 test 中的 prop，即 42。
var test = {
prop: 42,
func: function(){
return this.prop;
},
};
console.log (test.func()); // 42
複製程式碼如果我們直接呼叫getFullname函式，第二個例子將列印出'David Jones'，因為此時 this 找不到呼叫者，所以預設就為 window 物件，列印的 fullname 即是全域性的。
var fullname = ‘David Jones’
var obj ={
fullname: ‘Colin Brown’,
prop:{
fullname:’Aurelio Deftch’,
getFullname: function(){
return this.fullname;
}
}
}
var test = obj.prop.getFullname
console.log(test()) // David Jones
obj.prop.getFullname() // ‘Aurelio Deftch’
複製程式碼2. 由於 this 關鍵字很混亂，如何解決這個問題
有很多方法可以解決這個問題; 但是，無論你選擇哪種解決方案，最重要的是要知道你決定讓 this 指向哪個物件。
一旦你弄清楚了this指向的物件，你就可以直接將它改成物件名。 否則，使用bind，call，apply函式也可以解決問題。
3.什麼是閉包
當我第一次解釋閉包時，我常說函式中的函式;但是，它沒有正確地描述閉包的確切含義。
閉包是在另一個作用域內建立一個封閉的詞法範圍。它通常會自動返回來生成這個詞法環境。這個環境由建立閉包時在作用域內的任何區域性變數組成。它就像一個微型工廠，用這些原料生產出具有特定功能的產品。
function add(n){
var num = n
return function addTo(x){
return x + num
}
}
addTwo = add(2)
addTwo(5)
複製程式碼閉包的另一個應用是建立私有變數和方法。JavaScript不像Java那樣可以很好地支援oop。在JS中沒有明確的方法來建立私有方法，但是閉包可以私有方法。
4.解釋一下變數的提升
變數的提升是JavaScript的預設行為，這意味著將所有變數宣告移動到當前作用域的頂部，並且可以在宣告之前使用變數。初始化不會被提升，提升僅作用於變數的宣告。
var x = 1
console.log(x + '——' + y) // 1——undefined
var y = 2
複製程式碼5. JavaScript如何處理同步和非同步情況
儘管JavaScript是一種只有一個呼叫堆疊的單執行緒程式語言，但它也可以使用一個稱為**事件迴圈(event loop)**的機制來處理一些非同步函式。從基本級別瞭解JavaScript如何工作是理解JS如何處理非同步的關鍵部分。
如圖所示，呼叫堆疊是定位函式的位置。一旦函式被呼叫，函式將被推入堆疊。然而，非同步函式不會立即被推入呼叫堆疊，而是會被推入任務佇列(Task Queue)，並在呼叫堆疊為空後執行。將事件從任務佇列傳輸到呼叫堆疊稱為事件迴圈。
6. 如何理解事件委託
在DOM樹上繫結事件監聽器並使用JS事件處理程式是處理客戶端事件響應的典型方法。 從理論上講，我們可以將監聽器附加到HTML中的任何DOM元素，但由於事件委派，這樣做是浪費而且沒必要的。
** 什麼是事件委託？**
這是一種讓父元素上的事件監聽器也影響子元素的技巧。 通常，事件傳播（捕獲和冒泡）允許我們實現事件委託。 冒泡意味著當觸發子元素（目標）時，也可以逐層觸發該子元素的父元素，直到它碰到DOM繫結的原始監聽器（當前目標）。 捕獲屬性將事件階段轉換為捕獲階段，讓事件下移到元素; 因此，觸發方向與冒泡階段相反。 捕獲的預設值為false。
7. 如何理解高階函式
JavaScript中的一切都是物件，包括函式。我們可以將變數作為引數傳遞給函式，函式也是如此。我們呼叫接受和或返回另一個函式稱為高階函式的函式。
8. 如何區分宣告函式和表示式函式
// 宣告函式
function hello() {
return "HELLO"
}
// 表示式函式
var h1 = function hello() {
return "HELLO"
}
複製程式碼兩個函式將在不同的時期定義。在解析期間定義宣告，在執行時定義表示式;因此，如果我們控制檯列印 h1，它將顯示HELLO。
9.解釋原型繼承是如何工作的
JavaScript不是一種物件導向的友好程式語言，但它仍然使用繼承的思想來實現依賴關係，並使用許多內建函式使其靈活使用。瞭解原型繼承的工作原理將使你很好地理解JavaScript知識，從而避免概念上的誤用。
最好在大腦中描繪一下JavaScript的整個機制，以瞭解原型繼承。
JavaScript中有一個超級物件，所有物件都將從中繼承。 '__ proto__'指向的物件的Prototype內部屬性。 原型(prototype )包含一個建構函式，使物件能夠從中建立例項。 __proto__始終存在於物件中，並且分層指向它所屬的原型，直到null，這稱為原型鏈。
10. 解釋一下嚴格模式(strict mode)
嚴格模式用於標準化正常的JavaScript語義。嚴格模式可以嵌入到非嚴格模式中，關鍵字 ‘use strict’。使用嚴格模式後的程式碼應遵循JS嚴格的語法規則。例如，分號在每個語句宣告之後使用。
程式碼部署後可能存在的BUG沒法實時知道，事後為了解決這些BUG，花了大量的時間進行log 除錯，這邊順便給大家推薦一個好用的BUG監控工具 Fundebug。
交流（歡迎加入群，群工作日都會發紅包，互動討論技術）
乾貨系列文章彙總如下，覺得不錯點個Star，歡迎 加群 互相學習。
因為篇幅的限制，今天的分享只到這裡。如果大家想了解更多的內容的話，可以去掃一掃每篇文章最下面的二維碼，然後關注我們們的微信公眾號，瞭解更多的資訊和有價值的內容。
每次整理文章，一般都到2點才睡覺，一週4次左右，挺苦的，還望支援，給點鼓勵