ES6学习笔记:块级作用域

作用域分类

• 全局作用域
• 局部作用域
• 块级作用域

全局作用域示例

var i=2;

for (var i = 0; i < 10; i++) {

}

console.log(i);//10

• 这里就出现了意料之外的结果,此种原因是变量提升造成过的

局部作用域示例

!(function () {

    console.log(b);//undefined

    var b = 2;

})()

• 为什么会输出undefined,而不是报错?
• 此种也是变量提升造成的意料之外的结果,上面代码等同于下面.

!(function () {

var b;

console.log(b);//undefined

b=2;

})()

这里就抛出来了一个问题,什么是变量提升?

JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。

JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。

ES6中引入了块级作用域的概念

//块级作用域使用方式

{

  //...code

}

注意:使用 var 声明变量不受块级作用域限制,依旧会造成的变量提升,因此

引入了两个新的变量

• let
  • 用法:声明一个变量
  • 特点:
    • 只在声明的代码块有效
    • 在同一作用域中不能重复声明
    • 没有变量提升
    • 暂时性死区
• const

  • 用法:声明一个只读变量(可理解为常量)

  • 特点:跟let一致

  • 注意事项:

    • 变量声明的同时必须立即赋值
    • 如声明的是简单类型数据,变量的值不可改变

  • 实质:保证变量指向的内存地址所保存的数据不允许变动

    简单类型如字符串,数字,布尔值,复杂类型如对象,数组,函数,所以const声明复杂类型对象时需慎重

使用示例

• 示例1

if(true){

    var a=10;

}

console.log(a);//10

• 示例2

if(true){

    let a=10;

}

console.log(a);//error: a is not defined

• 示例3

{

    let a=2;

}

{

    let a=3;

    console.log(a);//3

}

• 示例4

{

    const a=2;

    console.log(a);//2

    a = 3;//error:"a" is read-only

}

• 示例5

{

    const obj={

        name:'小明',

        age:18

    }

    console.log(obj);//{name:"小明",age:18}

    obj.name="小红";

    console.log(obj);//{name:"小红",age:18}

}