当前位置: 首页 > news >正文

JavaScript 变量作用域与函数调用机制:var 示例详解

JavaScript 变量作用域与函数调用机制:var 示例详解

在 JavaScript 中,作用域和闭包是理解变量生命周期和行为的核心概念。通过以下这段代码,我们将详细分析如何在不同的作用域内使用 var 关键字,并解释相关的变量访问规则

代码解析

var name = "Hello, World"; // 1. 全局作用域中定义了 name,值为 "Hello, World"function echo() {console.log(name);  // 2. 输出 name 的值
}function env() {var name = "hello, kitty"; // 3. 在 env 函数内定义了局部变量 nameecho(); // 4. 调用 echo 函数
}env(); // 5. 调用 env 函数

执行流程

  • 全局作用域

    • 在全局作用域中,var name = “Hello, World” 赋值了一个全局变量 name,其值为 “Hello, World”
      var name = "Hello, World";
    
  • 定义函数 echo()

    • 函数 echo 定义了一个 console.log(name),该函数用于输出 name 变量的值
      var name = "Hello, World";
    
  • 定义函数 env()

    • 函数 env 内部首先声明了一个局部变量 name,并赋值为 “hello, kitty”。这个 name 变量只在 env 函数内部有效。
    • 然后,env 函数调用了 echo()
     function env() {var name = "hello, kitty";echo();}
    
  • 调用 env() 函数

    • 当 env() 被调用时,JavaScript 会执行 env 函数中的代码
    • 在 env() 内部,name 被声明为 “hello, kitty”,但是在调用 echo() 时,echo() 函数会输出 name,此时发生了作用域链的查找

关键点:作用域链(Scope Chain) 和 函数调用时的作用域

  • echo() 函数中的 name 是在全局作用域中查找的,因为 echo() 是在全局作用域中定义的。当 echo() 被调用时,它会首先在自己所在的作用域中查找 name,如果没有找到,就会继续在外部作用域中查找(即查找全局作用域)
  • 局部变量 name(在 env() 内部定义的 name)只对 env() 函数有效,对 echo() 函数没有影响
    • 由于 echo() 没有在其作用域内找到 name,它就会在外部的作用域中查找。在此情况下,echo() 找到了全局作用域中的 name,其值为 “Hello, World”

作用域链: echo() 函数查找 name 时,会首先查看其自己的作用域,然后查看外层作用域(直到全局作用域)。env() 中的局部 name 对 echo() 的执行没有影响,因为 echo() 查找的是全局作用域中的 name。

总结

  • 作用域链的概念: JavaScript 中的函数作用域遵循词法作用域规则,变量的查找顺序是从当前函数的作用域开始,依次向外查找,直到全局作用域为止。

  • 全局与局部变量的关系: 即使在一个函数内部声明了与全局变量同名的局部变量,这个局部变量仅对函数内部有效。函数外部的同名变量(如果有)不会被覆盖。

  • var 和作用域: 使用 var 声明的变量在其作用域内有效,如果函数内有同名变量,局部变量会覆盖函数内部的代码,但不会影响外部作用域中的变量

http://www.lryc.cn/news/477357.html

相关文章:

  • Linux(CentOS)安装 JDK
  • AI产品经理实战手册:策略、开发与商业化指南
  • 【大语言模型】ACL2024论文-06 探索思维链COT在多模态隐喻检测中的应用
  • Linux之初体验
  • 现代化水电管理:Spring Boot在大学城的实践
  • 黑马官网2024最新前端就业课V8.5笔记---HTML篇
  • GS-Blur数据集:首个基于3D场景合成的156,209对多样化真实感模糊图像数据集。
  • Linux下Java的多种方式安装
  • Android Studio:connect time out
  • A014-基于Spring Boot的家电销售展示平台设计与实现
  • 数学期望和联合概率密度
  • 萤石私有化设备视频平台EasyCVR视频融合平台如何构建农业综合监控监管系统?
  • 【MongoDB】Windows/Docker 下载安装,MongoDB Compass的基本使用、NoSQL、MongoDB的基础概念及基础用法(超详细)
  • 微信小程序-自定义导航栏
  • vue中强制更新视图
  • mqsql 场景函数整理
  • 【AI日记】24.11.05 向量数据库 weaviate、混合搜索、多语言搜索、明确自己的南京
  • Scrapy入门
  • Ubantu/Linux 采用Repo或Git命令报错!!
  • C++简单工厂模式
  • 讲讲 kafka 维护消费状态跟踪的方法?
  • MySQL 和 PostgreSQL 的对比概述
  • 【Python单元测试】pytest框架单元测试 配置 命令行操作 测试报告 覆盖率
  • 【牛客刷题记录】【JAVA】栈
  • 【办公类-04-04】华为助手导出照片视频分类(根据图片、视频的文件名日期导入“年-月-日”文件夹中,并转移到“年-月”文件中整理、转移到“年”文件夹中整理)
  • 62-Java-面试专题(1)__基础
  • 快速构建数据产品原型 —— 我用 VChart Figma 插件
  • 登录—令牌技术
  • NPOI 操作详解(操作Excel)
  • 2024年北京海淀区中小学生信息学竞赛校级预选赛试题