第五章 精通函数:闭包和作用域 | 《JavaScript忍者秘籍》学习笔记

134 阅读1分钟

《JavaScript忍者秘籍(第二版)》学习笔记

5.2 使用闭包

5.2.1 封装私有变量

function Person() {
  let coins = 0;
  this.getCoins = function() { // 称为getter方法
    return coins
  }
  this.addCoin = function() {
    coins++
  }
}

let Debra = new Person()

console.log(Debra.coins) // 无法直接访问
Debra.addCoin()
console.log(Debra.getCoins()) // 1

const Patamo = new Person()
console.log(Patamo.getCoins()) // 0 - 拥有独立的变量

5.2.2 回调函数

function count(id, initTick = 0) {
  let timer = setInterval(() => {
    if (initTick < 10) {
      initTick++
      console.log(`No. ${id} ticker run: ${initTick}`)
    } else {
      clearInterval(timer)
      console.log(initTick === 10 && `No. ${id} tick end`)
    }
  }, 100)
}

count('0001')
count('0002', 2)
count('0003', 5)
count('0004', 7)
count('0005', 8)

// 独立运行 互不影响

5.3 通过执行上下文来跟踪代码

image.png

image.png

5.4 使用词法环境跟踪变量的作用域

const ninja = 'Hattori'
console.log(ninja)

当console.log语句访问ninja变量时,会进行词法环境的查询。

💡 词法环境是JavaScript作用域的内部实现机制,人们通常称为作用域(scopes)。

小结

闭包允许函数:访问函数创建时所在的作用域内的变量

闭包是消耗内存成本,因为闭包始终保持创建时锁在的作用域内的变量

image.png