首先来看看ES6新增的两个关键字:let,const 主要特性:
- let 声明的变量只在所在的代码块内有效(也就是let实现的是块级作用域)。
- const用于声明常量,一旦声明不能再次赋值修改。
ES6的let和const相同点和不同点比较图
代码示例
先来看看我们熟悉的ES5中var的一波操作先,来比较一下才能更好的学习:
1.var不同块级作用域下依然可以输出值
{
var test_var = "微信公众号:一颗剽悍的种子";
console.log(test_var);
}
console.log(test_var);
2.var在同一个作用域下重复声明,最后一个重复声明的赋值将覆盖前面的声明的赋值。
{
var test_var = "微信公众号:一颗剽悍的种子";
var test_var = "我把上面覆盖了";
console.log(test_var);
}
console.log(test_var);
3.var变量提升没问题(可以看出来这样很不严谨)
{
test_let = "看我看我,变量提升";
var test_let;
console.log(test_let);
}
再看let和const的共同点:
1. 只在当前代码块有效,否则会报错RefereceError
let
{
let test_let = "微信公众号:一颗剽悍的种子";
console.log(test_let);
}
console.log(test_let);
const
{
const test_const = "微信公众号:一颗剽悍的种子";
console.log(test_const);
}
console.log(test_const);
(下图:报的是同一个错误,但标识符会不同这里划掉,以免干扰)
2.相同作用域不能重复声明(所以不会出现上面var后面赋值的覆盖前面值的情况)
let
{
let test_let = "微信公众号:一颗剽悍的种子";
let test_let = "let不像var能覆盖前面的";
console.log(test_let);
}
const
{
const test_const = "微信公众号:一颗剽悍的种子";
const test_const = "const不像const能覆盖前面的";
console.log(test_const);
}
都会报同一个SyntaxError语法错误,意思是声明已声明标识符。
(下图:报的是同一个错误,但标识符会不同这里划掉,以免干扰)
3.变量不能提升会报ReferenceError
let
{
test_let = "微信公众号:一颗剽悍的种子";
let test_let
console.log(test_let);
}
const
{
test_const = "微信公众号:一颗剽悍的种子";
const test_const;
console.log(test_const);
}
let和const不同点:
先看let
1.使用let声明变量可以不用初始化
{
let test_let;
test_let = "微信公众号:一颗剽悍的种子";
console.log(test_let);
}
2.let赋值后值可以再赋值修改
{
let test_let = "微信公众号:一颗剽悍的种子";
test_let = "重新赋值啦";
console.log(test_let);
}
const
1.使用const声明必须初始化,否则会报错SyntaxError
{
const test_const;
test_const = "必须先初始化";
console.log(test_const);
}
2.const 定义常量赋值后不能再赋值修改,否则会报错SyntaxError
{
const test_const = "微信公众号:一颗剽悍的种子";
test_const = "再赋值修改";
console.log(test_const);
}
总结
从上面的var到let和const的比较可以看到,var可以的特性let和const基本都不可以,也就是说使用let和const比var有了更多的限制,但同时可以看到这些特性让代码更加规范和严谨。