這里舉2個小案例,供大家參考閉包在實際中的用處。
案例1.獲取容器中每一個div的序號
(1)網頁運行界面如下:
(2)HTML結構如下:
(3)傳統的做法
這個做法的思路就是在for循環時,先給每個div DOM元素添加一個屬性index,這樣就把當前盒子的序號記錄到了DOM元素的屬性上。
(4)閉包的做法
這種做法非常巧妙,它使用了閉包能延長作用域鏈的特點,把當前循環時的循環變量i緩存了下來。從而實現了我們的要求。
案例2:點贊
(1)案例運行界面如下
功能很簡單,就是給明星點贊
(2)HTML結構如下
(3)先來看個錯誤的代碼
這個代碼運行之后,每次點贊,4個明星是共享一個全局變量的值。這樣點贊肯定就是有問題的,比如我給林志玲點了3個贊,她的贊就該累加到4。這個時候,如果我再楊冪點贊,那楊冪的贊的次數應該從1做一次累加,變成2 。可是,這里由於是4個button按鈕共享一個全局變量num的值,所以我如果再給楊冪點贊的時候,不是從1變成2,而是從1直接變成了5 。這顯然是錯誤的。
(4)正確的做法,這里使用閉包
這里的思路其實跟案例1是相同的,都是使用閉包延長了局部變量的作用域鏈。