javascript筆記之匿名函數(shù)和閉包
本文介紹了js匿名函數(shù)和閉包的相關內(nèi)容,供大家參考,具體內(nèi)容如下
匿名函數(shù)
<script type="text/javascript"> //function(){}//會報錯 var fun = function(){};//將匿名函數(shù)賦值給變量 (function(){})();//匿名函數(shù)自執(zhí)行 function(){ return function(){};//函數(shù)里的匿名函數(shù) } </script>
閉包
閉包是指有權訪問另一個函數(shù)作用域中的變量的函數(shù),創(chuàng)建閉包的常見的方式,就是在一個函數(shù)內(nèi)部創(chuàng)建另一個函數(shù),通過另一個函數(shù)訪問這個函數(shù)的局部變量
<script type="text/javascript"> //通過閉包可以返回局部變量 function box() { var user = 'Lee'; return function () { //通過匿名函數(shù)返回box()局部變量 return user; }; } console.log(box()()); //通過box()()來直接調(diào)用匿名函數(shù)返回值 var b = box(); console.log(b()); //另一種調(diào)用匿名函數(shù)返回值 //通過閉包可以實現(xiàn)局部變量的累加 function box() { var age = 100; return function () { age ++; return age; } } var b = box(); //獲得函數(shù) console.log(b()); //調(diào)用匿名函數(shù) console.log(b()); //第二次調(diào)用匿名函數(shù),實現(xiàn)累加 </script>
使用閉包有一個優(yōu)點,也是它的缺點:就是可以把局部變量駐留在內(nèi)存中,可以避免使用全局變量。(全局變量污染導致應用程序不可預測性,每個模塊都可調(diào)用必將引來災難,所以推薦使用私有的,封裝的局部變量)。由于閉包里作用域返回的局部變量資源不會被立刻銷毀回收,所以可能會占用更多的內(nèi)存。過度使用閉包會導致性能下降,建議在非常有必要的時候才使用閉包。
循環(huán)里的閉包
<script type="text/javascript"> function box() { var arr = []; for (var i = 0; i < 5; i++) { arr[i] = function () { return i; }; } return arr; } var b = box(); //得到函數(shù)數(shù)組 console.log(b.length); //得到函數(shù)集合長度 for (var i = 0; i < b.length; i++) { console.log(b[i]()); //輸出每個函數(shù)的值,都是最后一個值 } </script>
box()已執(zhí)行完畢,i早已變成5,而返回的函數(shù)保存的變量都是i,所以最終的結果就是5個5
循環(huán)里的閉包--修改
<script type="text/javascript"> function box() { var arr = []; for (var i = 0; i < 5; i++) { arr[i] = (function (num) { return function () { //返回函數(shù) return num; } })(i); /* //相當于: arr[i] = (function () { var num = i;//定義一個局部變量 return function () { return num; } })(); */ } return arr; } var b = box(); //得到函數(shù)數(shù)組 for (var i = 0; i < b.length; i++) { console.log(b[i]()); //0,1,2,3,4 } </script>
通過在box作用域里新建塊級作用域來是每個返回函數(shù)保存的變量都不一樣
閉包中的this對象
而閉包卻在運行時指向window的,因為閉包并不屬于這個對象的屬性或方法。
<script type="text/javascript"> var user = 'The Window'; var obj = { user : 'The Object', getUserFunction : function () { return function () { //閉包不屬于obj,里面的this指向window return this.user; }; } }; console.log(obj.getUserFunction()()); //The window //可以強制指向某個對象 console.log(obj.getUserFunction().call(obj)); //The Object /* //也可以從上一個作用域中得到對象 getUserFunction : function () { var that = this; //從對象的方法里得對象 return function () { return that.user; }; } */ </script>
模仿塊級作用域
JavaScript沒有塊級語句的作用域,if () {} for () {}等沒有作用域
<script type="text/javascript"> //使用塊級作用域(私有作用域)改寫 function box(count) { (function () { for (var i = 0; i<count; i++) {} })(); console.log(i); //報錯,無法訪問 } box(2); </script>
使用了塊級作用域(私有作用域)后,匿名函數(shù)中定義的任何變量,都會在執(zhí)行結束時被銷毀。在全局作用域中使用塊級作用域可以減少閉包占用的內(nèi)存問題,因為沒有指向匿名函數(shù)的引用。只要函數(shù)執(zhí)行完畢,就可以立即銷毀其作用域鏈了。
私有變量
JavaScript沒有私有屬性的概念;所有的對象屬性都是公有的。不過,卻有一個私有變量的概念。任何在函數(shù)中定義的變量,都可以認為是私有變量,因為不能在函數(shù)的外部訪問這些變量
而通過函數(shù)內(nèi)部創(chuàng)建一個閉包,那么閉包通過自己的作用域鏈也可以訪問這些變量。而利用這一點,可以創(chuàng)建用于訪問私有變量的公有方法。
<script type="text/javascript"> function Box() { var age = 100; //私有變量 function run() { //私有函數(shù) return '運行中...'; } this.get = function () { //對外公共的特權方法,閉包(函數(shù)訪問了不屬于對象作用域的age和run方法) return age + run(); }; } var box = new Box(); console.log(box.get()); </script>
靜態(tài)私有變量
上面的私有變量在每次實例化對象的時候都會重新初始化,通過塊級作用域(私有作用域)中定義私有變量或函數(shù),同樣可以創(chuàng)建對外公共的特權方法。。
<script type="text/javascript"> (function () { var age = 100;//靜態(tài)私有變量 function run() { return '運行中...'; } Box = function () {}; //構造方法,沒有使用var,全局函數(shù) Box.prototype.go = function () { //原型方法 return age + run(); }; })(); var box = new Box(); console.log(box.go()); </script>
模塊模式
<script type="text/javascript"> var box = function () { //box是一個模塊 var age = 100; function run() { return '運行中...'; } return { //直接返回對象 go : function () { return age + run(); } }; }(); </script>
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
layer實現(xiàn)彈出層自動調(diào)節(jié)位置
今天小編就為大家分享一篇layer實現(xiàn)彈出層自動調(diào)節(jié)位置,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09在Bootstrap開發(fā)框架中使用dataTable直接錄入表格行數(shù)據(jù)的方法
這篇文章主要介紹了在Bootstrap開發(fā)框架中使用dataTable直接錄入表格行數(shù)據(jù)的方法,這個可以提高數(shù)據(jù)的錄入方便,特別是在一些簡單業(yè)務的明細數(shù)據(jù)的時候,看起來會比彈出窗口錄入方便一些,非常具有實用價值,需要的朋友可以參考下2018-10-10JavaScript中的常見問題解決方法(亂碼,IE緩存,代理)
這篇文章主要是對JavaScript中的常見問題解決方法(亂碼,IE緩存,代理)進行了詳細的分析介紹,需要的朋友可以過來參考下,希望對大家有所 幫助2013-11-11