JavaScript学习-闭包(函数的嵌套)

这是我参与11月更文挑战的第10天，活动详情查看：2021最后一次更文挑战

前面文章学习了JavaScript 中几个并不完美但是不影响其运行的一些神奇小"bug":

上一篇写到 函数的可选参数, 本篇继续学习 JavaScript 函数的 闭包

JavaScript 函数-闭包

我们简单理解的闭包就是 函数嵌套函数, 但是这样理解远远不够, 闭包牵连的知识点还是挺多的:

闭包概念

先来看一下 "百度百科" 对闭包的概念的描述: "闭包就是能够读取其他函数内部变量的 函数(就是这个函数)。"

这里说的读取其他函数内部的变量, 我的大白话理解就是: 这个函数B-闭包 是在一个 函数A 内部, 而 函数A内定义有一个变量 variable, 这样 函数B-闭包可以获取到这个 variable变量的值. 闭包让你可以在一个内层函数中访问到其外层函数的作用域. 下面看下 MDN-closure | 闭包:

MDN | 一个函数和对其周围状态（lexical environment，词法环境）的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包（closure）。

在 JavaScript 中，每当创建一个函数， 闭包就会在函数创建的同时被创建出来。

这是什么意思呢? 为何创建一个函数, 也同时创建一个闭包呢? 看下代码来的实现:

(中文代码编程风格:--)

function 函数A() {
  // variable 是一个被 函数A 创建的局部变量
  var variable = '函数A内部的变量,在函数B外面' 
  function 函数B() {
    // 函数B() 是 函数A 的内部函数， 这就是一个闭包
    alert(variable) // 使用了父函数中声明的变量
  }
  函数B()
}
函数A()

理解闭包, 就需要理解嵌套函数的词法作用域:

// 注意区分 两个变量的位置

let scope = 'global scope'     // 全局变量

function checkScope(){
  let scope = 'inner scope'    // 内部变量(局部变量)
  function fn(){
    return scope               // 通过闭包 函数返回当前作用域中的值
  }
  return fn()
}

checkScope() // 这里返回内部的 "inner scope"

思考题: 通过上面的慢慢思考一下该怎么理解闭包

下文更新对闭包理解的延伸学习

闭包很有用的, 在实际工作中可能我们不知觉就用到了:

比如在开发中经常用到的, 就是把外部的this值赋值给闭包将要用到继承的变量: 让嵌套函数能够访问外部的 this 值(是不是很常见)

const self = this;

ps: 其实创建一个函数就创建了闭包...

• 递归: 函数调用自己
• 高阶函数: 一个函数将其他函数作为参数 或者 返回其他函数来进行操作
• ..