0

0

es5和es6作用域的区别是什么

青灯夜游

青灯夜游

发布时间:2022-04-11 14:56:53

|

2803人浏览过

|

来源于php中文网

原创

区别:es5中的作用域只有全局作用域和函数作用域两种,而es6中的作用域有全局作用域、函数作用域和块级作用域三种,新增了一个块级作用域。块级作用域的作用:可以解决内层作用域变量提升导致外层变量被覆盖、防止用于循环计数的变量泄露为全局变量。

es5和es6作用域的区别是什么

本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑

es5和es6作用域上的区别:

  • es5中的作用域只有两种:全局作用域和函数作用域

  • es6中的作用域有三种:全局作用域、函数作用域和块级作用域

Es5中只有全局作用域和函数作用域

ES5中用var声明变量,var声明的变量可能存在于全局作用域中,也可能存在在局部作用域中,具体情况如下

1. 全局作用域

拥有全局作用域的三种情况

a. 声明在函数外部的变量拥有全局作用域
b. 未定义直接赋值的变量自动声明为全局变量
c. window对象的属性拥有全局作用域

2. 局部作用域(函数作用域)

函数体中变量的作用域

  • 函数内部定义的变量只有在函数内才可访问

例子

  var a = 1;
  console.log(a);// 1                  此处a为全局变量,在全局作用域下都可访问得到

  b = 2
  console.log(b); // 2                 此处b未被var定义,而是被直接赋值,自动声明为全局变量
  
  function fun() {
    var c = 3;
    console.log(c);//3                 此处c存在在函数作用域中,仅在函数fun中可访问
  }
  fun()
  console.log(c);// undefined         全局作用域下访问函数作用域中的变量c,得到undefined

Es6中新增块级作用域

块级作用域可以简单理解为是:包在大括号{}里面的内容, 它可以自成一个作用域。块级作用域中变量由let和const声明

为什么需要块级作用域?

1. 解决内层作用域变量提升导致外层变量被覆盖

python学习笔记与简明教程 中文WORD版 2.03MB
python学习笔记与简明教程 中文WORD版 2.03MB

本文档是python学习笔记与简明教程;为什么用Python作为编程入门语言?每种语言都会有它的支持者和反对者。去Google一下“why python”,你会得到很多结果,诸如应用范围广泛、开源、社区活跃、丰富的库、跨平台等等等等,也可能找到不少对它的批评,格式死板、效率低、国内用的人很少之类。不过这些优缺点的权衡都是程序员们的烦恼。作为一个想要学点编程入门的初学者来说,简单才是最重要的。当学C++的同学还在写链表,学Java的同学还在折腾运行环境的时候,学Pyt

下载
var i = 5;
function fun(){
  console.log(i);//undefined
  if(true){
    var i = 6
    console.log(i);//6
  }
}
fun()

执行结果
在这里插入图片描述
函数fun里面的变量i使用var申明,此处涉及了变量提升的问题,所谓变量提升,即函数声明和变量声明总是会被解释器悄悄地"提升"到方法体的最顶部。所以此处的i相当于提前到了函数fun的最顶部,但是赋值还是在运行的i = 6时进行,上面的代码其实等价于:

var i = 5;
function fun(){
  var i;
  console.log(i);
  if(true){
    i = 6
    console.log(i)
  }
}
fun()

当第一个i被打印时,i只是被声明而还没有被赋值(在if语句中i才被赋值为6),因而第一个打印的i为undefined,第二个打印的i为6

var i = 5;
function fun(){
  console.log(i);//5
  if(true){
    let i = 6
    console.log(i);//6
  }
}
fun()

若使用let声明if中的变量i,则if语句所在的花括号{ }会形成一个块级作用域,该作用域中所声明的变量就“绑定”在该区域之中,不会再受外部影响(即暂时性死区),因而执行fun函数时输出的第一个i为全局作用域下的var i=5,if语句中输出的i为块级作用域中声明的let i=6

2. 防止用于循环计数的变量泄露为全局变量

for(var i = 0; i < 3; i++){
  doSomething()
}
console.log(i)//3

上述代码用var声明了i变量用于循环,理想状态下i应该只在循环体内有效,而此处的i却被暴露而在全局作用域下,因而在循环结束后仍能在全局作用下访问到i的值

for(let i = 0; i < 3; i++){
  console.log(i)
}
console.log(i)//undefined

如使用带有块级作用域的let来声明i,则此处声明的i变量只在for循环花括号{ }之中有效,在全局作用域下访问块级作用域中的变量会得到undefined

块级作用域特点

1. let声明的变量只在作用域(当前花括号内)中有效,因此允许任意嵌套,每一层都是单独作用域

2. 内层作用域可与外层作用域变量同名(不用作用域互不干扰)

3. let只能存在于当前作用域的顶层

注意:if语句和for语句里面的{ }中,如果有由let或const声明的变量/常量,该{ }所在范围也属于块作用域

关于作用域的例子

【相关推荐:javascript视频教程web前端

相关文章

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
c++ 根号
c++ 根号

本专题整合了c++根号相关教程,阅读专题下面的文章了解更多详细内容。

22

2026.01.23

c++空格相关教程合集
c++空格相关教程合集

本专题整合了c++空格相关教程,阅读专题下面的文章了解更多详细内容。

24

2026.01.23

yy漫画官方登录入口地址合集
yy漫画官方登录入口地址合集

本专题整合了yy漫画入口相关合集,阅读专题下面的文章了解更多详细内容。

99

2026.01.23

漫蛙最新入口地址汇总2026
漫蛙最新入口地址汇总2026

本专题整合了漫蛙最新入口地址大全,阅读专题下面的文章了解更多详细内容。

132

2026.01.23

C++ 高级模板编程与元编程
C++ 高级模板编程与元编程

本专题深入讲解 C++ 中的高级模板编程与元编程技术,涵盖模板特化、SFINAE、模板递归、类型萃取、编译时常量与计算、C++17 的折叠表达式与变长模板参数等。通过多个实际示例,帮助开发者掌握 如何利用 C++ 模板机制编写高效、可扩展的通用代码,并提升代码的灵活性与性能。

15

2026.01.23

php远程文件教程合集
php远程文件教程合集

本专题整合了php远程文件相关教程,阅读专题下面的文章了解更多详细内容。

65

2026.01.22

PHP后端开发相关内容汇总
PHP后端开发相关内容汇总

本专题整合了PHP后端开发相关内容,阅读专题下面的文章了解更多详细内容。

61

2026.01.22

php会话教程合集
php会话教程合集

本专题整合了php会话教程相关合集,阅读专题下面的文章了解更多详细内容。

63

2026.01.22

宝塔PHP8.4相关教程汇总
宝塔PHP8.4相关教程汇总

本专题整合了宝塔PHP8.4相关教程,阅读专题下面的文章了解更多详细内容。

33

2026.01.22

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
JavaScript ES5基础线上课程教学
JavaScript ES5基础线上课程教学

共6课时 | 10.5万人学习

走进 ES6 新标准语法
走进 ES6 新标准语法

共15课时 | 1.5万人学习

ECMAScript6 / ES6---十天技能课堂
ECMAScript6 / ES6---十天技能课堂

共25课时 | 1.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号