ES6学习笔记(1)- 块级作用域

1. var声明变量和变量提升(Hoisting)机制的问题

 在JS中通过var关键字声明的变量,无论在函数作用域中亦或是全局作用域中,都会被当成当前作用域顶部的变量,和就是所谓的提升机制(Hoisting)。但是提升机制会带来一个问题就是,预编译阶段JS引擎会将变量提升至作用域顶部,但是初始化操作是在某个作用域中,进而导致了引用了该变量的其他作用域并没有被初始化,也就导致在浏览器看到undefined的结果。具体可看如下伪代码:

function printValue(condition) {
    if (condition) {
        var count = 10;
        console.log('if ' + count);
    } else {
         // 此处如果访问count,则会在控制台打印undefined
        console.log('else ' + count);
    }
    // 此处如果访问count,会在控制台打印10
    console.log('Out side of Scope ' + count);
}

printValue(true);
printValue(false);
function printValue(condition) {
    var count = 10;
    if (condition) {
        console.log('if ' + count);
    } else {
         // 此处如果访问count,则会在控制台打印undefined
        console.log('else ' + count);
    }
    // 此处如果访问count,会在控制台打印10
    console.log('Out side of Scope ' + count);
}

printValue(true);
printValue(false);

块级作用域的引入解决了上述问题,块级作用域存在于:

  • 函数内部;
  • { statements }之中;

那么如何声明块级作用域呢?ES6语法中引入了let声明,用法和var一致,但是可以把变量的作用域限制在当前的代码块中,也就顺带解决了Hoisting所带来的问题。

2. const声明

const声明的是常量,因此const声明常量的时候必须进行初始化。这里需要注意的是ES6语法中,如果使用const声明的是普通变量,那么是不可再被赋值修改的;但是如果定义的常量是对象,那么对象中的属性的值是可以修改的。

const company = {
   companyName: 'ABC Ltd',
   legalPerson: 'Nicholas'  
};

// 可以修改对象属性的值
company.companyName = 'XYZ Ltd';

// 下面则会抛出语法错误,这里需要注意的一个区别是直接给对象的属性重新赋值是改变了绑定,就会抛出错误
company = {
   companyName: 'XYZ Ltd',
   legalPerson: 'Nicholas'  
}

 

posted @ 2020-10-25 17:09  JieLongZ  阅读(155)  评论(0编辑  收藏  举报