揭开 JavaScript 作用域的神秘面纱(下)

news2024/9/24 23:33:15

在这里插入图片描述

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6
🍨 阿珊和她的猫_CSDN个人主页
🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》
🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程《Vue.js 和 Egg.js 开发企业级健康管理项目》、《带你从入门到实战全面掌握 uni-app》

文章目录

  • 闭包
    • 闭包的定义和特点
    • 闭包的应用场景和优势
    • 避免闭包引起的内存泄漏问题
  • 作用域的最佳实践
    • 合理使用作用域,避免变量命名冲突
    • 利用闭包实现私有成员和模块化编程
  • 总结
    • 回顾 JavaScript 作用域的重要概念和特点
    • 强调理解和运用作用域的重要性

闭包

闭包的定义和特点

闭包是指在函数内部创建一个独立的作用域,该作用域中的变量和函数可以在函数外部被访问。即使函数执行完毕,闭包中的变量和函数仍然可以被访问。闭包具有以下特点:

  1. 函数嵌套函数:闭包必须有函数嵌套函数的结构。

  2. 内部函数可以访问外部函数的变量:内部函数可以访问外部函数中的变量,即使外部函数已经执行完毕。

  3. 外部函数返回内部函数:外部函数必须返回内部函数,才能形成闭包。

在这里插入图片描述

闭包的应用场景和优势

闭包的应用场景和优势包括:

  1. 模块封装:闭包可以将相关的代码和数据封装在一起,形成一个独立的模块。

  2. 私有成员:通过闭包,可以创建私有成员,只在闭包内部访问。

  3. 缓存数据:闭包可以用来缓存数据,避免重复计算。

  4. 函数柯里化:闭包可以将多个参数的函数转化为接受一个参数的函数。

在这里插入图片描述

避免闭包引起的内存泄漏问题

为了避免闭包引起的内存泄漏问题,可以采取以下措施:

  1. 及时释放内存:在不需要使用闭包时,及时释放闭包所占用的内存。

  2. 使用WeakMap:WeakMap 可以存储对对象的弱引用,当对象不再被引用时,WeakMap 中的键值对会自动被垃圾回收。

  3. 避免创建不必要的闭包:尽量避免创建不必要的闭包,只在需要时创建。

在这里插入图片描述

通过理解闭包的定义、特点、应用场景和优势,以及采取适当的措施避免内存泄漏问题,可以更好地利用闭包这一特性。

作用域的最佳实践

作用域的最佳实践包括合理使用作用域,避免变量命名冲突,以及利用闭包实现私有成员和模块化编程。以下是具体的说明和代码案例:

合理使用作用域,避免变量命名冲突

  1. 合理使用作用域:在 JavaScript 中,作用域可以分为全局作用域和函数作用域。应该尽量避免在全局作用域中定义变量,因为这可能导致命名冲突。更好的做法是在函数内部定义变量,这样可以限制变量的可见性,避免命名冲突。
// 全局作用域
let globalVariable = 'This is a global variable';

function func1() {
  // 函数作用域
  let localVariable = 'This is a local variable';
  console.log(globalVariable);
  console.log(localVariable);
}

func1();

在上面的代码中,globalVariable 是在全局作用域中定义的,因此在函数内部和外部都可以访问。而 localVariable 是在函数内部定义的,只能在函数内部访问。

  1. 避免变量命名冲突:在复杂的代码中,可能会出现变量命名冲突的问题。为了避免这种情况,可以使用命名空间或驼峰命名法等技巧。
// 使用命名空间
let namespace = {
  variable1: 'Value 1',
  variable2: 'Value 2',
};

console.log(namespace.variable1);
console.log(namespace.variable2);

// 使用驼峰命名法
let camelCaseVariable = 'Value';
console.log(camelCaseVariable);

在上面的代码中,使用命名空间可以将相关的变量组织在一起,避免命名冲突。而使用驼峰命名法可以通过增加变量名的可读性来减少命名冲突的可能性。

利用闭包实现私有成员和模块化编程

  1. 利用闭包实现私有成员和模块化编程:闭包可以用来创建私有成员,只在闭包内部访问。这对于实现模块化编程非常有用。
function createPrivateMember() {
  let privateVariable = 'Private value';

  function accessPrivateVariable() {
    console.log(privateVariable);
  }

  return accessPrivateVariable;
}

let privateFunction = createPrivateMember();
privateFunction(); 

在上面的代码中,createPrivateMember 函数返回了一个内部函数 accessPrivateVariable。这个内部函数可以访问私有变量 privateVariable,而外部无法直接访问。

通过使用闭包,可以将相关的代码和数据组织在一起,形成一个独立的模块,提高代码的可维护性和复用性。

总之,合理使用作用域、避免变量命名冲突以及利用闭包实现私有成员和模块化编程是作用域的最佳实践。这些实践可以帮助编写更清晰、可维护和避免错误的代码。

