文 / 景朝霞
來源公號 / 朝霞的光影筆記
ID / zhaoxiajingjing
圖 / 自己畫
????點(diǎn)個贊，讓我知道你來過~????
前情提要：
0 / 看圖說話
var n = 1;
function fn(){
var n = 2;
function f(){
n--;
console.log(n);
}
f();
return f;
}
var x = fn();
x();
console.log(n);
公號ID：zhaoxiajingjing
△ 畫簡版的碴里，不用的會出棧銷毀
創(chuàng)建函數(shù)
- 開辟一個堆內(nèi)存
- 把函數(shù)體中的代碼以字符串格式存到堆內(nèi)存中
- 把堆內(nèi)存的地址賦值給函數(shù)名/變量名
-
函數(shù)在哪創(chuàng)建的哀托，在執(zhí)行時需要查找的上級作用域就是誰缺脉。即：
FN[scope]:VO(G) F[scope]:AO(FN)
函數(shù)執(zhí)行
- 開一個全新的棧內(nèi)存：執(zhí)行上下文EC(xx)痪欲，會形成一個全新的私有作用域AO(xx)
- 形參賦值悦穿，變量提升（形參和在私有作用域中聲明的變量：私有變量）
- 代碼執(zhí)行攻礼，把堆內(nèi)存的代碼字符串一行行拿出來運(yùn)行
-
遇到變量：作用域鏈查找機(jī)制，找到它栗柒。
- 看它是否為自己當(dāng)前執(zhí)行上下文/私有作用域下的私有變量
- 是私有的礁扮，拿來用即可
- 不是自己私有的，沿著
scopeChain作用域鏈向上級作用域查找瞬沦。 - 上級作用域太伊，如果有該變量，拿來用逛钻；如果沒有該變量僚焦，再沿著作用域鏈向上級作用域查找
- 一直找到全局作用域?yàn)橹?/li>
- <u>私有變量和外界的變量沒有必然關(guān)系，可以理解為被私有棧內(nèi)存保護(hù)起來了曙痘，這種機(jī)制就是
閉包保護(hù)機(jī)制</u>
其中芳悲，EC(FN) 執(zhí)行上下文在執(zhí)行完后，返回了一個小函數(shù)f边坤，外面的x接收了小函數(shù)f的地址名扛。那么，EC(FN)執(zhí)行上下文/私有作用域中有東西被外界占用了茧痒，所以不會被銷毀肮韧。
1 / 閉包
來~再念一遍：
<u>函數(shù)執(zhí)行會形成一個全新的私有作用域，保護(hù)里面的變量不受外界干擾，這種保護(hù)機(jī)制就稱為閉包弄企。</u>
但是超燃，我們經(jīng)常聽到這樣說的：
函數(shù)執(zhí)行會形成一個私有作用域，而這個棧內(nèi)存不銷毀拘领，這樣里面的私有變量與外面的不沖突淋纲，并且能保存這些值，叫做閉包院究。
這種說法呢洽瞬，只把不銷毀而留下來的稱為閉包。
但业汰，我理解的是當(dāng)它形成了就已經(jīng)是閉包了伙窃，這兩種說法都OK，看個人理解認(rèn)為哪種都OK样漆。
閉包有兩個作用：保護(hù)为障、保存
- 保護(hù)：保護(hù)私有變量不讓外界干擾，與外界沒有必然聯(lián)系
- 保存：形成一個不銷毀的私有作用域放祟，私有棧內(nèi)存里面的東西會保存下來鳍怨；以后它里面的東西還能被調(diào)用到
2 / 練習(xí)題
請畫圖理解：作用域鏈查找機(jī)制、閉包機(jī)制跪妥。像上圖畫簡單的即可鞋喇。
- 輸出結(jié)果是？fn函數(shù)執(zhí)行完后是否會銷毀眉撵？
console.log(a, b);
var a = 12,
b = 12;
function fn(){
console.log(a, b);
var a = b = 13;
console.log(a, b);
}
fn();
console.log(a, b);
注意：
var a = 12,
b = 12;
// 等價于
var a = 12;
var b = 12;
var a = b = 1;
// 等價于
var a = 1;
b =1;
- 輸出結(jié)果是什么侦香？哪些執(zhí)行完后不會銷毀？為什么纽疟？
var i = 20;
function fn(){
i -= 2;
return function (n) {
console.log(++i-n):
};
}
var f = fn();
f(1);
f(2);
fn()(3);
fn()(4);
f(5);
console.log(i);
- 輸出結(jié)果是罐韩？
var i = 0;
function A(){
var i = 10;
function x(){
console.log(x);
}
return x;
}
var y = A();
y();
function B(){
var i = 20;
y();
}
B();
3 / 預(yù)告
如何判斷THIS？
△ 文章首發(fā)污朽，ID ：zhaoxiajingjing
