JS如何使用函數及閉包

這篇文章主要介紹了JS如何使用函數及閉包，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

每聲明一個函數就會產生一個作用域。而外面的作用域訪問不了里面的作用域（把里面的變量和函數隱藏起來），而里面的可以訪問到外面的。對于隱藏變量和函數是一個非常有用的技術。

基于作用域隱藏的方法叫做最小授權或最小暴露原則。

這個原則是指在軟件設計中，應該最小限度的暴露必要內容，而將其內容都隱藏起來，比如某個模塊或對象得API設計。隱藏變量和函數可以解決同名標識符的之間的沖突，沖突會導致變量的意外覆蓋。

例如：

var a = 2;function foo(){  var a = 3;  console.log(a);}foo();console.log(a);

雖然這種技術可以解決一些問題，但是他并不理想，會導致一些額外的問題，首先必須聲明一個具名函數foo（），意味著foo這個名稱本身“污染”了所在的作用域，其次必須顯式的通過函數名foo（）調用這個函數才能運行其中的代碼。

如果函數不需要函數名，并且能夠自動運行，這會更加理想。幸好js提供了同時解決這兩個問題的方案 -- (IIFE) Immediately Invoked Function Expression  --  立即執行函數

var a = 2;(function foo(){    var a = 3;    console.log(a);})()console.log(a);

首先立即執行函數不會當做函數聲明處理而是當做函數表達式處理。

區分函數聲明還是函數表達式：看function在聲明中是不是第一個詞，如果是第一個詞就是函數聲明否則就是函數表達式。而立即執行函數" (function "，不是"     function ",所以是函數表達式。

函數聲明和函數表達式之間最重要的區別是他們的名稱標識符將會綁定在何處

函數聲明的函名稱數會綁定在當前作用域內。假如在全局作用域創建一個函數聲明，就可以在全局作用域訪問這個函數名稱并執行。而函數表達式的函數名稱會綁定在自身的函數中，而不是當前說在作用域中。例如你全局創建一個函數表達式，如果你直接執行這個你創建的函數表達式的函數名就會報錯，因為當前作用域下沒有這個標識符，而你在函數表達式里面的作用域里訪問這個函數名就會返回這個函數的引用。

作用域閉包，嗯，閉包這兒兩個字就有點讓人難以理解，（可以想象成一個包是關上的，里面隱藏了一些神秘的東西）而對于閉包的定義是這樣說的：當函數可以記住并訪問所在的作用域時，就產生了閉包，即使函數是在當前作用域之外執行。

for instance（拽個英文，哈哈）。

function foo() {    var a = 2;    function bar() {        console.log(a);    }    bar();}foo();

上面的 代碼bar()可以訪問外部作用域中的變量。根據上面的定義這是閉包嗎？從技術來講也許是，但我們理解的是作用域在當前作用域查找變量如果沒找到會繼續向上面查找，找到返回，找不到繼續找，直到全局作用域。-- 而這些正是閉包的一部分。函數bar()具有一個涵蓋foo()作用域的閉包。

function foo(){    var a  = 2;    function bar (){        console.log(a);    }    return bar;}var baz = foo();baz();

在上面的代碼更好的展示了閉包。

bar()函數在定義時作用域以外的地方執行（此時在全局作用域執行）。在foo()函數執行后，通常會期待foo()整個內部作用域都被銷毀，因為我們知道引擎有垃圾回收器用來釋放不在使用的內存空間，由于foo（）已經執行完，看上去內容不會再被使用，所以很自然的會考慮對齊進行回收，回收后意味著里面的函數和變量訪問不到了。foo（）執行完，baz變量存著bar函數的引用。當執行baz也就是bar函數時。console.log(a)。不理解閉包的人可能認為會報錯，事實上，打印的是2；？？？what？

foo（）函數作用域不是執行完銷毀了嗎？怎么還能訪問到a變量？-- 這就是閉包。

