作用域是JavaScript中非常基础的概念,很多刚入门的同学却弄不懂作用域的概念,但不弄明白的话又不能够写出高效简介的代码,今天小千就来给大家介绍一下关于前端JavaScript作用域的那点事。

什么是作用域?

JavaScript 中的作用域是指变量的可访问性或可见性,也就是说,程序的哪些部分可以访问该变量,或者该变量在何处可见。

为什么作用域很重要?

作用域的主要好处是安全性。也就是说,只能从程序的特定区域访问变量,使用作用域,我们可以避免程序其他部分对变量的意外修改。

作用域可减少命名冲突。也就是说,我们可以在不同的作用域内使用相同的变量名。

作用域类型

JavaScript中有三种类型的作用域:全局作用域、局部作用域或函数作用域、块级作用域。

1.全局作用域

不在函数或块(一对花括号)内定义的任何变量都在全局作用域内,可以从程序的任何位置访问全局作用域内的变量。例如:

2.局部作用域或函数作用域

利用var在函数体内部声明的变量都在局部作用域(或称函数作用域)内,它们只能从该函数内部访问,不能在外部代码中访问。例如:

3.块级作用域

ECMAScript 2015 引入了 let 和 const 来定义变量,与 var 定义变量不同,它们的作用域是在最接近的花括号内,这意味着,不能从那对花括号之外访问它们。例如:

我们可以看到 var 定义的变量可以在块外部使用,而 let 定义的变量不能在块外部访问。

4.嵌套作用域

就像 JavaScript中的函数一样,一个作用域可以嵌套在另一个作用域内。例如:

这个代码片段中有3个作用域彼此嵌套。首先,块级作用域(由 let 定义的变量创建)嵌套在局部作用域或函数作用域内,而后者又嵌套在全局作用域内。

5.词法作用域

词法作用域(也称为静态作用域),从字面上讲是指作用域是在词法分析(通常称为编译)时确定的,而不是在运行时确定的。以题主的问题作为示例:

在这里,不管是从哪儿调用 test() 函数,console.log(a) 总是会打印 hello world,这与具有 动态作用域 的语言 console.log(a) 不同,后者会根据调用函数的位置而打印不同的值。

如果上面的代码是用支持动态作用域的语言编写的,console.log(a) 则会打印出来 I belong to func。

使用词法作用域,我们可以仅通过查看源代码来确定变量的作用域,而在动态作用域下,只有在执行代码后才能确定作用域。

6.作用域链

当在 JavaScript 中使用变量时,JavaScript 引擎将尝试在当前作用域中查找变量的值,如果找不到变量,它将查找外部作用域并将继续这样做,直到找到变量或到达全局作用域为止。如果在全局作用域中仍然找不到该变量,它将在全局作用域内隐式声明该变量(非严格模式下)或返回错误。

调用 bar() 函数时,JavaScript 引擎将查找 bar 变量并在当前作用域中找到了它。接下来,在当前作用域中查找 foo 变量,但无法找到它,因此继续在外部作用域中查找并找到了它(即全局作用域)。

之后,我们为 num 变量赋值 99,JavaScript 引擎在当前作用域中查找 num 变量,找不到,然后在外部作用域(全局作用域)中查找变量,也找不到,由于脚本不在严格模式下,因此创建一个名为 num 的新全局变量,并为其分配变量值 99。

以上就是关于JavaScript作用域的介绍和案例了,希望能帮到大家!

本文来自千锋教育,转载请注明出处。

