ES6的块级作用域

byteweaver
• 阅读 3708

ES5 中只有全局作用域和函数作用域。这会导致函数作用域覆盖了全局作用域,或者循环中的变量泄露为全局变量。

示例:

函数作用域覆盖全局作用域:

var a = 1;
function test() {
    console.log(a);  // 由于变量提升,导致内层的a变量覆盖了外层的a变量
    if (true) {
        var a  = 10;
    }
}
test();   // 输出:undefined

循环中的变量泄露为全局变量:

for(var i=0; i<5; i++) {
    console.log(i);  // 输出:0 1 2 3 4
}
console.log(i); // 输出:5

ES6的块级作用域

let 实际上为 JavaScript 新增了块级作用域,外层作用域无法获取到内层作用域,这样非常安全。即使外层和内层都使用相同变量名,也都互不干扰。

示例:

例如下面这段代码:

function test() {
    let a = 1;
    if(true){
      let a = 10;
      console.log(a);  // 输出:10
    }
    console.log(a);   // 输出:1
}

test();  // 调用函数

在函数 test()if 语句代码块中都声明了变量 a,但是因为 let 命令声明的变量只在块级作用域中起作用,所以在 if 中输出 a 的值为 10,在 test() 中输出 a 的值为 1,这两者互不干扰。

块级作用域与函数声明

ES5 中规定,函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域声明。而在 ES6 中引入了块级作用域,允许函数可以在块级作用域中声明。块级作用域之中,函数声明语句的行为类似于 let,在块级作用域之外不可引用。

示例:

我们来看一个例子:

{
    if(true){
        function test(){
            console.log("你好,侠课岛!")
        }
    }
}

test();

执行代码,输出结果为“你好,侠课岛!”。

但是一般考虑到兼容等问题,我们应该避免在块级作用域内声明函数。如果确实需要,也应该写成函数表达式,而不是函数声明语句。

示例:

上述代码使用函数表达式来写:

{
    if(true){
        let test = function (){
            console.log("你好,侠课岛!");
        };
    }
}

除此之外,还有一个地方我们需要注意一下, ES6 的块级作用域必须有大括号,如果没有大括号,JavaScript 引擎就认为不存在块级作用域。

示例:

例如像下面这样写会报错:

// 声明函数
if (true)
    let func = function () {};

// 声明变量
if (true) let a = 1;

报错信息如下所示:

SyntaxError: Lexical declaration cannot appear in a single-statement context

上述代码中因为没有大括号,所以不存在块级作用域,不管是声明函数还是声明变量都会报错。

点赞
收藏
评论区
推荐文章
Dax Dax
4年前
JS核心原理理解闭包
前置概念在正式看闭包之前,我们先来学习一下前置知识,那就是JS中的作用域,我们知道,在ES5之中,作用域分为两种:全局作用域和函数作用域,随着ES6的到来,新增了块级作用域,想更好的理解闭包,那么搞清楚作用域是首要条件全局作用域我们知道,对于变量而言,我们一般会分成两类:全局变量和局部变量,一般定义在最外围环境的为全局变量,定义在函数当中的为局部变量,在we
Souleigh ✨ Souleigh ✨
4年前
JS - 作用域
一、作用域作用域,即变量(变量作用域又称上下文)和函数生效(能被访问)的区域或集合换句话说,作用域决定了代码区块中变量和其他资源的可见性举个例子function myFunction(){    let inVariable  "函数内部变量";}myFunction();//要先执行这个函数,否则根本不知
Karen110 Karen110
3年前
一篇文章带你了解JavaScript作用域
在JavaScript中,对象和函数也是变量。在JavaScript中,作用域是你可以访问的变量、对象和函数的集合。JavaScript有函数作用域:这个作用域在函数内变化。一、本地JavaScript变量一个变量声明在JavaScript函数内部,成为函数的局部变量。局部变量有局部作用域:它们只能在函数中访问。JS://codeherecann
菜园前端 菜园前端
2年前
为你解惑JS作用域和作用域链知识
原文链接:变量作用域一个变量的作用域(scope)是程序源代码中定义这个变量的区域。全局变量拥有全局作用域,在JavaScript代码中的任何地方都是可以访问的。然而在函数内声明的变量只能在函数体内访问,它们是局部变量,作用域是局部性的。函数参数也是局部变
Jacquelyn38 Jacquelyn38
4年前
你所知道的JS变量作用域
变量的作用域,指的是变量在脚本代码中的可读、可写的有效范围,也就是脚本代码中可以使用这个变量的区域。在ES6之前,变量的作用域主要分为全局作用域、局部作用域(也称函数作用域)两种;在ES6及其之后,变量的作用域主要分为全局作用域、局部作用域、块级作用域这3种。相应作用域变量分别称为全局变量、局部变量、块级变量。全局变量声明在所有函数之外;局部变量是在函数体内
Wesley13 Wesley13
3年前
JAVA记录
singleton作用域:当把一个Bean定义设置为singleton作用域是,SpringIoC容器中只会存在一个共享的Bean实例,并且所有对Bean的请求,只要id与该Bean定义相匹配,则只会返回该Bean的同一实例。值得强调的是singleton作用域是Spring中的缺省作用域。prototype作用域:protot
Stella981 Stella981
3年前
ES6 新特性之 let, const : JavaScript在变量方面的改进。
let:块级作用域我们知道,JavaScript是没有块级作用域的,如果在块内使用var声明一个变量,它在代码块外面仍旧是可见的:if(true){varfoo3;}console.log(foo);//3for(vari0
Stella981 Stella981
3年前
Python的四种作用域及调用顺序
↑关注星标 ~从此不迷路,后台回复【礼包】送你Python自学资料作用域又可以被称为命名空间,指变量起作用的范围。Python变量作用域可以分为四种,分别为局部作用域、嵌套作用域、全局作用域、内置作用域。作用域英文简写局部作用域LocalL嵌套作用域EnclosedE全局作用域Global
Wesley13 Wesley13
3年前
ES6 简单整理
1.变量声明let和constlet与const都是块级作用域,letfunctionname(){letage12;//age只在name()函数中存在}constconstname'tom'name'jack'//
Stella981 Stella981
3年前
JavaScript作用域
一、JavaScript中无块级作用域在Java或C中存在块级作用域,即:大括号也是一个作用域。!(https://oscimg.oschina.net/oscnet/ea3e9460a4d20056c59315db47e2a0cbc2b.jpg)!(https://oscimg.oschina.ne
小万哥 小万哥
1年前
Python 作用域:局部作用域、全局作用域和使用 global 关键字
变量只在创建它的区域内可用。这被称为作用域。局部作用域在函数内部创建的变量属于该函数的局部作用域,并且只能在该函数内部使用。示例:在函数内部创建的变量在该函数内部可用:pythondefmyfunc():x300print(x)myfunc()函数内部的函