ES6的新特性

本文深入探讨了ECMAScript 6(ES6)的新特性,包括let和const声明变量的规则,块级作用域的引入及其重要性,const声明常量的注意事项,以及Promise解决异步回调问题的方式。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

ECMAScript和JavaScript的关系:

前者是后者的规格,后者是前者的一种实现。

Babel是一个广为使用的ES6转码器,可以将ES6代码转为ES5代码,从而在浏览器或其他执行环境执行。

ES6新增了let命令,用于声明变量。其用法类似于var,但是所声明的变量只在let命令所在的代码块内有效。

let不像var那样会发生“变量提升”现象,所以变量一定要在声明后使用,否则报错。

console.log(a);
let a = 5;//报错
console.log(a);
var a = 5;//undefined

暂时性死区:

ES6明确规定:如果区块中存在let和const命令,则这个区块对这些命令声明的变量从一开始就形成封闭作用域,只要在声明之前就使用这些变量,就会报错。总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。

if(true){
    tep:'abc';
    console.log(tep);//referenceError

    let tep;
    console.log(tep);//undefined
}

let不允许重复声明

function(){
    let a = 10;
    var a = 8;
}//报错

ES5只有全局作用域和函数作用域,没有块级作用域,为什么ES6要引入块级作用域呢?

第一种场景:内层变量可能会覆盖外层变量

var tmp = new Date();
		function fn1() {
			console.log(tmp);
			if (false) {
				var tmp = 'hello world';
			}
		}
		fn1();//undefined

上面的代码中,函数fn1执行后,输出结果为undefined,原因在于变量提升导致内层的tmp变量覆盖了外层的tmp变量。

第二种场景:用来计数的循环变量泄露为全局变量。

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

ES6的块级作用域

function f1() {
			let n = 5;
			if (true) {
				let n = 10;
			}
			console.log(n);
			// body...
		}
		f1();//5

上面的函数有两个代码块,都声明了变量n,运行后输出5,这表示外层代码块不受内层代码块的影响。如果使用var定义变量n,最后输出的值就是10;外层作用域无法读取内层作用域的变量

const命令

const用来声明常量,一旦声明,其值不能改变。否则会报错。const声明的常量不得改变值,这意味着,const一旦声明常量,就必须立即初始化,不能留到以后赋值。对于const而言,只声明不赋值就会报错。

const的作用域与let命令相同:只在声明所在的块级作用域内有效。

const命令声明的常量也不提升,同样存在暂时性死区,只能在声明后使用。如果在声明之前就调用,则会报错。

与let一样,const也不可重复声明常量。

对于复合类型的变量,变量名不指向数据,而是指向数据所在的地址。const命令只是保证变量名指向的地址不变,并不保证该地址的数据不变,所以将一个对象声明为常量必须非常小心。

const foo = {};
foo.prop = 123;
foo.prop;//123
foo = {}//报错  foo is read-only不起作用


const a = [];
a.push("Hello");//可执行
a.length = 0;//可执行
a = ["Dave"];//报错

上面的代码,常量foo储存的是一个地址,指向一个对象。不可变的只是这个地址,即不能把foo指向另一个地址,但本身对象是可变的,所以依然可以为其添加新属性。

常量a是一个数组,这个数组本身是可写的,但如果将另一个数组赋值给a,就会报错

如果真的想将对象冻结,应该使用object.freeze方法

const foo = object.freeze({});

foo.prop = 123;//不起作用

上面的代码,常量foo指向一个冻结的对象,所以添加新的属性不起作用。

ES5中只有两种声明变量的方法,var命令和function命令,ES6中添加了let和const命令,还有import命令和class命令,所以ES6一共有6种声明变量的方法。

跨模块常量

上面说过,const声明的常量只在当前代码块有效,如果想要设置跨模块的常量,可以采用下面的写法

//constants.js模块
export const A = 1;
export const B = 2;
export const C = 3;


//test1.js模块
import * as constants from './constants';
console.log(constants.A);//1

//test2.js模块
import {A,B} from './constants';
console.log(A);//1

全局对象的属性

ES6规定,var命令和function命令声明的全局变量依旧是全局对象的属性;let命令、const命令和class命令声明的全局变量不属于全局对象的属性

var a = 1;
window.a//1

let b = 1;
window.b//undefined

Promise:

作用:解决异步回调问题

传统方式:用回调函数,事件

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值