當foo（）執行后，bar函數被返回全局作用域下，但是bar函數還保留著當時的詞法作用域（當時寫代碼是的順序就已經定義了作用域，這個作用域叫詞法作用域--外面函數套著里面的函數的那種）甚至直到全局作用域。所以bar還留有foo()函數的引用。使得foo（）函數沒有被回收。

閉包可以說不出不在，只是你沒有發現認出他。在定時器，事件監聽器，ajax請求，跨窗口通信或者任何其他的異步（或者同步）任務中，只要使用了回調函數，實際上就是使用閉包。

for instance

function wait(message) {    setTimeout(function timer() {        console.log(message);    }, 1000);}wait("hello");

在上面的代碼中將一個內部函數（名為timer）傳遞給setTimerout(...).timer具有涵蓋wait（...）的作用域的閉包。因此還保有對變量message的引用。wait()執行1000毫秒后，它的內部作用域不會消失，timer函數依然保有wait（）作用域的閉包。

而閉包和立即執行函數息息相關。

循環和閉包

for(var i = 1; i <= 5; i++){    setTimeout(function timer(){        console.log(i);    },i*1000);}

上面代碼我們以為輸出的會是1-5，可事實上輸出的是5個6，這是為啥啊 -- 閉包啊。

延遲函數的回調會在循環結束時執行。事實上，當定時器運行時即使每個迭代的是setTimerout(...,0),所有的回調函數依然是循環結束后才會執行。我猜是跟js執行機制有關系吧。至于為什么都是6. 因為即使5個函數是在各個迭代中分別定義的，但是他們又被封閉在一個共享的全局作用域中因此實際上只有一個i.而怎么解決呢，立即執行函數來了！！！

for (var i = 1; i <= 5; i++) {    (function (i) {        setTimeout(function timer() {            console.log(i);        }, i * 1000);    })(i)}

打印出來1,2,3,4,5了歐，這回是你想要的數了。解釋一下，5次循環創建了5個立即執行函數，這5個函數的作用域都不相同，立即函數接收的參數是當前循環的i.所以當timer執行時訪問的就是自己立即執行函數對應的作用域。也就是說5個timer函數分別對應5個作用域，每個作用域保存的變量i都不同，解決啦！！！

你懂閉包了嗎？

js執行機制

JavaScript語言的一大特點就是單線程，也就是說，同一個時間只能做一件事。那么，為什么JavaScript不能有多個線程呢？這樣能提高效率啊。JavaScript的單線程，與它的用途有關。作為瀏覽器腳本語言，JavaScript的主要用途是與用戶互動，以及操作DOM。這決定了它只能是單線程，否則會帶來很復雜的同步問題。比如，假定JavaScript同時有兩個線程，一個線程在某個DOM節點上添加內容，另一個線程刪除了這個節點，這時瀏覽器應該以哪個線程為準所以，為了避免復雜性，從一誕生，JavaScript就是單線程，這已經成了這門語言的核心特征，將來也不會改變。

單線程就意味著，所有任務需要排隊，前一個任務結束，才會執行后一個任務。如果前一個任務耗時很長，后一個任務就不得不一直等著。JavaScript語言的設計者意識到這個問題，將所有任務分成兩種，一種是同步任務（synchronous），另一種是異步任務（asynchronous）。同步任務指的是，在主線程上排隊執行的任務，只有前一個任務執行完畢，才能執行后一個任務；異步任務指的是，不進入主線程、而進入"任務隊列"（task queue）的任務，只有"任務隊列"通知主線程，某個異步任務可以執行了，該任務才會進入主線程執行。

主線程從"任務隊列"中讀取事件，這個過程是循環不斷的，所以整個的這種運行機制又稱為Event Loop（事件循環）。只要主線程空了，就會去讀取"任務隊列"，這就是JavaScript的運行機制。

哪些語句會放入異步任務隊列及放入時機一般來說，有以下四種會放入異步任務隊列：setTimeout 和 setlnterval  ，DOM事件，ES6中的Promise，Ajax異步請求

感謝你能夠認真閱讀完這篇文章，希望小編分享的“JS如何使用函數及閉包”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!