成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

一篇文章搞懂閉包。

tinyq / 1787人閱讀

摘要：如果非要用一句話定義閉包我更加認(rèn)同你不知道的作者的一句話當(dāng)函數(shù)可以記住并訪問(wèn)所在的詞法作用域時(shí)，就產(chǎn)生了閉包。所以本文將會(huì)從閉包的應(yīng)用場(chǎng)景入手，來(lái)印證的這句話?？偨Y(jié)閉包的應(yīng)用場(chǎng)景還有很多，可以說(shuō)是隨處可見(jiàn)了。

直接進(jìn)入主題，閉包是什么？

閉包是寫(xiě)代碼過(guò)程產(chǎn)生的一種自然結(jié)果，而不是一種概念。

相比于一些概念性的解釋?zhuān)匾氖鞘煜に膽?yīng)用場(chǎng)景、及常見(jiàn)寫(xiě)法。

如果非要用一句話定義閉包：
我更加認(rèn)同《你不知道的javaScript》作者的一句話：當(dāng)函數(shù)可以記住并訪問(wèn)所在的詞法作用域時(shí)，就產(chǎn)生了閉包。

所以本文將會(huì)從閉包的應(yīng)用場(chǎng)景入手，來(lái)印證kyle simpson的這句話。

列舉兩個(gè)常見(jiàn)應(yīng)用場(chǎng)景

場(chǎng)景一：封裝函數(shù)的私有屬性和方法

//local變量是foo函數(shù)的私有屬性，只能通過(guò)bar函數(shù)來(lái)訪問(wèn)。
function foo() {
  const local = 1
  function bar() {
    return local
  }
  return bar
}
let bar = foo()
console.log(bar()) // 1

bar函數(shù)記住了foo函數(shù)的詞法作用域，導(dǎo)致foo函數(shù)運(yùn)行完后并不會(huì)被垃圾回收，我們可以通過(guò)bar函數(shù)盡情地訪問(wèn)foo函數(shù)的作用域。

場(chǎng)景二：給10個(gè)li添加點(diǎn)擊事件

// 錯(cuò)誤寫(xiě)法：
function bindEvent() {
  var li = document.querySelectorAll("li")
  for(var i = 0; i < 10; i++) {
    li[i].addEventListener("click", function bar(){
      console.log(i)
    })
  }
}
bindEvent() //無(wú)論點(diǎn)擊哪個(gè)li，都會(huì)打印出10

錯(cuò)誤的原因很明顯，10個(gè)bar函數(shù)中的i訪問(wèn)的都是同一個(gè)i，這個(gè)i屬于foo函數(shù)。

// 正確寫(xiě)法:
function bindEvent() {
  var li = document.querySelectorAll("li")
  for(var i = 0; i < 10; i++) {
    li[i].addEventListener("click", (function foo(j){
      return bar() {
        console.log(j)
      }
    }))(i)
  }
}
bindEvent()

bar函數(shù)記住了foo函數(shù)的詞法作用域,foo函數(shù)為每個(gè)bar函數(shù)選好了屬于它自己的i，等著bar去訪問(wèn)就好啦。

總結(jié)：

閉包的應(yīng)用場(chǎng)景還有很多，可以說(shuō)是隨處可見(jiàn)了。
理解它的核心思想：函數(shù)可以記住并訪問(wèn)所在的詞法作用域，才可以根據(jù)你自己的意愿來(lái)識(shí)別、擁抱和影響閉包的思維環(huán)境。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/99944.html

