美文网首页
5分钟入门闭包

5分钟入门闭包

作者: 佳勋学长 | 来源:发表于2017-07-14 17:14 被阅读0次

理解闭包前先要理解两个概念:作用域和作用域链。
一、作用域分为:

  1. 全局作用域

  2. 函数作用域

     var a = 100
     function fn() {
       var a = 200
       console.log('local: ' + a)
     }
     fn() // local: 200
     console.log('global: ' + a) // glocal: 100
    

执行上面的代码可以看到,第一个a是定义在全局作用域里的,第二个a是定义在函数作用域里的。在全局作用域的变量a和在函数作用域变量a互不影响。
注意:没有块级作用域。

二、作用域链

var a = 100
function f1() {
  var b = 200
  function f2() {
    var c = 300
    console.log(a)
    console.log(b)
    console.log(c)
  }
  f2()
}
f1() // 100 200 300

执行以上代码,依次打印出a, b, c的值100,200,300。其中a是定义在全局作用域里,b是定义在函数f1作用域里,c是定义在函数f2作用域里。

当代码执行到函数f2里的console.log(a)的时候,首先会在函数f2的作用域找,没有 --> 到父级作用域即函数f1的作用域里面找,也没有 --> 再到父级作用域即全局作用域里面找,有,打印。

同理当console.log(b)的时候首先会在函数f2的作用域找,没有 --> 到父级作用域即函数f1的作用域里面找,有,打印。

这三个作用域组成的有序集合(f2 -- f1 -- window)就是作用域链。

注意:函数的父级作用域指的是函数定义时候的决定的,而不是执行的时候。即函数在什么地方定义,父级作用域就在哪里。

三、闭包
闭包有两种应用场景:

  1. 函数作为返回值

     function fn() {
       var a = 100
       return function() {
         console.log(a)
       }
     }
     var f1 = fn()
     var a = 200
     f1() // 100
    

fn返回一个函数,赋值给f1,执行f1()即执行fn的返回函数。返回函数在定义时的父级作用域是fn,因此返回函数里的变量a会到函数fn的作用域去找,而与函数f1执行时定义的全局作用域里的变量a无关。

  1. 函数作为参数传递

     function f1() {
       var a = 100
       return function() {
         console.log(a)
       }
     }
     var fn = f1()
     function f2(f) {
       var a = 200
       f()
     }
     f2(fn)  // 100
    

函数f2接收一个函数作为变量传入,执行函数f即执行函数f1,剩下的代码执行过程和场景1同理。

总结:闭包的特性让我们可以在函数作用域之外,通过作用域链访问到函数作用域内的变量,但是无法对其进行修改。

相关文章

  • Python 入门之 闭包

    Python 入门之 闭包 1、闭包 (1)在嵌套函数内使用(非本层变量)和非全局变量就是闭包 (2)_ clos...

  • JS闭包入门

    最近有看到朋友的面经里提到的JS闭包的问题,就想研究研究,以下是我对JS闭包的简单理解。 到底什么是JS闭包? 定...

  • 前端推荐

    JSDoc 有助于代码可读性参考 正则 正则表达式入门参考 什么是闭包及闭包的优缺点 参考 javascript中...

  • 9 闭包——《Swift3.0从入门到出家》

    9 闭包——《Swift3.0从入门到出家》 闭包 Swift语言中可以使用一块独立代码块替代函数的定义,称独立的...

  • swift-闭包

    闭包 闭包定义 闭包简化 - 尾随闭包 闭包参数 闭包返回值 闭包的循环引用

  • Python的自定义超时机制——装饰器的妙用

    装饰器 关于装饰器的入门,可以参考这篇文章:12步轻松搞定python装饰器简单来说,装饰器其实就是一个闭包(闭包...

  • 闭包,闭包,闭包

    1、这家伙到底是什么? 网上关于这个的讨论的太多了太多了,有各种的举例子,但是大部分还在寻找这个答案的小伙伴对于变...

  • 闭包-Closures [swift 5.1]

    闭包的语法 尾随闭包 闭包逃离 自动闭包

  • Day7 闭包(Closures)

    本页包含内容:• 闭包表达式• 尾随闭包• 值捕获• 闭包是引用类型• 逃逸闭包• 自动闭包 1、闭包表达式 闭包...

  • Python闭包

    闭包 = 环境变量 + 函数 调用闭包内部的环境变量 闭包的经典误区 闭包与非闭包实现人类走路 非闭包 闭包

网友评论

      本文标题:5分钟入门闭包

      本文链接:https://www.haomeiwen.com/subject/ksanhxtx.html