总结

回顾 JavaScript 作用域的重要概念和特点

JavaScript 作用域是指变量和函数在程序中的可访问范围。它有以下几个重要概念和特点:

  1. 全局作用域:在 JavaScript 中,变量和函数可以在全局作用域中定义,这意味着它们可以在整个程序中被访问。全局作用域中的变量和函数可以通过 window 对象来访问。

  2. 函数作用域:当在函数内部定义变量和函数时,它们只在该函数内部可访问,这被称为函数作用域。函数作用域中的变量和函数是私有的,外部无法访问。

  3. 块级作用域:ES6 引入了块级作用域,使用花括号 {} 包裹的代码块中定义的变量只在该代码块内部可访问。

  4. 作用域链:JavaScript 中的作用域是通过作用域链来实现的。当访问一个变量时,JavaScript 会从当前执行上下文开始向上查找,直到找到该变量的定义。

  5. 闭包:闭包是指在函数内部创建一个独立的作用域,该作用域中的变量和函数可以在函数外部被访问。即使函数执行完毕,闭包中的变量仍然可以被访问。

理解 JavaScript 作用域的概念和特点对于编写可维护和可靠的代码非常重要。合理使用作用域可以避免变量命名冲突,提高代码的可读性和可维护性。

强调理解和运用作用域的重要性

理解和运用 JavaScript 作用域的重要性不可忽视。以下是一些原因:

  1. 避免命名冲突:通过合理使用作用域,可以限制变量和函数的可见性,从而避免在不同的作用域中使用相同的变量名或函数名导致的命名冲突。

  2. 提高代码可读性:明确的作用域结构可以让代码更容易理解。当代码中变量和函数的作用域清晰时,读者可以更轻松地跟踪变量的赋值和函数的调用,提高代码的可读性。

  3. 增强代码的可维护性:理解作用域有助于更好地组织和管理代码。当需要修改代码时,可以更自信地知道哪些变量和函数可以安全地修改,而不会影响到其他部分的代码。

  4. 避免副作用:在函数中使用局部变量可以避免全局变量的副作用。全局变量可能被其他部分的代码修改,从而导致意外的结果。通过使用函数作用域,将变量限制在函数内部,可以更好地控制变量的变化。

  5. 实现模块化编程:闭包是 JavaScript 中一种强大的模块化编程技术。通过创建闭包,可以将相关的变量和函数封装在一起,形成一个独立的模块,方便代码的复用和维护。

总之,理解和运用 JavaScript 作用域是编写高质量 JavaScript 代码的基础。它可以帮助避免常见的错误,提高代码的可读性和可维护性,并使代码更模块化和易于扩展。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1360090.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

pyqtgraph 教程

pyqtgraph 教程 简介 PyQtGraph 是一个用于科学和工程数据可视化的开源库,基于 PyQt 和 NumPy 构建而成。它提供了丰富的绘图工具和交互功能,可以用于创建高性能的实时数据图表、图像显示和信号处理应用。 以下是 PyQtGraph 的一些特点和功能&#xf…

.NET Standard 支持的 .NET Framework 和 .NET Core

.NET Standard 是针对多个 .NET 实现推出的一套正式的 .NET API 规范。 推出 .NET Standard 的背后动机是要提高 .NET 生态系统中的一致性。 .NET 5 及更高版本采用不同的方法来建立一致性,这种方法在大多数情况下都不需要 .NET Standard。 但如果要在 .NET Framewo…

基于sumo实现交通灯控制算法的模板

基于sumo实现交通灯控制算法的模板 目录 在windows安装run hello world networkroutesviewsettings & configurationsimulation 交通灯控制系统 介绍文件生成器类(FileGenerator)道路网络(Network)辅助函数生成道路网络&am…

从细菌基因组中提取噬菌体变异序列工具PhaseFinder的介绍、安装和使用方法

PhaseFinder ## 概览,不翻译了,大家自己看吧 The PhaseFinder algorithm is designed to detect DNA inversion mediated phase variation in bacterial genomes using genomic or metagenomic sequencing data. It works by identifying regions flank…

Java学习笔记(四)——正则表达式

文章目录 正则表达式基本规则字符类(只匹配一个字符)预定义字符(只匹配一个字符)数量词练习正则表达式插件 爬虫利用正则表达式获取想要的内容爬取网络信息练习有条件的爬取贪婪爬取非贪婪爬取正则表达式在字符串中的使用 分组捕获分组正则表达式外部使用非捕获分组正则表达式忽…

公共用例库计划--个人版(二)主体界面设计

1、任务概述 计划内容:完成公共用例库的开发实施工作,包括需求分析、系统设计、开发、测试、打包、运行维护等工作。 1.1、 已完成: 需求分析、数据库表的设计:公共用例库计划–个人版(一) 1.2、 本次待…

