前言

了解hoisting、scope chain對於closure的幫助會非常大,因為這三個是環環相扣。

• 讓變數留在內層
• 保留指向的功能,也就是一直往下參考(reference)
• 避免命名衝突覆蓋資料

function closure(x) {
  function multiple() {
    return x * 2 
  }
  return multiple()
}
const result = closure(100)
console.log(result) //200

可以看到我們透過return 指向multiply,而multiple讀取了closure的區域變數。

以上我們也可以使用另一種寫法

function closure(x) {
  return function () {
    return x * 2 
  }
}
const result = closure(100)
console.log(result()) //200

function minus(x) {
  let value = x
  return function() {
    return value + value
  }
}
const a = minus(100)
console.log(a()) //200

看完是不是覺得當我們了解前面的作用域概念,其實閉包就迎刃而解了呢!!!

當然也有上面提到的避免function覆蓋

function minus(x) {
  let value = x
  return function plus() {
    return value + value
  }
}
function plus() {
  console.log('hello')
}

const a = minus(100)
console.log(a()) //200

plus() //hello

最後總結

• 最低曝露原則
• 避免未宣告就使用變數
• 讓複雜的操作留在function內,並且回傳最終數值即可
• 內層往外讀取數值

明天我們會進入CallBack,這是JavaScript中最重要的一個章節。

剛好今日身體已經恢復差不多,也希望各位要保重身體!!!