為何深度進修JavaScript？
JavaScript如今是最盛行的編程言語之一。它運轉在瀏覽器、服務器、挪動裝備、桌面運用，也可以包括冰箱。無需我舉其他再多不相干的例子，只需你正處置web開闢，你就不可避免地要寫JavaScript。
許多web開闢者僅僅由於能寫可以運轉的代碼就宣稱相識JavaScript。關於JavaScript，你可以用一個月就可以寫代碼，控制它今後畢生收益。（If there are no errors and nobody’s complaining why should you need to learn more?）（譯者注：不知所云）
好吧，我就是曾宣稱很相識此言語的一員。幾年前我用AngularJS和Node寫運用，當時對本身的才能異常自信。拋開功用，我深信我已征服了JavaScript。
當口試中讓我詮釋一下閉包時我懵逼了。我覺得本身曉得一點，和回調有關，我當時一向用回調（當時還不曉得Promise），但就是不曉得怎樣形貌其道理。
在我的開闢職業生涯中那次失利的JavaScript口試是最羞辱和最具教誨意義的閱歷。從那時起我用時一年半致力於JavaScript的高價段位，並決議分享於眾人。先從一個最常見的JavaScript口試題最先：
什麼是閉包？
毫無疑問你已在種種運用中運用過閉包。你每次為事宜處理器添加回調時你都在用閉包的奇異屬性。
我遇到過許多關於此觀點的詮釋，但我最佩服是Kyle Simpson下的定義：
當一個要領實行完脫離了本身的詞法作用域，但仍然可以記着並接見其詞法作用域，這就是閉包。
這個詮釋最先可以有點艱澀，讓我們抽絲剝繭摘下閉包的真面目。
此文不詳述作用域（有特地的主題論述），不過作用域是邃曉閉包道理的基礎。作用域就是包括某些屬性和要領的地區。每一個JavaScript要領都邑建立一個新的作用域，它內部的變量和入參都只能在其內部接見。
假如你在函數內聲明一個變量，函數外是接見不到的。不過，我們可以在函數內部定義具有作用域的內部函數。這些內嵌函數的迥殊的地方在於它們可以接見父作用域的變量。
坦白說這也算不上什麼迥殊的地方，由於每一個在全局作用域中定義的函數都能接見全局變量。雖然我們提到的這些內嵌函數可以接見父函數的作用域，但它們不能在父函數以外被挪用。除非我們將其暴露出來。
我們將內部函數暴露出來就可以在全局作用域中運用。牛逼！如今我們就可以為所欲為了。不過，暴露出來的內部函數實際上引用了它父作用域的變量，會不會有題目？不會！相對不會，這就是閉包！
閉包是暴露出來的內嵌要領
我不確定這是不是是給閉包下的最好的定義，但這確切可以很好地捉住此術語的實質。閉包就是我們在函數外部就可以接見其父作用域的內部函數。你可否經由過程我們之前提到的詞法作用域邃曉此詮釋呢？
function person(name) {
return {
greet: function() {
console.log('hello from ' + name)
}
}
}
let alex = person('alex');
alex.greet(); // hello from alex
console.log(alex.name); // undefined
console.log(name); // will throw ReferenceError我們在此定義了只要一個參數name的person函數。它返回一個以greet為屬性的對象。如今我們曉得，暴露出的greet函數可以接見父函數參數。只管name變量並沒有定義在greet的作用域中，由於它是閉包，所以greet可以從其父作用域中獵取。
並非迥殊難邃曉，你可以都用了許屢次了。我學閉包前從沒把它設想的多災，邃曉了其背地的道理，我就邃曉了封裝並運用模塊。
哇唔，哇唔…模塊？封裝？出人意料。
模塊和用閉包封裝
我深陷JavaScript旋渦之前起首相識到个中許多深邃辭彙都有實踐詮釋。模塊和封裝就是這類術語很圓滿的例子。我先從封裝最先，用雷同的戰略各個擊破去邃曉它們。
封裝是基礎的編程準繩之一。學過OOP（面向對象編程）的人對此觀點異常熟習，但關於沒學過的人來講—封裝就是許可我們堅持數據私有的基礎隱蔽機制。我們不想把要領的一切內容暴露給全局作用域，我們想讓大多數內容堅持私有且不可接見。
這才是閉包的真正輕易的地方。我們可以應用閉包接見父作用域，甚至在外部接見的時刻取得適當地封裝。在父函數中可以有許多要領和變量，經由過程應用閉包我們可以將其暴露給我們須要的函數。
我們可以用閉包為我們的要領定義一個大眾API，並堅持要領中一切東西私有。我們如今已控制了封裝，只需實踐即可。在JavaScript中對此觀點的實踐就是運用模塊。
模塊
在ES6中可以運用import和export關鍵字發作以文件為基礎的模塊，但要注重這些只是語法糖罷了。
function Person(firstName, lastName, age) {
var private = 'this is a private member';
return {
getName: function() {
console.log('My name is ' + firstName + ' ' + lastName);
},
getAge: function() {
console.log('I am ' + age + ' years old')
}
}
}
let person = new Person('Alex', 'Kondov', 22);
person.getName();
person.getAge();
console.log(person.private); //undefined這是一個我們可以堅持一些數據私有的簡樸例子。我們可以有其他內嵌要領，只管導出后可以運用，但並沒有都暴露出來。
function Order (items) {
const total = items => {
return items.reduce((acc, curr) => {
return acc + curr.price
}, 0)
}
const addTaxToPrice = price => price + (price * 0.2)
return {
calculateTotal: () => {
return addTaxToPrice(total(items)).toFixed(2)
}
}
}
const items = [
{ name: 'Toy', price: 14.99 },
{ name: 'Candy', price: 7.99 }
]
const order = Order(items)
console.log(order.total) // undefined
console.log(order.addTaxToPrice) // undefined
console.log(order.calculateTotal()) // 27.58在這個更靠近實在的例子中要領返回了一個order對象，唯一暴露出來的要領是calculateTotal。Order函數有一個閉包，許可此閉包運用它的變量和入參。在你盤算定單總價時隱蔽了內部邏輯，也輕易今後擴大。
奇異的地方
JavaScript也有其奇異的地方。實際上有些奇異的地方讓人異常蛋疼。閉包運用不當就會很坑。
下面的代碼常常出如今JavaScript口試中讓猜它的輸出。
for (var i = 1; i <= 5; i++) {
setTimeout(function timer () {
console.log(i);
}, i * 1000);
}從1輪迴到5並在一段時間后打印出當前的数字。一般覺得會輸出1，2，3，4，5，對嗎？
讓我驚異的是上面的代碼會在輸出台上一連5次打印出6。假如輪迴當中沒有setTimeout不會有任何題目，由於日記輸出會被馬上實行。很明顯，列隊操縱引發了這個題目。
我們希冀每次挪用setTimeout都邑獵取i變量本身的拷貝，但實際狀況倒是它接見的是它的父作用域。又由於都在列隊，第一個日記會在它列隊1秒后發作。當1000毫秒過去的時刻，輪迴早已完畢，i變量也早已被賦值為6。
我邃曉了這個題目但怎樣修復呢？setTimeout會在全局作用域尋覓i變量，沒法打印出我們想要的数字。我們可以把setTimeout包裹到一個要領中並將我們想要輸出的變量傳進去。如許setTimeout會從它的父作用域而不是全局作用域舉行接見。
for (var i = 1; i <= 5; i++) {
(function(index) {
setTimeout(function timer () {
console.log(index);
}, index * 1000);
})(i)
}我們運用IIFE（馬上實行函數，Immediately Invoked Function Expression）並把想輸出的数字傳進去。IIFE是一種定義后馬上挪用的函數，它常用於這類狀況—我們想要建立作用域。這類體式格局每次函數挪用都用它們本身的變量拷貝，這也意味着setTimeout運轉時會接見對應的数字。所以上面的例子我們會到達期待的效果：1，2，3，4，5
完畢語
此文引見了閉包的實質，但另有許多須要進修和更多的邊際狀況須要斟酌。假如你想更進一步相識閉包，我強烈推薦Kyle Simpson的書中Scope & Closures的部份。
