在js中,定义变量时要使用var操作符,但是var有许多的缺点,如:一个变量可以重复声明、没有块级作用域、不能限制修改等。
//缺点1:变量可以重复声明 var a=1; var a=2; console.log(a); //2 //缺点2:无法限制修改 //缺点3:没有块级作用域 { var b=12; } console.log(b); //12
ES6新增的let和const就解决了这些问题。下面我们来看看let和const吧。
- let和const都不能重复声明
let a=1; let a=2; console.log(b); //SyntaxError: Identifier 'a' has already been declared
- let声明的是变量,值可以修改;const声明的是常量,不能修改
const a=1; a=2; console.log(a); //TypeError: Assignment to constant variable.
- 有块级作用域
var a=[]; for(var i=0; i<5;i++){ a[i] = function (){ console.log(i); } } a[2](); //5
上面这个例子中,变量i是var定义的,作用域是在全局,全局只有一个i,每一次循环,变量i的值都会+1,循环结束后,i的值为5。所有数组a的成员,a[0]...a[4]里面的i都是同一个,所以最后输出的是5。
let a=[]; for(let i=0; i<5;i++){ a[i] = function (){ console.log(i); } } a[2](); //2
上例中,i是用let声明的,仅在块级作用域有效。数组a的每一个成员都有一个自己的 i,所以最后输出的是2。
另外,值得注意的是,for循环设置循环变量的那部分是父作用域,循环体内是单独的子作用域。如下例。for(let i=0; i<2; i++){ let i=12; console.log(i); } //12 //12
- 不存在变量提升
console.log(a); //undefined var a = 1; console.log(b); //ReferenceError: b is not defined let b = 2;
var命令会出现变量提升的现象,即可以在声明之前使用变量,值为undefined。let 则不行,变量必须要在声明之后才能使用,否则就会向上例一样报错。
- const的本质
const并不是保证变量的值不能改变,而是变量指向的内存地址里面保存的数据不能发生改变。对于基本数据类型的数据,变量指向的内存地址中就直接保存它的值;对于复合类型的数据,如数组和对象,变量指向的内存地址中保存着的是一个指向实际数据的指针。const a = 12; //变量a指向的内存地址中存放着数字12 //person指向的内存地址中存放着的是对象的地址,const只能保证存着的这个对象地址不变, //但对象本身是可变的,可以修改属性等 const person = { name: 'lisi', age: 18 } person.age = 19; console.log(person.age); //19 person = {}; //TypeError: Assignment to constant variable.
- 顶层对象的属性
顶层对象在浏览器环境下指的是window对象。var a = 1; console.log(window.a); //1 let b = 2; console.log(window.b); //undefined
var和function声明的全局变量,依旧是window对象的属性,let和const、class声明的全局变量,不属于window对象的属性。