神经网络-卷积层

卷积 输入通道数, 输出通道数,核大小 参数具体含义 直观理解各个参数的网站(gif) https://github.com/vdumoulin/conv_arithmetic/blob/master/README.md大概长这样,cyan是青色的意思 channel数(终于理解论文里图片放好多层的原因…

VMware ESXI 8 安装ipmitool 调整戴尔服务器风扇转速

本文内容适合ESXI 8版本安装ipmitool ,进行管理,已知的是8.0以上版本无法安装社区的vib.所以需要自己编译文件,7.0及之前的版本可以安装vib版本的ipmtools。 一、编译好的适用于esxi8的ipmitool下载 ipmitool下载 二、安装ipmitool 1、开…

铁塔基站数字化管理监测解决方案

截至2023年10月,我国5G基站总数达321.5万个,占全国通信基站总数的28.1%。然而,随着5G基站数量的快速增长,基站的能耗问题也逐渐日益凸显,基站的用电给运营商带来了巨大的电费开支压力,降低5G基站的能耗成为…

new FormData 同时发送表单 json 以及文件二进制流

需要新增时同时发送表单 json 以及对应的文件即可使用以下方法传参 let formDataParams new FormData(); 首先通过 new FormData() 创建你需要最后发送的表单 接着将你的对象 json 存储,注意使用 new Blob 创建大表单转换成 json 格式。以…

根据MySql的表名,自动生成实体类,模仿ORM框架

ORM框架可以根据数据库的表自动生成实体类,以及相应CRUD操作 本文是一个自动生成实体类的工具,用于生成Mysql表对应的实体类。 新建Winform窗体应用程序AutoGenerateForm,框架(.net framework 4.5), 添加对System.Configuration的…

了解nginx

1,概念 nginx是一个轻量级、高性能的HTTP和反向代理web服务器,同时也是一个通用代理服务器(TCP、UDP、IMAP、POP3、SMTP)。 2,优势 轻量级,占用内存少,启动极快采用事件驱动的异步非阻塞处理方…

linux中的系统安全

一.账号安全 将非登录用户的shell设为/sbin/nologin 系统中用户有三种:超级管理员 普通用户 程序用户 前两种用户可以登录系统,程序用户不给登录 所以称为非登录用户 命令格式: usermod -s /sbin/nologin(改已有用户&#…

亲测表白网制作源码,在线制作表白,无数据库上传就能用

在线制作表白网源码 没有数据库上传就能用 后台/admin 账号密码都是admin

【mars3d】批量关闭矢量数据的startFlicker()闪烁或者全部关闭startFlicker()

问题 1.graphic/entity/billboard怎么能够批量关闭startFlicker()闪烁或者 全部关闭startFlicker()呢? 相关链接 1.http://mars3d.cn/editor-vue.html?idgraphic/entity/billboard 2.http://mars3d.cn/apidoc.html#FlickerEntity 期望效果 1.graphic.stopFlic…

Java:爬虫htmlunit

为什么htmlunit与HttpClient两者都可以爬虫、网页采集、通过网页自动写入数据,我们会推荐使用htmlunit呢? 一、网页的模拟化 首先说说HtmlUnit相对于HttpClient的最明显的一个好处,HtmlUnit更好的将一个网页封装成了一个对象,如果你非要说H…

数字后端设计实现 | 数字后端PR工具Innovus中如何创建不同高度的row?

吾爱IC社区星球学员问题:Innovus后端实现时两种种不同高度的site能做在一个pr里面吗? 答案是可以的。 Innovus支持在同一个设计中中使用不同的row,但需要给各自子模块创建power domain。这里所说的不同高度的row,有两种情况。 1…

数据库高可用mha

MHA搭建的步骤 一.配置主从复制 1.初始化环境 #在四台服务器上初始化环境 systemctl stop firewalld systemctl disable firewalld setenforce 0 2.修改 Master、Slave1、Slave2 节点的主机名 #在Master上 hostnamectl set-hostname mysql1 su#在Slave1 hostnamectl set-h…

102、X^3 : Large-Scale 3D Generative Modeling using Sparse Voxel Hierarchies

简介 官网  Nvidia2023提出的一种新的生成模型,可生成具有任意属性的高分辨率稀疏3D体素网格,以前馈方式生成数百万体素,最细有效分辨率高达 102 4 3 1024^3 10243,而无需耗时的 test-time 优化,使用一种分层体素潜…

LeetCode 2125. 银行中的激光束数量【数组,遍历】1280

本文属于「征服LeetCode」系列文章之一,这一系列正式开始于2021/08/12。由于LeetCode上部分题目有锁,本系列将至少持续到刷完所有无锁题之日为止;由于LeetCode还在不断地创建新题,本系列的终止日期可能是永远。在这一系列刷题文章…