深入了解JS之作用域和閉包
ECMAScript5: JS 的代碼沒有代碼塊;使用函數運行的機制進行創建閉包;閉包就是作用域的意思;
ES5中,JS中只有函數才可以創建能操作的作用域;
JavaScript中的內存也分為棧內存和堆內存。一般來說,棧內存中存放的是存儲對象的地址,而堆內存中存放的是存儲對象的具體內容。對于原始類型的值而言,其地址和具體內容都存在與棧內存中;而基于引用類型的值,其地址存在棧內存,其具體內容存在堆內存中。堆內存與棧內存是有區別的,棧內存運行效率比堆內存高,空間相對推內存來說較小,反之則是堆內存的特點。所以將構造簡單的原始類型值放在棧內存中,將構造復雜的引用類型值放在堆中而不影響棧的效率。
函數執行時形成私有作用域函數執行的時候(直接目的:讓函數體中的代碼執行)會形成一個新的私有的作用域(棧內存),供函數體中的代碼執行;
給形參賦值 私有作用域下的預解釋 私有作用域下的代碼執行形成的新的私有的作用域還保護了里面的私有變量不受外界的影響,我們把函數的這種保護機制叫”閉包”:為什么要有作用域;因為變量要規定活動范圍的,為便于管理不同范圍的變量;所以要給變量設置活動范圍;
預解釋也是在各自的作用域里進行預解釋的;
function fn(){ var a=1;}fn();fn();console.log(a);//Uncaught ReferenceError: a is not defined;
因為a沒有聲明和定義過,所以報錯了;
上面的fn運行了兩次,所以產生了兩個堆內存;兩個作用域(作用域也就是閉包)各自分別有一個a的變量;a的值都是數字1,但是兩個變量是不相等的;兩個a之間是沒有任何關系的;
就好比我們都屬于人類;我們都繼承了人類這個對象所具有的特征;我有一雙手,你也有一雙手,但是我們兩個人的手是沒有關系的;我的手不等于你的手;
全局變量和私有變量 在全局作用域下聲明的變量是全局變量; 在私有作用域中聲明的變量是私有變量;函數的形參也是私有的變量; 如何區分函數中出現的變量是私有的還是非私有的?首先看是否為形參,然后看是否在私有作用域中聲明過(有沒有var過),兩者有其一就是私有的變量,那么在當前函數中不管什么位置出現都是私有的,和全局的沒有半毛錢的關系;如果兩者都沒有,說明不是私有的;如果一個函數中出現的變量不是私有的,那么會往其上級作用域查找,上級沒有則繼續查找,一直找到window為止,如果window也沒有呢?
如果是獲取:會報錯
function fn() { console.log(num);//Uncaught ReferenceError: num is not defined}fn();
如果是設置:不是私有的,找全局,全局沒有的話相當于給全局加一個
function fn() { num = 13;//相當于給window增加了一個叫做num的屬性名,屬性值是13 window.num=13;}fn();console.log(num);//13如何查找當前作用域的上級作用域?
當前作用域的上級作用域是誰和函數在哪執行的沒有任何的關系,我們只需要看當前函數是在哪個作用域下定義的,那么它的上級作用域就是誰;
下面是查找上一級作用域,一直找到window的案例;
var total = 100;function fn() { var total = 10; return function () { console.log(total); }//如果返回的是一個引用數據類型的值(對象、數組、函數...),首先是把這個值開辟一個內存空間,有一個地址,然后把內存地址返回 ->例如在這里其實返回的就是 return xxxfff111;}var f = fn();//f=xxxfff111;f();// 10
//輸出的結果是 10 還是 100 ? 為什么 ?
如果是在自執行函數里呢?
var total = 100;function fn() { var total = 10; return function () { console.log(total); }}var f = fn();//f=xxxfff111;~function () {var total = 1200;f();//->;里面變量的上級作用域是誰}();// 10
下面代碼輸出的是什么?
var a=0;var b='0';function fn(){ console.log(a);console.log(b);console.log(typeof a); console.log(typeof b);a='1';var b=1;console.log(a);console.log(b);console.log(typeof a);console.log(typeof b);}fn();//運行后會輸出什么?如果沒有這行代碼;函數fn的定義是沒有意義的;函數只聲明定義,而不運行是沒有任何意義的;//0,undefined,'number','undefined','1',1,'string','number'
預解釋是作用域中的預解釋;js里是可以函數里面套函數的;都運行的時候,是在函數創建的作用域里再創建一個作用域;
下面是作用域的范圍;
var a='window';console.log(a);//windowfunction father(){console.log(a);//undefinedvar a='father';console.log(a);//fatherfunction children(){ console.log(b);//undefined console.log(a);//father var b='flag'; a='children'; console.log(a);//children } children(); console.log(a);//children}father();console.log(a);//window
JavaScript中的代碼執行順序是從上到下逐條運行的;遇到function定義函數的代碼塊;直接跳過;遇到函數執行的代碼;就找到引用的函數地址;開始跳到執行函數產生的作用域中執行代碼;等函數執行完以后,再回到當前作用域執行下面的代碼;
上面的代碼運行后,輸出的是
“window”,undefined,“father”,undefined,“father”,“children”,“children”,“window”
作用域鏈查找:當作用域套作用域的時候,children內找不到某個變量;會到children的父作用域father中找;當father中找不到的時候;會到father的父作用域找;一直找到window這個根作用域;屬于作用域鏈式查找;
函數運行產生的作用域函數的運行是一個有生命周期的內存地址;
函數運行時,會創建一個內存地址(產生堆內存,函數保存的就是這個堆內存的地址),當此函數運行結束時,此內存地址又會銷毀;這個地址,我們無法保存;它的靈活的,活動的;有生命周期的;我們也沒有辦法給這個作用域起一個變量名字,也沒辦法保存這個作用域,JS不提供這種機制;
也就是說:在作用域外面是沒辦法控制作用域內部的數據的;只能在作用域內部控制;而且作用域內部的代碼可以控制外部的數據;這種機制就叫做閉包,閉包與作用域鏈和函數的運行有關系的;
函數里的變量,就在這個內存里創建;我們可以把這個內存當成一個對象;那函數里的變量就是這個內存對象的屬性;
函數的定義和函數的執行是兩碼事(fn和fn()的區別);函數的執行與函數的定義地方無關;這個一定要理解!
閉包作用域就是閉包;我理解的是相同的意思;只是不同人對這個機制的叫法不同;閉包是一種機制;并不是某種形式或者概念;最大的閉包就是window,我們可以把window當做一個閉包;
權威指南182頁中對閉包的解釋;
權威指南解釋:函數的執行依賴于變量作用域,這個作用域是函數定義時決定的,而不是函數調用時決定的
注意:函數對象可以通過作用域鏈相互關聯起來;函數體內部的變量都可以保存在函數作用域內,這種特性叫閉包; 批注:這里和作用域鏈有關系的,和閉包沒有關系的;函數的作用域是誰,和在哪運行沒有關系;只和在哪兒定義有關系;
如下代碼;
var a=0;function fn(){ var a=1; function fm(){ console.log(a); } return fm;}var testFn1=fn();//hanshu這個變量就相當于fm函數;testFn1();//相當于fm函數運行;此時輸出的是1;而不是0;雖然是在window中運行的;但是在fn中定義的;所以a找到的是fm上一級作用域fm的a;而不是window中的a;作用域不銷毀的情況|內存釋放
作用域不銷毀的總結:當函數內return一個引用數據類型;并且函數外面有一個變量接收這個引用數據類型;此時的作用域是不銷毀的;
堆內存
對象數據類型或者函數數據類型在定義的時候首先都會開辟一個堆內存,堆內存有一個引用的地址,如果外面有變量等指到了這個地址,我們就說這個內存被占用了,就不能銷毀了;
堆內存釋放的問題->堆內存用來存儲引用數據類型值的
[谷歌]:瀏覽器會每隔一段時間,看我們的堆內存是否還有其他的東西引用著,如果還在被占用著,瀏覽器不會進行處理;但是如果我們的堆內存已經沒有任何的東西占用了,那么瀏覽器會把這個堆內存進行回收釋放
[IE和火狐]:開辟了一個堆內存,我們有一個占用的時候瀏覽器記一個數(記錄有多少個占用這個內存),當我們減少引用的時候,瀏覽器會把記數減1,當記的數字減為0的時候,瀏覽器會把我們的堆內存回收釋放
var obj1 = {name: '張三'};var obj2 = obj1;//我們想要讓堆內存釋放/銷毀,只需要把所有引用它的變量值賦值為null即可,如果當前的堆內存沒有任何東西被占用了,那么瀏覽器會在空閑的時候把它銷毀...obj1 = null;obj2 = null;
以上就是深入了解JS之作用域和閉包的詳細內容,更多關于JavaScript 作用域和閉包的資料請關注好吧啦網其它相關文章!
相關文章:
