ES6新特性--var、let、const

栏目: JavaScript · 发布时间: 5年前

内容简介:1、 var、let、const2、const在声明时需要赋值且无法修改,但如果常量是对象,则对象的属性可以修改3、TDZ暂存性死区

1、 var、let、const

var不存在块级作用域,具有变量提升机制。
let和const存在块级作用域,不存在变量提升。在同一作用域内只能声明一次。
## var的说明 ##
function a(flag){
    if(flag){
        console.log(value);      //结果为undefined,已声明但未初始化
        var value=1;
        return value;
    }else{
        console.log(value);      //仍旧可以访问到value;值为undefined
    }
}
//上述代码等价于
function a(flag){
    var value;
    if(flag){
        value=1;
        return value;
    }else{
        console.log(value);      //仍旧可以访问到value;值为undefined
    }
}
## let说明 ##
function a(flag){
    if(flag){
        console.log(value);       // 报错,因为value此时位于TDZ(后面讲)内,无法访问
        let value=1;
        return value;
    }else{
        console.log(value);      //value is not defined
    }
}
## const说明 ##
function a(flag){
    if(flag){
        console.log(value);       // 报错,因为value此时位于TDZ(后面讲)内,无法访问
        const value=1;        //const必须在声明的时候初始化,并且其值无法被重新赋值
        return value;
    }else{
        console.log(value);      //value is not defined
    }
}

2、const在声明时需要赋值且无法修改,但如果常量是对象,则对象的属性可以修改

const obj={
    name:'Alisa',
    age:25
}
obj=23;        //报错
obj.age=23;    //允许修改

3、TDZ暂存性死区

JavaScript引擎在扫描代码发现变量声明时,如果是使用var声明的变量,则讲变量提升至作用域顶部;如果是采用let和const声明的变量,则将其放到TDZ中。访问TDZ中的变量会触发运行时错误,只有执行过变量声明语句后,变量才会从TDZ中移出,然后才可以正常访问。 注意: 其针对的是let和const所在的块级作用域。

if(flag){
    console.log(typeof value);     //引用错误
    let value='time';
}

console.log(typeof value);         //undefined
if(flag){
    console.log(typeof value);     //引用错误
    let value='time';
}

4、let、const在循环中的应用

//输出0-9
var funcs=[];
for(let i=0;i<10;i++){
    funcs.push(function(){
        console.log(i);
    })
}
funcs.forEach(function(func){
    func();        //输出0-9
})
//将上面的let变为const则会报错,因为i++操作试图修改const声明的常量
//遍历对象
var person={
    name:"Alisa",
    age:23
};
for(let key in person){
    console.log(key);    //输出name、age
}
//将上面的let换位const不会报错,因为每次key的值并不相同,即每次定义一个新的变量

5、var可能修改全局属性(如浏览器环境下的window对象的属性),而let和const不会修改只是遮蔽

var RegExp='hello';
console.log(window.RegExp);       //"hello"
var say='hi';
console.log(window.say);          //"hi"

let RegExp='hello';
console.log(RegExp);       //"hello"
console.log(window.RegExp === RegExp);       //false

const say='hi';
console.log(say);          //"hi"
console.log(window.say);          //undefined

6、实际应用时的tips

使用块级绑定时:声明变量默认采用const,只有确实需要改变变量时才使用let。

在编程过程中如果需要变量提升则使用var声明变量,否则采用let和const声明变量,以便更好地控制作用域,避免变量的混用、不可控。


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Python核心编程(第3版)

Python核心编程(第3版)

[美] Wesley Chun / 孙波翔、李斌、李晗 / 人民邮电出版社 / 2016-5 / CNY 99.00

《Python核心编程(第3版)》是经典畅销图书《Python核心编程(第二版)》的全新升级版本,总共分为3部分。第1部分为讲解了Python的一些通用应用,包括正则表达式、网络编程、Internet客户端编程、多线程编程、GUI编程、数据库编程、Microsoft Office编程、扩展Python等内容。第2部分讲解了与Web开发相关的主题,包括Web客户端和服务器、CGI和WSGI相关的We......一起来看看 《Python核心编程(第3版)》 这本书的介绍吧!

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

HTML 编码/解码
HTML 编码/解码

HTML 编码/解码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换