Javascript 闭包解释 [关闭]

2024-04-07

问题:闭包似乎有很多好处,但有哪些缺点呢?另外,我对闭包的理解是否正确?最后,一旦创建了闭包,它们可以被销毁吗?

我读了一些关于 Javascript 闭包的文章。我希望有更懂行的人能够指导我的主张,纠正我的错误之处。

闭包的好处:

  1. 使用内部函数将变量封装到局部作用域。 该函数的匿名性微不足道。

我发现有用的是做一些关于本地/全局范围的基本测试:

<script type="text/javascript">

   var global_text  = "";
   var global_count = 0;
   var global_num1  = 10;
   var global_num2  = 20;
   var global_num3  = 30;

   function outerFunc() {

      var local_count = local_count || 0;

      alert("global_num1: " + global_num1);    // global_num1: undefined
      var global_num1  = global_num1 || 0;
      alert("global_num1: " + global_num1);    // global_num1: 0

      alert("global_num2: " + global_num2);    // global_num2: 20
      global_num2  = global_num2 || 0;         // (notice) no definition with 'var'
      alert("global_num2: " + global_num2);    // global_num2: 20
      global_num2  = 0;

      alert("local_count: " + local_count);    // local_count: 0

      function output() {
         global_num3++;

         alert("local_count:  " + local_count  + "\n" +
               "global_count: " + global_count + "\n" +
               "global_text:  " + global_text
              );

         local_count++; 
      }

      local_count++;
      global_count++;

      return output;  
   }  

   var myFunc = outerFunc();

   myFunc();
      /* Outputs:
       **********************
       * local_count:  1
       * global_count: 1
       * global_text: 
       **********************/

   global_text = "global";
   myFunc();
      /* Outputs:
       **********************
       * local_count:  2
       * global_count: 1
       * global_text:  global
       **********************/

   var local_count = 100;
   myFunc();
      /* Outputs:
       **********************
       * local_count:  3
       * global_count: 1
       * global_text:  global
       **********************/


   alert("global_num1: " + global_num1);      // global_num1: 10
   alert("global_num2: " + global_num2);      // global_num2: 0
   alert("global_num3: " + global_num3);      // global_num3: 33

</script>

我从中取出了一些有趣的东西:

  1. outerFunc 中的警报仅被调用一次,即当outerFunc 调用被分配给myFunc (myFunc = outerFunc()) 时。这个分配似乎使outerFunc保持打开状态,我称之为持久状态。

  2. 每次调用 myFunc 时,都会执行 return。在这种情况下,返回的是内部函数。

  3. 真正有趣的是定义局部变量时发生的本地化。请注意第一个警报中 global_num1 和 global_num2 之间的差异,即使在尝试创建变量之前,global_num1 也被视为未定义,因为“var”用于表示该函数的局部变量。 -- 这之前已经讨论过,按照 Javascript 引擎的操作顺序,很高兴看到它投入工作。

  4. 全局变量仍然可以使用,但局部变量将覆盖它们。请注意,在第三次 myFunc 调用之前,创建了一个名为 local_count 的全局变量,但它对内部函数没有影响,该函数具有一个同名的变量。相反,每个函数调用都能够修改全局变量,如 global_var3 所注意到的。

发帖感想:尽管代码很简单,但它对你们来说却充满了警报,因此您可以即插即用。

我知道还有其他闭包的例子,其中很多都使用匿名函数与循环结构相结合,但我认为这对于 101 初学者的课程来说有利于看到效果。

我担心的一件事是闭包会对内存产生负面影响。因为它保持函数环境打开,所以它也将这些变量存储在内存中,这可能/可能不会影响性能,特别是在 DOM 遍历和垃圾收集方面。我也不确定这在内存泄漏方面会起到什么样的作用,并且我不确定是否可以通过简单的“delete myFunc;”从内存中删除闭包。

希望这对某人有帮助,

