閉包原理及題型

閉包

函數被調用以後,會建立一個執行環境及做用域鏈.函數被執行完以後就會被釋放掉.
閉包函數執行以後會保留當前活動變量在內部函數做用域鏈中,因此內部函數能夠訪問外部變量.

// 閉包
function test() {
    let b = "b";
    return () => b;
}
let t = test()
console.log(t())  // 訪問內部變量

示例一

打印出的結果是多少?

function test() {
    var n = 4;
    function add() {
        n++;
        console.log(n);
    }
    return { n: n, add: add };
}
var result = test(); // 返加一個對象 
var result2 = test();  // 同上
result.add();  // 調用閉包函數,訪問內部變量. 輸出 5
result.add(); //  輸出 6
console.log(result.n); // 4
result2.add(); // 5

示例二

打印出的結果是什麼?

function test() {
    var arr = [];
    for (var i = 0; i < 10; i++) {
        arr[i] = function() {
            console.log(i); // 輸出 10
        };
    }
    return arr;
}
var myArr = test();
for (var j = 0; j < 10; j++) {
    myArr[j]();
}

var聲明的變量只有函數做用域與全局做用域,這循環中建立的i變量,會變量提高在函數頂部,因此函數打印i變量的值是10

示例三

打印出的結果是什麼?

function test() {
    var arr = [];
    for (let i = 0; i < 10; i++) { // let
        arr[i] = function() {
            console.log(i);
        };
    }
    return arr;
}
let myArr = test();
for (let j = 0; j < 10; j++) {
    myArr[j](); // 輸出 0 到 9
}

let 聲明的變量具備塊級做用域,每輪循環i變量,其時都是一個新的i變量,因此myArr數組中存儲了不一樣的數字

示例四

打印結果是多少?

for (var i = 0; i < 10; i++) {
    (j => {
        setTimeout(function() {
            console.log(j);// 0 ~ 9
        }, 1000);
    })(i); // 當即執行函數 傳參
}

這只是建立並執行了10個函數,每一個函數都傳遞了個i變量給參數給j,j存儲了變量值,而後作爲打印輸出了,因此結果爲0~9

我的博客地址 : https://www.zhuamimi.cn
文章地址 : https://www.zhuamimi.cn/archives/208