摘要:閉包正確的說應(yīng)該是指一個閉包域每當(dāng)聲明了一個函數(shù)它就產(chǎn)生了一個閉包域可以解釋為每個函數(shù)都有自己的函數(shù)棧每個閉包域?qū)ο蠖加幸粋€不是屬性內(nèi)默認有個名為的全局引用有了這個引用就可以直接調(diào)用的屬性或方法凡是在閉包域內(nèi)聲明的變量或方法外部無法直接訪問
閉包
正確的說,應(yīng)該是指一個閉包域,每當(dāng)聲明了一個函數(shù),它就產(chǎn)生了一個閉包域(可以解釋為每個函數(shù)都有自己的函數(shù)棧),每個閉包域(Function 對象)都有一個 function scope(不是屬性),function scope內(nèi)默認有個名為 Globe 的全局引用(有了這個引用,就可以直接調(diào)用 Globe 的屬性或方法)
凡是在閉包域內(nèi)聲明的變量或方法,外部無法直接訪問
閉包域可以訪問外部的變量或方法
(上圖為 chrome 下 debug 環(huán)境)
當(dāng)在一個閉包域內(nèi)包含另一個閉包域時(簡單的說就是在一個函數(shù)內(nèi)有另一個函數(shù),當(dāng)然這個內(nèi)部函數(shù)的生命周期是依附于外部函數(shù)的), 此時,若子閉包域(內(nèi)部的閉包域,內(nèi)部函數(shù))使用了父閉包域(外部閉包域,外部函數(shù))的私有變量(在父閉包域中聲明的變量,父閉包域的外部空間無法直接訪問,但子閉包域可以訪問),子閉包域即當(dāng)前的子函數(shù)的 function scope 會產(chǎn)生一個 closure 對象屬性,這個對象屬性內(nèi)包含的是子閉包域?qū)Ω搁]包域的所有引用(只要子閉包域(內(nèi)部函數(shù))還存活,其父閉包域(外部函數(shù))就依舊存活),倘若在父閉包域存活期間對其私有變量內(nèi)容進行修改,則對這些父閉包域的私有變量進行引用的子閉包域中 function scope 的 closure 對象屬性的內(nèi)容也會發(fā)生變化,因為這只是引用.
舉例:
結(jié)果如下:
第一次調(diào)用innerA
第二次調(diào)用 innerA
控制臺輸出回到主題 面試經(jīng)典問題
產(chǎn)品一
產(chǎn)品二
產(chǎn)品三
產(chǎn)品四
產(chǎn)品五
解決辦法:
解決辦法一
/* 解決思路: 增加若干個對應(yīng)的閉包域空間(這里采用的是匿名函數(shù)),專門用來存儲原先需要引用的內(nèi)容(下標),不過只限于基本類型(基本類型值傳遞,對象類型引用傳遞) */ for(var i = 0;i解決辦法二
/* 解決思路: 將下標作為對象屬性(name:"i",value:i的值)添加到每個數(shù)組項(p對象)中 */ for(var i = 0;i解決辦法三
/* 解決思路: 與解決辦法一有點相似但卻有點不太相似. 相似點:同樣是增加若干個對應(yīng)的閉包域空間用來存儲下標 不同點:解決辦法一是在新增的匿名閉包空間內(nèi)完成事件的綁定,而此例是將事件綁定在新增的匿名函數(shù)返回的函數(shù)上 此時綁定的函數(shù)中的 function scope 中的 closure 對象的 引用 arg 是指向?qū)⑵浞祷氐哪涿瘮?shù)的私有變量 arg */ for(var i = 0; i解決辦法四
/* 解決思路與解決辦法一相同 */ for(var i = 0; i解決辦法五
/* 解決思路與解決辦法三及四相同 */ for(var i = 0;i解決辦法六
/* 解決思路: 將下標添加為綁定函數(shù)的屬性 */ for(var i = 0;i解決辦法七
/* 解決思路: 通過 new 使用 Function 的構(gòu)造函數(shù) 創(chuàng)建 Function 實例實現(xiàn),由于傳入的函數(shù)體的內(nèi)容是字符串,故 Function 得到的是一個字符串拷貝,而沒有得到 i 的引用(這里是先獲取 i.toString()然后與前后字符串拼接成一個新的字符串,Function 對其進行反向解析成 JS 代碼) */ for(var i = 0;i解決辦法八
/* 解決思路: 直接通過 Function 返回一個函數(shù) 與解決辦法七的不同之處在于: 解決辦法七使用 new,使用了 new,此時 Function 函數(shù)就被當(dāng)成構(gòu)造器可以用來構(gòu)造一個 Function 實例返回 當(dāng)前解決辦法沒有使用 new ,即將 Function 函數(shù)當(dāng)成一個函數(shù),傳入?yún)?shù)返回一個新函數(shù); 其實此處 new 與不 new 只是的區(qū)別在于: 使用了 new 即 Function 函數(shù)充當(dāng)構(gòu)造器,由 JS 解析器生產(chǎn)一個新的對象,構(gòu)造器內(nèi)的 this 指向該新對象; 不實用 new 即 Function 函數(shù)依舊是函數(shù),由函數(shù)內(nèi)部自己生產(chǎn)一個實例返回. */ for(var i = 0;i解決辦法九
使用ES6新語法 let 關(guān)鍵字 由于幾新東西 各瀏覽器支持不同
chrome 及 opera支持以下語法在 chrome 查看
可以在控制臺看到 j 變量是一個 block 級的變量
待函數(shù)綁定完成后看數(shù)組項:
此時的該數(shù)組項的的 Block 域有個 j 存儲的就是對應(yīng)的數(shù)組下標
firefox支持一下語法由于新語法各大廠商的支持尚未規(guī)范故暫不不推薦使用
解決辦法大同小異,只要理解其中的實質(zhì),可以寫出多多的解決辦法
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/86017.html
摘要:到這里,如果你明白了,我們就可以繼續(xù)進行下一步了理解匿名函數(shù)。 似乎只要一沾上for循環(huán),難度立刻加倍,下面我們來看一道python的面試題: 要求寫出下面代碼的輸出結(jié)果并且解釋原因。 def multipliers(): return [lambda x:i*x for i in range(4)] print([m(2) for m in multipliers()]) 這...
摘要:線程的劃分尺度小于進程,使得多線程程序的并發(fā)性高。線程在執(zhí)行過程中與進程還是有區(qū)別的。每個獨立的線程有一個程序運行的入口順序執(zhí)行序列和程序的出口。從邏輯角度來看,多線程的意義在于一個應(yīng)用程序中,有多個執(zhí)行部分可以同時執(zhí)行。 showImg(https://segmentfault.com/img/bVbv2GE?w=900&h=400); 前言 本文講解 56 道 JavaScript...
摘要:昨天晚上,筆者有幸參加了一場面試,有一個環(huán)節(jié)就是現(xiàn)場編程題目如下示例數(shù)據(jù)如下,求每名學(xué)生對應(yīng)的成績最高的那門科目與,用實現(xiàn)這個題目看上去很簡單,其實,并不簡單。 ??昨天晚上,筆者有幸參加了一場面試,有一個環(huán)節(jié)就是現(xiàn)場編程!題目如下:??示例數(shù)據(jù)如下,求每名學(xué)生(ID)對應(yīng)的成績(score)最高的那門科目(class)與ID,用Python實現(xiàn): showImg(https://se...
摘要:今天這篇文章我們來看看一道必會面試題,即如何實現(xiàn)一個深拷貝。木易楊注意這里使用上面測試用例測試一下一個簡單的深拷貝就完成了,但是這個實現(xiàn)還存在很多問題。 引言 上篇文章詳細介紹了淺拷貝 Object.assign,并對其進行了模擬實現(xiàn),在實現(xiàn)的過程中,介紹了很多基礎(chǔ)知識。今天這篇文章我們來看看一道必會面試題,即如何實現(xiàn)一個深拷貝。本文會詳細介紹對象、數(shù)組、循環(huán)引用、引用丟失、Symbo...
摘要:同步異步回調(diào)傻傻分不清楚。分割線上面主要講了同步和回調(diào)執(zhí)行順序的問題,接著我就舉一個包含同步異步回調(diào)的例子。同步優(yōu)先回調(diào)內(nèi)部有個,第二個是一個回調(diào)回調(diào)墊底。異步也,輪到回調(diào)的孩子們回調(diào),出來執(zhí)行了。 同步、異步、回調(diào)?傻傻分不清楚。 大家注意了,教大家一道口訣: 同步優(yōu)先、異步靠邊、回調(diào)墊底(讀起來不順) 用公式表達就是: 同步 => 異步 => 回調(diào) 這口訣有什么用呢?用來對付面試的...
閱讀 1625·2021-11-17 09:33
閱讀 1201·2021-11-12 10:36
閱讀 2480·2019-08-30 15:54
閱讀 2486·2019-08-30 13:14
閱讀 2978·2019-08-26 14:05
閱讀 3345·2019-08-26 11:32
閱讀 3074·2019-08-26 10:09
閱讀 3065·2019-08-26 10:09