js閉包

?

閉包(closure)是Javacript語言的一個難點,也是它的特色,很多高級應用都要依靠閉包實現。

一、變量的作用域

要理解閉包,首先必須理解Javascript特殊的變量作用域。

變量的作用域無非就是兩種:全局變量和局部變量。

Javascript語言的特殊之處,就在于函數內部可以直接讀取全局變量。

js code:

var n = 999;

function f1(){

  console.log(n);

}

f1();  //999

另一方面,在函數外部自然無法讀取函數內的局部變量。

js code:

function f1(){

  var n = 999;

}

console.log(n);  //error

這里有一個地方需要注意,函數內部聲明變量的時候,一定要使用var命令。如果不用的話,你實際上聲明了一個全局變量。

js code

function f1(){

  n = 999;

}

f1();

console.log(n);  //999

二、如何從外部讀取局部變量?

出于種種原因,我們有時候需要得到函數內的局部變量。但是,前面已經說過了,正常情況下,這是辦不到的,只有通過變通方法才能實現。

那就是在函數的內部,再定義一個函數。

js code

function f1(){

  n = 999;

  function f2(){

    console.log(n);  //999

  }

}

在上面的代碼中,函數f2就被包括在函數f1內部,這時f1內部的所有局部變量,對f2都是可見的。但是反過來就不行,f2內部的局部變量對f1就是不可見的。這就是javascript語言特有的‘鏈式作用域’結構(chain scope),子對象會一級一級地向上尋找所有父對象的變量。所以,父對象的所有變量,對子對象都是可見的,反之則不成立。

既然f2可以讀取f1中的局部變量,那么只要把f2作為返回值,我們就可以在f1外部讀取它的內部變量了。

js code

function f1(){

  n = 999;

  function f2(){

    console.log(n);

  }

  return f2;

}

var result = f1();  //返回的是f2函數

result();  //999

三、閉包的概念

上一節代碼中的f2函數,就是閉包。

閉包就是能夠讀取其他函數內部變量的函數,函數沒有被釋放,整條作用域鏈上的局部變量都將得到保留。

由于在javascript語言中,只有函數內部的子函數才能讀取局部變量,因此可以把閉包簡單理解成‘定義在一個函數內部的函數’。

所以,在本質上,閉包就是將函數內部和函數外部連接的一座橋梁。

四、閉包的用途

閉包可以用在許多地方。它的最大用處有兩個,一個是前面提到的可以讀取函數內部的變量,另一個就是讓這些變量的值始終保持在內存中。

js code

function f1(){

  var n = 999;

  nAdd = function(){

    n += 1;

  }

  function f2(){

    console.log(n);

  }

  return f2;

}

var result = f1();

result();  //從函數外部通過閉包f2獲取到函數f1內部局部變量的值

nAdd();  //從函數外部通過閉包修改局部變量n的值

result();  //再次通過閉包f2獲取到函數f1內部局部變量的值

在這段代碼中,result實際上就是閉包f2函數。它一共運行了兩次,第一次的值是999,第二次的值是1000。這證明了,函數f1中的局部變量n 一直保存在內存中,并沒有在f1調用后被自動清除。

為什么會這樣呢?原因就在于f1是f2的父函數,而f2被賦給了一個全局變量,這導致f2始終在內存中,不會再調用結束后,被垃圾回收機制(garbage collection)回收。

這段代碼中另一個值得注意的地方,就是‘nAdd=function(){n+=1}’這一行,首先在nAdd前面沒有使用var關鍵字,因此nAdd是一個全局變量,而不是局部變量。其次,nAdd的值是一個匿名函數(anonymous function),而這個匿名函數本身也是一個閉包,所以nAdd相當于是一個setter,可以在函數外部對函數內部的局部變量進行操作。

五、使用閉包的注意點

1>由于閉包會使得函數中的變量都被保存在內存中,內存消耗很大,所以不能濫用閉包,否則會造成網頁的性能問題,在IE中可能導致內存泄露。解決方法時,在退出函數之前,將不使用的局部變量全部刪除。

2>閉包會在父函數外部,改變父函數內部變量的值。所以,如果你把父函數當作對象(object)使用,把閉包當作它的公用方法,把內部變量當作它的私有屬性,這時一定要小心,不要隨便改變父函數內部變量的值。

?

參考:https://www.cnblogs.com/duanlianjiang/p/5036671.html

? ? ? ? ? ?http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html

轉載于:https://www.cnblogs.com/ygyy/p/10648798.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/278045.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/278045.shtml
英文地址,請注明出處:http://en.pswp.cn/news/278045.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Teams的MessageExtension最新功能:Initiate actions

官方文檔到目前為止對這個initiate action的說明比較簡潔,由于沒有一步步的截圖和說明,從頭到尾看一遍可能還在云里霧里。 我一步步摸索著走了一遍,發現這個initiate action的功能如此強大,不敢獨享,所以寫此博文&…

Java枚舉根據key獲取value