vol7ron


None

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Javascript 闭包解释 [关闭] 的相关文章

  • 如何使用 javascript 从 Audio Element 录制音频

    我正在使用 HTML5 和 Javascript 制作录音机 并且不想包含任何第三方 API 我的第一步是使用以下命令创建音频检索器和播放器
  • VideoJs 在 Firefox 中的 Flash 回退问题

    我尝试将 videoJs 添加到我的网站来播放 MP4 文件 所有这些在 Chrome 中都能完美运行 但当我转到 Firefox 不支持 MP4 文件 时 Flash 播放器停留在黑屏上 按钮不执行任何操作 简单的问题 为什么 我不明白
  • 如何从模板脚本访问 AngularJS 变量

    我的控制器 scope totals totals 我的模板 按 html 注入的预期工作 totals 但我需要的是访问变量totals在模板的脚本中 如下所示 我试过了 scope totals totals totals 等 均无济于
  • 如何使用 Fabric js 以编程方式自由绘制?

    使用 Fabric js 构建多人涂鸦 尝试使用 Fabric js 实现多人涂鸦 想法是当 U1 在画布上绘制时 我们将点推送到 RTDB 并在客户端上获取这些点 并以编程方式在两个客户端中绘制笔画 您可以将画布的数据保存在path cr
  • 解析 Angular2 中的 xml 以在视图中呈现

    我是否需要解析 xml 以从 xml 获取数据以在 html 中呈现 我目前正在使用获取本地 xml 文件http get请求并在控制台日志中显示 xml 文件中的所有信息 我认为它只是在读取它 问题是如何在angular2中将xml转换为
  • JS中的递归排序

    在一次采访中 我被要求编写一个程序 算法来使用递归对数字数组进行排序 虽然我含糊地回答了它 但我尝试并想出了以下代码 您可以使用以下JSFiddle https jsfiddle net RajeshDixit 2u9mLegv 1 链接来
  • 计算链接上的点击次数(不带 onclick)[关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我有诸如此类的链接 a href h
  • 在 VueJs 中使用上下键自动完成搜索

    除了自动完成搜索之外 我还想添加功能以允许使用 VueJs 按下 向上键功能 我的模板如下所示 div h2 Todos h2 div class autocomplete div div
  • 如何观察Firebase存储上传事件

    我有一个将照片上传到 Firebase 存储的 iOS 应用程序 以及一个连接到同一个 Firebase 的 Web 应用程序 有没有办法从网络上观察存储的变化 当上传照片时 只有iOS设备本身可以访问UploadTask 并且我没有看到o
  • 将数组传递给 include() javascript

    我试图找出一个字符串是否包含存储在数组中的多个字符串 includes 所以我尝试过 let string hello james console log string includes hello james 但它被返回为false 当我
  • 使用 javascript onClick 播放 mp3 文件

    我正在播放 mp3 文件 只是 javascript onClick 下面是我的代码 Music File 1
  • Cloudflare Worker 缓存 API 出现问题

    我现在花了无数的时间尝试让缓存 API 来缓存一个简单的请求 我让它在中间工作过一次 但忘记向缓存键添加一些内容 现在它不再工作了 不用说 cache put 没有指定请求是否实际被缓存的返回值并不完全有帮助 我只能进行反复试验 有人可以给
  • 强制 Javascript 编码风格的工具[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我需要自动检查不同人编写的javascript源代码的风格 你知道有什么好的工具可以做到这一点吗 与 emacs 集成将是一个优势 先感谢
  • Vue Chart.js - 数据变化时图表不更新

    我正在使用 Vue js 和 Chart js 绘制一些图表 每次我调用该函数时generateChart 图表不会自动更新 当我在 Vue Devtools 中检查数据时 它们是正确的 但图表没有反映数据 但是 当我调整窗口大小时 图表确
  • 可选链接不起作用:无法读取未定义的属性“0”[关闭]

    Closed 这个问题需要调试细节 help minimal reproducible example 目前不接受答案 为什么可选链在这里不起作用 html userItemModel item priceList 0 sellerUrl
  • 哪个 SVG/SMIL DOM 元素具有“beginElement”方法?

    最终 这是针对将在 Firefox 中运行的 Kiosk 风格的应用程序 使用 jQuery 1 6 4 因此答案可能是特定于 Firefox 的 我正在尝试制作动画 SVG 但我正在尝试通过动态插入 SMIL 来为其设置动画 我没有看到任
  • Jquery 手风琴默认不折叠

    我正在使用 bootstrap 提供的折叠插件 这是一个 jquery 简单插件 但是它默认折叠 如何修改以使折叠项默认隐藏 只有当我按下标题时 该项目才会折叠并显示 谢谢 插件的文档 只有几行 所以只需要一分钟 http twitter
  • 为什么 JavaScript 在不同浏览器中不一致?

    在花了无数个小时修复 JS 以使其跨浏览器兼容 主要是 IE 之后 我一直在思考以下问题 Why不是 JavaScript持续的跨浏览器 我的意思是 为什么 JS 不能像 Java 和 Flash 那样好呢 相反 我们必须求助于 jQuer
  • 展平数组中的对象

    大家好 我从响应中获取了一系列对象 我需要将所有学生对象展平为简单的学生姓名 但不确定如何进行 任何帮助将不胜感激 数组示例 students id 123456 name Student Name active true students
  • JS 中的展开/休息运算符如何工作? [复制]

    这个问题在这里已经有答案了 我正在努力完全理解扩展 休息运算符在 JS 中的工作原理 我已经阅读了 MDN 文档 但我仍然不完全清楚 我在下面提供了一个示例 我在其中使用了它并且它按预期工作 const users name Samir a

随机推荐

  • 使用 VS2017 启动 asp.net core 应用程序会创建新的应用程序池

    每次当我在 VS2017 的本地 IIS 下启动 ASP net Core 应用程序的调试器时 都会创建一个新的应用程序池 我希望应用程序在 DefaultAppPool 身份 下保持稳定 而不是创建新的应用程序 这个设置在哪里会影响这个
  • Laravel 查询带有“if”条件?

    我正在尝试使用 Laravel 4 制作高级搜索表单 这是查询 result DB table users ads gt join ads users ads ad id ads id gt orderBy column method gt
  • JavaScript 通过引用与通过值 [重复]

    这个问题在这里已经有答案了 我正在寻找一些很好的综合阅读材料 了解 JavaScript 何时按值传递内容 何时通过引用传递内容 何时修改传递的项目影响函数外部的值以及何时不影响函数外部的值 我还感兴趣的是 何时通过引用与通过值分配给另一个
  • 相邻弹性盒容器中的内容垂直对齐

    我有多个项目说卡片 这些卡片需要水平堆叠 并且高度需要相同 这正在发生在我身上 每张卡片都有图像 文本和按钮 每张卡片的图像和文本应采用任何卡片的最大高度 以便它们正确对齐 这不会发生在我身上 如果图像和文本正确对齐 则按钮将始终在底部的每
  • Firestore安全规则:在文档的数组中搜索用户的ID

    首先 对不起我糟糕的英语 这不是我的母语 我正在 Firebase 中使用 Firestore 数据库构建一个简单的应用程序 在我的应用程序中 用户是小组的成员 他们可以访问其他用户的数据 为了不查询太多文档 每个用户一个 在组文档的子集合
  • 循环 AVMutableCompositionTrack

    我身上有两个音轨 我将它们相互组合起来 如下所示 AVMutableComposition composition AVMutableComposition alloc init AVMutableCompositionTrack comp
  • Python 获取系统环境变量 Linux

    我已经暴露了一个系统环境变量KEY1有价值VALUE1 in etc profile 我知道 我知道 这可能很糟糕 如果我现在在我的壳里 echo KEY1 VALUE1 但当我这样做时 python c import os print o
  • Rails 是否有“未经授权”的例外情况?

    我正在编写一个应用程序 它使用普通的旧 Ruby 对象 PORO 从控制器中抽象出授权逻辑 目前 我有一个名为的自定义异常类NotAuthorized that I rescue from在控制器级别 但我很想知道 Rails 4 是否已经
  • 在 irb 中导航命令行的键盘快捷键

    我看过用户运行 irb 的截屏视频 当他们编写文本时 他们会跳转到行的开头 结尾以及单词的开头 结尾 用于执行此操作的击键是什么 这取决于所使用的外壳吗 Ctrl A gt Move to beginning of line Ctrl E
  • 同一解决方案中的 NuGet 引用

    以前可能已经问过这个问题 如果是 请提供链接 我正在为我的公司开发一套 核心 解决方案 我们在此解决方案集中有几个不同的项目 每个项目在构建时都会变成一个 NuGet 包 以便在我们的其他解决方案项目中使用 我发现我想通过 NuGet 引用
  • Swift Firebase Storage 如何检索名称未知(NSUUID)的图像

    我正在制作一个函数来检索 url 作为用户图像 然而 我的上传图像名称功能是由NSUUID创建的 因此 我不知道每个用户个人资料图片的名称是什么 如何改进我的代码以获得每个用户的用户 imgae 而不是硬编码 img 名称 func get
  • RStudio 通常在空白屏幕中启动;需要 sudo 才能工作

    在新安装的 x64 Ubuntu GNOME 16 04 和 R v3 3 2 上运行的 RStudio v1 0 136 在空白屏幕中启动 终端输出如下 参见屏幕截图 TypeError undefined is not an objec
  • Pydoc 没有看到文档字符串?

    显然我在这里错过了一些严重的事情 这是我的测试程序 Doc and nothing but doc class TestMe object class documentation goes here def testFunc self Fu
  • 应忽略听到“元素‘行为’具有无效子元素”,但因此阻止更新服务引用[重复]

    这个问题在这里已经有答案了 可能的重复 元素 behavior 在 wcf app config 中具有无效的子元素 myFaultExtension https stackoverflow com questions 4677377 th
  • 如何为 Material UI React 添加 RTL 支持

    我正在构建一个 LTR 应用程序 并且想添加 RTL 支持 该应用程序基于 Material UI React 之上 由于我使用的是 CSS Flex Box 因此我能够将应用程序旋转到 RTL 只需将 dir rtl 添加到主体即可 我还
  • 如何从这个字符串中解析出时间戳?

    我有这个示例字符串 Sample string 1 A 1 1 B 1 I 2 f 0 p 1 d 2010 07 21T08 52 05 222ZKHBDGSLKHFBDSLKFGNIF XLGCREWIGMEWCERG Sample s
  • 苹果推送通知服务统计(apns)

    是否可以找到相关信息Apple Push Notification服务使用情况 有多少人正在使用它们 有多少人正在拒绝它们 或者也许 有人已经掌握了此类信息 苹果没有提供大量关于有多少用户实际接受 拒绝推送通知的信息 但您可以通过比较总安装
  • Twitter Bootstrap 单选框/复选框 - 如何放置字形图标

    使用 TB 是否可以设置单选按钮或复选框的样式 使其显示字形而不是单选按钮或复选框的默认样式 我想用一个glyphicon glyphicon star表示未选中 然后glyphicon glyphicon star empty来表示已检查
  • 这是seaborn.lineplot 色调参数中的错误吗?

    通过此代码片段 我期望得到一个每种色调一条线的线图 它具有以下不同的值 1 5 10 20 40 import math import pandas as pd import seaborn as sns sns set style whi
  • Javascript 闭包解释 [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 问题 闭包似乎有很多好处 但有哪些缺