关于JavaScript的作用域你应该了解的那点事!相关推荐

  1. JavaScript词法作用域的简单介绍

    by Michael McMillan 迈克尔·麦克米兰(Michael McMillan) JavaScript词法作用域的简单介绍 (An easy intro to Lexical Scopin ...

  2. 再探Javascript词法作用域

    写在前面的话:每个人都会犯错--有时候'孰能无过,过而能改,善莫大焉',有时候知道自己错了却没有机会更改.其实,错了并不仅仅是错了,做错了,除了及时改正和弥补之外,最重要的是为自己犯的错承担所有责任. ...

  3. 浅谈JavaScript 函数作用域当中的“提升”现象

    在JavaScript当中,定义变量通过var操作符+变量名.但是不加 var 操作符,直接赋值也是可以的. 例如 : message = "hello JavaScript ! " ...

  4. JavaScript的作用域与闭包

    JavaScript的作用域以函数为界,不同的函数拥有相对独立的作用域.函数内部可以声明和访问全局变量,也可以声明局部变量(使用var关键字,函数的参数也是局部变量),但函数外部无法访问内部的局部变量 ...

  5. JavaScript变量作用域和内存问题(js高级程序设计总结)

    1,变量 ECMAScript和JavaScript是等同的吗?个人认为是否定的.我的理解是这样的,ECMAScript是一套完整的标准或者说协议,而JavaScript是在浏览器上实现的一套脚本语言 ...

  6. web前端教程之JavaScript的作用域

    作为一个前端工程师,你必须对JavaScript的作用域不陌生,传统常见的有函数级作用域,还有全局作用域,ES6 let const 的块级作用域,其实还有一个你不知道的块级作用域,今天小千就来给大家 ...

  7. JavaScript从作用域到闭包

    目录 作用域 全局作用域和局部作用域 块作用域与函数作用域 作用域中的声明提前 作用域链 函数声明与赋值 声明式函数.赋值式函数与匿名函数 代码块 自执行函数 闭包  作用域(scope) 全局作用域 ...

  8. javascript 之作用域-06

    作用域 作用域:是指变量可访问的范围,他规定了如何查找变量,也就是确定当前执行代码对变量的访问权限. 作用域有两种工作模式: 静态作用域 :又称为词法作用域,在编译阶段就可以决定变量的引用,由程序定义 ...

  9. JavaScript变量作用域如何像多个级别的政府一样

    by Kevin Kononenko 凯文·科诺年科(Kevin Kononenko) JavaScript变量作用域如何像多个级别的政府一样 (How JavaScript variable sco ...

最新文章

  1. 2022-2028年中国散热产业深度调研及投资前景预测报告(全卷)
  2. 如何在Java中将String转换为int?
  3. ubuntu9.10安装Tweak
  4. GPTEE中定义的RSA的Algorithm Identifier详解
  5. centos java 集成环境搭建,CentOS上搭建Tomcat环境并配置服务自启动 - Sonnyb - 博客园...
  6. CodeForces - 1334C Circle of Monsters(贪心)
  7. yum搭建本地仓库、国内源、下载rpm包、源码安装
  8. Postfix实现代理Exchange邮件传输方案
  9. [mount]linux 挂载时 mount: wrong fs type, bad option, bad superblock on /dev/sdb
  10. php 取得user_agent,php通过$_SERVER['HTTP_USER_AGENT']获取浏览器相关参数(转)
  11. 将数据从MySql导入数据至SQL Server 2000
  12. python函数回顾:abs()
  13. python从入门到精通需要多久-Python 从入门到精通:一个月就够了!
  14. android gps 速度,Android 获取GPS速度
  15. 硅谷课堂第十二课-公众号点播课程和直播管理模块
  16. java jbutton 禁用_java – 在后台作业时禁用JButton,以避免多次单击
  17. 幼儿-综合素质【8】
  18. android手机脱网分析,网络营销-13款手机浏览器分析(Android).pptx
  19. 小鑫的算法之路:leetcode0704 二分查找
  20. 计算机主机配置一般有机箱主板cpu,组装台式电脑配置清单

热门文章

  1. RealNVP与Glow:流模型的传承与升华
  2. 使用postman测试oauth2.0认证服务中出现OAuth出现Bad credentials
  3. Mybatis-sql语句的抽取
  4. 单例模式volatile
  5. 关于activiti中的三类网关
  6. 牛客题霸 NC24 删除有序链表中重复的元素-II
  7. Vue 4.0——Vue与Bootstrap整合解决方案
  8. Computer Game
  9. linux获取指定字符,shell 获取用户输入指定范围的单个字符的两种方法
  10. 每个Java开发者都应该知道的5个JDK工具