package com.utcip.crm.common.constants; import com.utcip.crm.common.base.process.ScheduleStatusEnum; /** * 合同變更存儲mongodb 狀態值 * author jingfangnan * */ public enum ConstractMongoStatus { NEW(3,"新增"), UPDATE(2,"修改"), D…

Selenium-基礎操作

一、測試代碼 Test public void test() { WebDriver driver new FirefoxDriver(); // 打開當前包中的index頁面 driver.get("file:///D:/%E8%B5%B5%E6%AC%A2/Selenium/Selenium/src/com/html/index.html"); WaitSeconds(1000); // 清除用戶輸入 driver.findElement(…

開發針對特殊租戶的Teams機器人

有些朋友問到,如果想要開發一個bot針對于Teams的某些租戶,如何做?實際上微軟的Teams的SDK早就提供了類似的功能。 如果你使用的是Javascript/Node.JS開發,使用session.message.sourceEvent.tenant.id 就可以知道當前消息來自于哪…

行業看點 | 英特爾成功開發超導量子計算芯片 推動產業加速發展

量子計算將會成為下一次技術革命的核心,你可能認為它還很遙遠,實際上量子計算會比預料的來得早。近期,英特爾在量子芯片方面取得突破,讓量子計算朝著現實前進了一大步。 繼IBM公司發布了自主量子處理器,谷歌著手研究基…

Teams App抽獎機器人 - 基礎架構

今天我們來聊一下,一個Teams app的infrastructure,我在考慮LuckyDraw的主要出于這么幾個出發點: 可管理性。因為這是一個個人產品,以后維護工作也只有我一個人,所以我希望整個infrastructure簡單、易管理,不…

Teams Bot的ServiceLevel測試

每一個Teams bot實際上就是一個web api服務,這個服務通過Bot Framework和Teams進行通訊,所以對于Teams app的測試就是對于一個api service的測試。 軟件行業發展到如今,測試技術已經趨于成熟。單元測試,冒煙測試,整合…

BZOJ1016:[JSOI2008]最小生成樹計數——題解

https://www.lydsy.com/JudgeOnline/problem.php?id1016 現在給出了一個簡單無向加權圖。你不滿足于求出這個圖的最小生成樹,而希望知道這個圖中有多少個不同的最小生成樹。(如果兩顆最小生成樹中至少有一條邊不同,則這兩個最小生成樹就是不…

如何做Teams Bot的測試覆蓋

在我昨天的文章中介紹了如果對Teams bot做service level的測試,那到底要寫多少的測試代碼才算夠?如何才算測試到位了?這個時候我們就需要用”測試覆蓋率”來衡量,雖然覆蓋率高并不一定代表著就可以高枕無憂的以為我們軟件質量高了…

Spring Boot開發MongoDB應用實踐

本文繼續上一篇定時任務中提到的郵件服務,簡單講解Spring Boot中如何使用MongoDB進行應用開發。 上文中提到的這個簡易郵件系統大致設計思路如下: 1、發送郵件支持同步和異步發送兩種 2、郵件使用MongDB進行持久化保存 3、異步發送,直接將郵件…

Teams Bot如何做全球化

Office365在全球有大量的用戶,可以說是擁有最多用戶的商業SaaS平臺。Teams最近在發展迅猛,有1300萬日活用戶,已經超越了Slack。? Microsoft Teams overtakes Slack with 13 million daily users 我在設計Teams LuckyDraw bot的時候就希望我…

QuickBI助你成為分析師-郵件定時推送

創建報表過程中經常需要將報表情況定時推送給其他用戶,及時了解數據情況。高級版本郵件推送功能支持儀表板周期性推送到訂閱人,默認以當前登錄者視角查看,同時支持結合 行級權限進行權限控制 和 結合全局參數功能確定郵件推送內容參數&#x…

2019年5月 Teams Community Call (China)

這個月有四個話題: Tony Xia:這個月的Teams的產品更新,Teams開發能力的更新,開源項目更新,庫更新王遠:升級/遷移到Microsoft Teams劉鈺:Teams賬號注冊探索指南Paul Zhang/Cheung:Bu…

修改oracle 管理員密碼 cmd

1.sqlplus/nolog 2.conn / as sysdba 3.alter user 用戶名 identified by 新密碼;轉載于:https://www.cnblogs.com/taoqidexiaomao/p/9006927.html

在2019年6月Teams Community Call上分享的Teams app基礎架構視頻

我在2019年6月Teams Community Call(China)上分享的如何在azure上搭建典型的teams bot的基礎架構 會議視頻: 15:00 - 33:00 Download Video

解決 spring-cloud-starter-zipkin 啟動錯誤

應用場景&#xff1a;Spring Boot 服務添加 Zipkin 依賴&#xff0c;進行服務調用的數據采集&#xff0c;然后進行 Zipkin-Server 服務調用追蹤顯示。 示例pom.xml配置&#xff1a; <parent><groupId>org.springframework.boot</groupId><artifactId>s…

什么是Microsoft Teams的App Studio

Teams的app studio很多用戶可能不知道&#xff0c;但是對于一個teams平臺的開發人員來說&#xff0c;這個是開發利器&#xff0c;利用這個工具你可以輕松的配置manifest文件&#xff0c;可以輕松的一站式創建teams app所需要的所有東西。而且你可以很方便的可視化配置adaptive …

Spring Cloud-鴻鵠Cloud分布式微服務云系統—架構圖

這邊結合了當前大部分企業的通用需求&#xff0c;包括技術的選型比較嚴格、苛刻&#xff0c;不僅要用業界最流行的技術&#xff0c;還要和國際接軌&#xff0c;在未來的5~10年內不能out。作為公司的架構師&#xff0c;也要有一種放眼世界的眼光&#xff0c;不僅要給公司做好的技…

Teams bot的調用限制

上個月Teams團隊發布了對Teams app/bot調用api的頻率的限制。這也從側面說明Teams app越來越多&#xff0c;Teams團隊需要優先保證Teams本身的計算資源&#xff0c;來提供流暢的用戶體驗。 具體的每個限制指標在這里&#xff1a; https://docs.microsoft.com/en-us/microsoftt…

Array的sort方法

作為一個剛開始學習的前端&#xff0c;小結一下&#xff1a;sort方法&#xff1a; 如果調用該方法時沒有使用參數&#xff0c;將按字母順序對數組中的元素進行排序&#xff0c;說得更精確點&#xff0c;是按照字符編碼的順序進行排序。要實現這一點&#xff0c;首先應把數組的元…