相關(guān)文章

  • 搞懂閉包

    摘要：此時(shí)閉包函數(shù)的作用域鏈得以保存，不會(huì)被垃圾回收機(jī)制所回收。執(zhí)行執(zhí)行完畢，返回總結(jié)閉包的原理，就是把閉包函數(shù)的作用域鏈保存了下來(lái)。 原文：搞懂閉包 | AlloyTeam作者：TAT.yaoyao 閉包這個(gè)概念是前端工程師必須要深刻理解的，但是網(wǎng)上確實(shí)有一些文章會(huì)讓初學(xué)者覺(jué)得晦澀難懂，而且閉包的文章描述不一。 本文面向初級(jí)的程序員，聊一聊我對(duì)閉包的理解。當(dāng)然如果你看到閉包聯(lián)想不到作用域鏈...

    masturbator 評(píng)論0 收藏0

  • 搞懂JavaScript引擎運(yùn)行原理

    摘要：同步一次執(zhí)行一件事，同步引擎一次只執(zhí)行一行，是同步的。調(diào)用函數(shù)將其推入堆棧并從函數(shù)返回將其彈出堆棧。執(zhí)行上下文當(dāng)函數(shù)放入到調(diào)用堆棧時(shí)由創(chuàng)建的環(huán)境。執(zhí)行結(jié)果它會(huì)立即被推到回調(diào)隊(duì)列，但它仍然會(huì)等待調(diào)用堆棧為空才會(huì)執(zhí)行。 為了保證可讀性，本文采用意譯而非直譯。 想閱讀更多優(yōu)質(zhì)文章請(qǐng)猛戳GitHub博客,一年百來(lái)篇優(yōu)質(zhì)文章等著你！ 一些名詞 JS引擎 — 一個(gè)讀取代碼并運(yùn)行的引擎，沒(méi)有單一的J...

    lastSeries 評(píng)論0 收藏0

  • 作用域閉包，你真的懂了嗎？

    摘要：曾幾何時(shí)，閉包好像就是一個(gè)十分難以捉摸透的東西，看了很多文章，對(duì)閉包都各有說(shuō)法，以致讓我十分暈，什么內(nèi)部變量外部變量的，而且大多數(shù)都只描述一個(gè)過(guò)程，沒(méi)有給閉包的定義，最后，舉幾個(gè)例子，告訴你這就是閉包。 曾幾何時(shí)，閉包好像就是一個(gè)十分難以捉摸透的東西，看了很多文章，對(duì)閉包都各有說(shuō)法，以致讓我十分暈，什么內(nèi)部變量、外部變量的，而且大多數(shù)都只描述一個(gè)過(guò)程，沒(méi)有給閉包的定義，最后，舉幾個(gè)例子...

    yangrd 評(píng)論0 收藏0

  • vue.js源碼 - 剖析observer,dep,watch三者關(guān)系 如何具體的實(shí)現(xiàn)數(shù)據(jù)雙向綁定

    摘要：雙向數(shù)據(jù)綁定的核心和基礎(chǔ)是其內(nèi)部真正參與數(shù)據(jù)雙向綁定流程的主要有和基于和發(fā)布者訂閱者模式，最終實(shí)現(xiàn)數(shù)據(jù)的雙向綁定。在這里把雙向數(shù)據(jù)綁定分為兩個(gè)流程收集依賴(lài)流程依賴(lài)收集會(huì)經(jīng)過(guò)以上流程，最終數(shù)組中存放列表，數(shù)組中存放列表。 Vue雙向數(shù)據(jù)綁定的核心和基礎(chǔ)api是Object.defineProperty,其內(nèi)部真正參與數(shù)據(jù)雙向綁定流程的主要有Obderver、Dep和Watcher,基于d...

    mo0n1andin 評(píng)論0 收藏0

  • 前端基礎(chǔ)進(jìn)階（四）：詳細(xì)圖解作用域鏈與閉包

    摘要：之前一篇文章我們?cè)敿?xì)說(shuō)明了變量對(duì)象，而這里，我們將詳細(xì)說(shuō)明作用域鏈。而的作用域鏈，則同時(shí)包含了這三個(gè)變量對(duì)象，所以的執(zhí)行上下文可如下表示。下圖展示了閉包的作用域鏈。其中為當(dāng)前的函數(shù)調(diào)用棧，為當(dāng)前正在被執(zhí)行的函數(shù)的作用域鏈，為當(dāng)前的局部變量。 showImg(https://segmentfault.com/img/remote/1460000008329355);初學(xué)JavaScrip...

    aikin 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<