JavaScript闭包函数

JavaScript闭包函数JavaScript闭包函数1概述2词法作用域3闭包1概述一个函数和对其周围状态(词法环境)的引用捆绑在一起(或者说函数被引用包围),这样的组合就是闭包(closure)。也就是说,闭包让你可以在一个内层函数中访问到其外层函数的作用域。在JavaScript中,每当创建一个函数,闭包就会在函数创建的同时被创建出来。2词法作用域请看这段代码:functioninit(){varname=”Mozilla”;//name是一个被init创建的局部变量

大家好,又见面了,我是你们的朋友全栈君。

1 概述

一个函数和对其周围状态(词法环境)的引用捆绑在一起(或者说函数被引用包围),这样的组合就是闭包(closure)。也就是说,闭包让你可以在一个内层函数中访问到其外层函数的作用域。

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

2 词法作用域

请看这段代码:

function init() { 
   
    var name = "Mozilla"; // name 是一个被 init 创建的局部变量
    function displayName() { 
    // displayName() 是内部函数,一个闭包
        console.log(name); // 使用了父函数中声明的变量
    }
    displayName();
}
init();

结果是:Mozilla

init() 创建了一个局部变量 name 和一个名为 displayName() 的函数。displayName() 是定义在 init() 里的内部函数,并且仅在 init() 函数体内可用。displayName() 没有自己的局部变量,然而,因为它可以访问到外部函数的变量,所以 displayName() 可以使用父函数 init() 中声明的变量 name 。

运行该代码后发现, displayName() 函数内的 console.log() 语句成功显示出了变量 name 的值(该变量在其父函数中声明)。这个词法作用域的例子描述了分析器如何在函数嵌套的情况下解析变量名。

**词法(lexical)**一词指的是,词法作用域根据源代码中声明变量的位置来确定该变量在何处可用。嵌套函数可访问声明于它们外部作用域的变量。

3 闭包

function makeFunc() { 
   
    var name = "Mozilla";// 定义局部变量 name
    function displayName() { 
   // 定义函数 displayName()
        console.log(name);
    }
    return displayName;
}
var myFunc = makeFunc();
myFunc();

结果是:Mozilla

运行这段代码的效果和之前 init() 函数的示例完全一样。其中不同的地方在于内部函数 displayName() 在执行前,从外部函数返回。

这段程序的大致过程如下:

1、第8行代码中,makeFunc()表示调用这个函数,调用过程中又调用了displayName这个函数,displayName函数执行了console.log()语句,最后将displayName作为返回值返回。
2、因此第8行代码中makeFunc()将返回值displayName赋给了myFunc,所以可以看作myFunc就是displayName这个函数。
3、最后使用myFunc进行函数调用,输出了Mozilla。

在一些编程语言中,一个函数中的局部变量仅存在于此函数的执行期间。一旦 makeFunc() 执行完毕,你可能会认为 name 变量将不能再被访问。然而,因为代码仍按预期运行,所以在 JavaScript 中情况显然与此不同。

原因在于,JavaScript中的函数会形成了闭包。== 闭包是由函数以及声明该函数的词法环境组合而成的。==该环境包含了这个闭包创建时作用域内的任何局部变量。在本例子中,myFunc 是执行 makeFunc 时创建的 displayName 函数实例的引用。displayName 的实例维持了一个对它的词法环境(变量 name 存在于其中)的引用。因此,当 myFunc 被调用时,变量 name 仍然可用,其值 Mozilla 就被传递到console.log()中。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/150539.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • JavaSE 简单介绍

    JavaSE 简单介绍Java概述什么是Java?Java是SunMicrosystems于1995年首次发布的一种编程语言和计算平台。编程语言还比较好理解,那么什么是计算平台呢?Java是快速,安全和可靠的。从笔记本电脑到数据中心,从游戏机到科学超级计算机,从手机到互联网,Java无处不在!Java主要分为三个版本Javase(J2SE)(Java2PlatformStandardEdition,java平台标准版Javaee(J2EE)(Java2Platform,EnterpriseEditi

    2022年7月7日
    64
  • 渲染画(笑脸怎么画)

    @TOC目录开始学习ShaderToy,往往不知所措,看不太懂;不容易懂,背后全是数学公式;请看这篇了解一下原理和基础。实践方法:请打开网站https://www.shadertoy.com,点击新建开始实验。完成一个圆的渲染首先把下列代码贴入voidmainImage(outvec4fragColor,invec2fragCoord){vec2uv=…

    2022年4月16日
    36
  • 8位双向移位寄存器verilog设计

    8位双向移位寄存器verilog设计系统功能设计一个8位双向移位寄存器,实现并行输入数据、数据左移、右移、清空数据的功能。程序主要包括移位寄存器模块和按键去抖模块①Key1控制拨码输入:a)key_flag1,key_state1实现Key1去抖(if(key_flag1&&(!key_state1)));b)key_cnt[3:0]从0开始在每一次Key1按下后加1,累积到3后再按下Key1,key_cnt清零;c)en_num1为高4位输入使能信号,en_num2为低4位输入使能信

    2022年7月16日
    14
  • Baidu与Google地图API初探

    Baidu与Google地图API初探

    2021年12月1日
    42
  • Google EventBus 使用详解

    Google EventBus 使用详解EventBus是Google.Guava提供的消息发布-订阅类库,它实现了观察者设计模式,消息通知负责人通过EventBus去注册/注销观察者,最后由消息通知负责人给观察者发布消息。首先使用 maven 依赖:<!– https://mvnrepository.com/artifact/com.google.guava/guava –> <dependenc…

    2022年6月17日
    118
  • p2p流媒体技术(简述流媒体的特点)

    【前言】今天发现二哥在搞流媒体,顿时来了兴趣(之前在考试维护的时候经常听老师说P2P等),追问之下之前林哥搞成功过,而且写了一系列博客;于是乎便翻开博客,认真看了看,写的非常不错:从概念到安装实现(linux和windows)再到性能测试对比非常不错(详见:http://blog.csdn.net/u012407484/article/category/2732453);…

    2022年4月18日
    91

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号