ES5-6 作用域、作用域鏈、預編譯、閉包基礎

1. 作用域

  • 上一級在執行時,內部函數被定義,內部函數便生成作用域和作用域鏈(拿上一級的環境),內部函數執行前生成自己的AO,并排在頭部
  • 函數執行結束時,AO被銷毀(回到被定義時的狀態)
  • 上一級函數銷毀時,AO被銷毀(其中含內部函數,和其作用域)
  • 作用域鏈里存的是AO、GO的引用
    在這里插入圖片描述
  • 每個函數在被定義時,就包含了全局上下文GO,即使這時函數還沒被執行
    在這里插入圖片描述
  • a函數在被執行的前一刻,做預編譯

在這里插入圖片描述

  • b函數被定義時,它的作用域鏈和a函數是一樣的(同理a函數被定義時,a的作用域鏈是GO)
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述

2. 閉包

  • 閉包的定義:閉包是指有權訪問另一個函數作用域中的變量的函數(并不是只有函數內返回函數的情況才是閉包
  • 一個函數和對其周圍狀態(lexical environment,詞法環境)的引用捆綁在一起(或者說函數被引用包圍),這樣的組合就是閉包(closure)。也就是說,閉包讓你可以在一個內層函數中訪問到其外層函數的作用域。在 JavaScript 中,每當創建一個函數,閉包就會在函數創建的同時被創建出來。
function init() {var name = "Mozilla"; // name 是一個被 init 創建的局部變量function displayName() { // displayName() 是內部函數,一個閉包alert(name); // 使用了父函數中聲明的變量}displayName();
}
init();
  • 閉包拉扯著父級函數的AO不釋放,閉包的函數運行在哪個環境,這個環境就能訪問到被拉扯著的AO
    在這里插入圖片描述

在這里插入圖片描述
在這里插入圖片描述

  • test2被放到了全局,無法跟著test1銷毀
    在這里插入圖片描述
    在這里插入圖片描述

  • 內存泄漏:內存越來越少
    在這里插入圖片描述

  • 閉包可以做數據緩存
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述

  • 閉包:也就是內部能拉扯外部AO的函數,能在全局被訪問,那么直接把它添加到全局,也能有一樣的效果
    在這里插入圖片描述
    在這里插入圖片描述
    在這里插入圖片描述

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

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

相關文章

electron 項目的搭建方式,借助 node 和 npm

1,首先確定安裝了 node 和 npm 2,創建一個文件夾,如 aa 3,CMD 命令進入到 aa,用 npm 命令初始化一個項目 4, npm -init 根據提示完成配置 5,安裝 electron > npm i -D electronlatest, 這一…

zbb20171215 git 版本回退

1. 使用git log命令查看所有的歷史版本,獲取某個歷史版本的id,假設查到歷史版本的id是139dcfaa558e3276b30b6b2e5cbbb9c00bbdca96。 2. git reset --hard 139dcfaa558e3276b30b6b2e5cbbb9c00bbdca96 3. 把修改推到遠程服務器 git push -f -u origin ma…

ES5-7 立即執行函數、閉包深入、逗號運算符

1. 立即執行函數 定義在全局的函數只有關閉瀏覽器或者退出程序才會釋放IIFE: Immediately-Invoked Function Expression解決頁面加載自動執行,執行完成后立即釋放(避免了只會執行一次的內容一直存在于全局)IIFE用匿名函數或者函數聲明&#…

es6 --- 解構賦值的簡潔性

設想你有一個工具foo,它可以異步產生兩個值(x和y): function getY(x) {return new Promise( function(resolve, reject) {setTimeout( function() {resolve( (3*x) -1 );}, 100);}); }function foo(bar, baz) {var x bar * baz;return getY(x).then( function(y){return [x, …

redis安裝(linux)

一、redis安裝步驟 1、yum install gcc 如果你機器已經安裝了編譯環境請忽略,否則在使用make編譯源碼時會報錯。 報錯信息:make: *** [adlist.o] 2、使用wget命令下載包  wget http://download.redis.io/releases/redis-4.0.6.tar.gz 3、解壓tar包 tar…

驗證碼何時可以退出歷史舞臺?

驗證碼是有必要存在的,只是不同階段表現形式不同,未來的趨勢是更加智能無感知,用戶體驗更好。 簡而言之, 驗證碼其終極目的,就是區分正常人和機器的操作。區分人機行為是必要的:互聯網上各種行為&#xff0…

ES5-8 閉包高級、對象、構造函數、實例化

1. 對象 對象內定義的函數一般稱之為方法,在外部的函數聲明稱為函數對象刪除屬性使用delete 關鍵字 var obj {a: 1,b: string } console.log(obj, obj) // {a: 1, b: "string"} delete obj.b console.log(obj, obj) // {a: 1}在對象里,this…

es6 --- 使用生成器交替執行

考慮以下場景: var a 1; var b 2;function foo(){a;b b * a;a b 3; }function bar(){b--;a 8 b;b a * 2; }foo(); bar(); console.log(a, b); // 11 22bar(); foo(); console.log(a, b); // 183 180對于上面的兩個函數foo和bar,它們中的任何一個,一旦開始了就會…

oracle-group by -having

1、GROUP BY 語句用于結合合計函數,根據一個或多個列對結果集進行分組。(也就是說group by 和聚合函數結合起來使用,要查詢的結果來沒有聚合函數則報錯:不是group by 表達式) a、where 不能放在group by 后面使用 b、having 要和group by 連在…

【轉載】匯編速查手冊

一、數據傳輸指令 ─────────────────────────────────────── 它們在存貯器和寄存器、寄存器和輸入輸出端口之間傳送數據. 1. 通用數據傳送指令. MOV 傳送字或字節. MOVSX 先符號擴展,再傳送. MOVZX 先零擴展,再傳送. PUSH 把字壓…

ES5-9 【utils】構造函數及實例化原理、包裝類

1. 構造函數 調用構造函數實際會經歷4步 1 創建一個新對象 2 將構造函數的作用域賦值給對象(因此this就指向了這個對象) 3 執行構造函數中的代碼(為這個新對象添加屬性) 4 返回新對象 在構造函數內部,this指向構造函數…

es6 --- 異步迭代生成器 Promise

看一個經典ajax回調的例子: function foo(x, y, cb) {ajax("http://some.url.1/?x" x "&y" y,cb); }foo(11, 31, function(err, text) {if(err) {console.error(err);}else {console.log(text);} });// 異步請求some.url.1參數為x 11, y31的數據.…

Mysql5.7.20使用group by查詢(select *)時出現錯誤--修改sql mode

使用select * from 表 group by 字段 時報錯錯誤信息說明: 1055 - Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggregated column haha_db.staff.id which is not    functionally dependent on columns in GROUP BY clause; this…

【心情隨筆】03

一、 越是學習越是感到自己的無知。以往總有不求甚解的做法,稍微看了一下就囫圇吞棗算懂了,其實這是逃避,不僅面試問的時候答不上來,而且內部可以用來擴展的思想也沒有領悟到。連該問題都說不清楚更不要說舉一反三了。近來&#x…

ES5-10 原型、原型鏈、閉包立即執行函數、插件開發

重學第六章 1. 原型 實例內屬性和原型上屬性重名時(屏蔽) function Test(name) {this.name name } Test.prototype.name hhh let tObj new Test(yyy) console.log(tObj.name) // yyy tObj.name null console.log(tObj.name) // null delete tObj.…

javascript --- 使用run函數,讓100條ajax依次執行

使用如下: function *foo(len,urlArray) {let r [];for(let i 0; i< len; i){r[i] yield request(urlArray[i]);} } // len:是長度,urlArray,是請求的url數組..下面附上run函數的代碼,以及證明以上是成立的 // Benjamin Gruenbaum(benjamingr on Github) function run(g…

[轉]IIS 允許/禁止 目錄瀏覽

<?xml version"1.0" encoding"utf-8"?> <configuration><system.webServer><directoryBrowse enabled"true" /></system.webServer> </configuration> enabled true -> 允許目錄瀏覽&#xff0c;子目…

C++編程基礎一 06-布爾類型

1 // 06-布爾類型.cpp: 定義控制臺應用程序的入口點。2 //3 4 #include "stdafx.h"5 #include <iostream>6 using namespace std;7 8 int main()9 { 10 bool a true; //真 存在的 非零 1 11 bool b false;//假 不存在 零 0 12 cout << …

性能優化雜記

webpack 開發、生產環境配置不同的webpack配置文件 生產環境刪除devServer&#xff08;不需要啟webpack devServer&#xff09; 告訴webpack&#xff0c;生產、開發分別要對應哪個配置文件 開發環境下也能看到打包的結果 npm run dev:build npm run dev 只會把打包生產…

算法 --- 冒泡排序、選擇排序、插入排序的js實現

冒泡排序: function bubbleSort(arr){let i arr.length;while(i >0){for(let j 0; j< i; j) {let pos 0;if(arr[j] > arr[j1]) {pos j;let temp arr[j];arr[j] arr[j1];arr[j1] temp;}}i pos;}return arr; } var arr [3,44,38,5,47,15,36,26,27,2,46,4,19,5…