1. 程式人生 > >JS閉包詳解

JS閉包詳解

一.函式和作用域 自定義函式

XXX()
function XXX( ) {
}
// 呼叫函式,放在哪個位置都可以
// 如果是獲取元素,元素必須放在上面
var fn = function () {
}
fn()  // 必須放在宣告的後面
這種用var宣告的函式呼叫必須放在宣告的後面

函式變數的作用域 全域性變數和區域性變數區域性變數在函式內部使用 全域性變數在函式外部宣告的變數,可以在函式中使用 區域性變數是受保護的,不能隨意受外部使用 如果我們想在外面使用區域性變數,要怎麼辦呢 閉包 什麼叫閉包 所謂閉包,是指語法域位於某個特定的區域,具有持續參照位於該區域自身範圍之外的執行域上的非永續性比變數值能力的段落,在這些外部執行與的非永續性變數神奇的保留他們在閉包最初定義時的值 白話: 我們可以用一個函式去訪問另外一個函式的內部變數 這裡寫圖片描述

閉包常用寫法: 這裡寫圖片描述

閉包的優缺點 優點:不產生全域性變數,實現屬性私有化 缺點:閉包的資料會常駐記憶體,在不用的時候要刪掉否則會導致記憶體溢位

進階:閉包的函式傳參 這裡寫圖片描述

結果: undefined 6

閉包如何用呢? 這裡寫圖片描述 這裡寫圖片描述 函式立即執行 不用函式名就可以了 這裡寫圖片描述 閉包版的tab欄切換 這裡寫圖片描述

關於閉包的深度思考 前面有封裝過一些函式,也是有返回值,是這樣的

 (語法:Vue專案中封裝的方法) 
    // 判斷驗證碼是否輸入準確
    checkCode () {
      let vcode = this.loginInfo.vcode
      vcode = vcode.toUpperCase()
      let
ccode = this.ccode ccode = ccode.toUpperCase() if (vcode !== ccode) { return 0 } else { return 1 } }, // 使用的話這個樣子 let codestatus = this.checkCode()

呼叫這個函式,返回的是0和1 閉包也是返回值,這樣看起來閉包到是有些多餘了? 慢慢的看了一些閉包的用法,我明白了閉包的用處 不用閉包,可能我們返回的是一個數值,但是使用閉包返回的確實一個函式,一個函式體,這時在很多時候像有各種觸發事件就可以直接呼叫閉包函式。這時,如果用我們封裝的普通函式,返回的只是值,而閉包返回的是函式體啊

閉包節流 這裡寫圖片描述