在es5中一般经常使用的变量有两个级别,一个是用var声明的全局级别的变量,另外一个是函数级别是用var生命在函数内的。本文中将详细讲解我对es6中的const和let的区别。
let的使用以及作用范围
let是块级变量,只有在自己声明的内部才会有作用。
'use strict'; { var a = 12; let b = 15; { console.log(a, b)//12 15没有问题的。 } } console.log(a,b) //12 defined a是全局变量在哪里输出都没有问题,然而b是块级变量所以只有在声明b的内部才会有效。
let的提升。下列代码中证明了let没有被提升 var 被提升了。
'use strict'; function fun() { // var a 相当于a提升到了这里定义了,但是未赋值。 console.log(a, b); //undefined defined 注意a是没有被赋值,而b是未定义,这说明a是向上提升了而b却没有提升。 // a = 12; a相当于在这里赋值了、 var a = 12; let b = 'b'; } fun();
let的提升以及作用范围。
'use strict'; var a = 12; function f() { console.log(a); //defined 因为在函数外部声明了a,然后在函数内部又声明了a,此时函数外部的a就会失效,但是函数内部的a又没有提升的功能所以会输出未定义; let a = 100; } f();
使用let代替匿名函数立即执行
'use strict'; (function () { var config = []; config.push(1); config.push(2); config.push(3); console.log(config) //1, 2, 3 })(); let configs; { configs = []; configs.push(4); configs.push(5); configs.push(6); console.log(configs) //4, 5, 6 }
const的使用
const是常数顾名思义,就是声明后无法修改的。请看下面的例子。
const的提升和作用范围和let几乎一样,在这里就不做过多的例了。
'use strict'; const a = { name: '铅笔' }; a = 100; //此时会报错
常量不代表所以得东西不能修改,除了a = 这个指向不能修改 a对象内部的属性和值都是可以修改的。
'use strict'; const a = { name: '铅笔' }; a.name = '黑白'; a.email = '48988840@qq.com'; console.log(a); // {name : '黑白, email : '48988840@qq.com'}
怎么让a和内部的东西不能修改呢?
'use strict'; const a = { name: '铅笔' }; Object.freeze(a); //a内部的所有属性和值都不能修改了。 a.name = '黑白'; // 报错 a.email = '48988840@qq.com'; // 报错 console.log(a); // {name : '黑白, email : '48988840@qq.com'}