javascript中var、let和const的区别

在javascript中,var、let和const都可以用来声明变量,那么三者有什么区别呢?要回答这个问题,我们可以从先想想:三种不同的声明会影响变量的哪些方面?这些方面也就是变量的特性,那么变量有哪些特呢?无非就是两个:一个是变量的数据类型,是数字,字符串还是数组或者其他的,另一个就是变量的作用域,是全局的还是局部的,又或者是某个代码块的。因此我们可以从以下两个方面来探究三种声明方式的区别:

1.声明后变量的数据类型有什么不同?

2.声明后变量的作用域有什么不同?

先看第一个方面,数据类型有何不同

     //声明数字有何不同
var n1 = 10;
let n2 = 10;
const n3 = 10;
console.log(typeof n1); //number
console.log(typeof n2); //number
console.log(typeof n3); //number //声明字符串有何不同
var s1 = "hello";
let s2 = "hello";
const s3 = "hello";
console.log(typeof s1); //string
console.log(typeof s2); //string
console.log(typeof s3); //string //声明数组有何不同
var arr1 = [1,2,"a"];
let arr2 = [1,2,"a"];
const arr3 = [1,2,"a"];
console.log(typeof arr1); //object
console.log(typeof arr2); //object
console.log(typeof arr3); //object
console.log(arr1 instanceof Array); //true,判断是否是数组
console.log(arr2 instanceof Array); //true
console.log(arr3 instanceof Array); //true //声明对象有何不同
var o1 = {1:"a",2:"b"};
let o2 = {1:"a",2:"b"};
const o3 = {1:"a",2:"b"};
console.log(typeof o1); //object
console.log(typeof o2); //object
console.log(typeof o3); //object ////声明后不设置初始值有何不同
var u1;
let u2;
// const u3; //报错,const声明变量必须设置初始值
console.log(typeof u1); //undefined
console.log(typeof u2); //undefined
// console.log(typeof u3);

可以看到,三种声明方式不管是声明数字、数组、对象都没有差别,但是在声明后不设置初始值时有一点不同,var和let可以声明后不设置初始值,而const不行。

再来看声明后作用域有何不同,先看最常见的var

 var a = 1;
f();
console.log(a); //
function f() {
console.log(a); //undefined
var a = 10;
console.log(a); //
}

执行后结果为

undefined
10
1

可以看到用var声明的变量在函数外声明是全局变量,在函数内声明是局部变量,只能在函数内使用,第5行console.log(a)在声明的后面,所以会打印undefined,注意这里解释器会检测到函数f内定义

了a,所以会打印undefined,如果把第6,7行注释掉,那么函数内会直接引用外部的全局变量,打印的都是1。

let是ES6中新增的命令,那么let与var有什么区别呢,来看一段代码

<script>
for (var i=0;i<5;i++) {
console.log(i)
}
console.log(i)
</script> //执行结果
0
1
2
3
4
5
{
var i = 1;
}
console.log(i);
1

可以看到,这里再次证明了var声明的是全局变量,不受块级作用域(花括号)的限制。而let的作用域仅限于块级作用域

{
let i = 1
}
console.log(i); //ReferenceError: i is not defined

看到这里你大概可以想到了,let可以用于for循环,完成一些独特的功能,来看一道面试题

for (var i =0;i < 10; i++) {
setTimeout(function () {
console.log(i);
},0)
} //输出结果
//10个10

如果把var改成let,结果会怎样呢

for (let i =0;i < 10; i++) {  //在for循环(块级作用域)内部使用,变量会被固定
setTimeout(function () {
console.log(i); //i是循环体内的变量,不受外界影响
},0)
} //输出结果
//0 1 2 3 4 5 6 7 8 9

ES6 明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。
总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。

let的另一个区别是不能重复声明。

const意为constant variable,也就是固定的变量,不能被重新赋值,且需要在初始化时给其指定值,要不然会报错

const b=0;
b=1; //TypeError: Assignment to constant variable.
console.log(b); let hello = "hello world";
console.log(hello);
let hello = "world"; // SyntaxError: Identifier 'hello' has already been declared

总结

1. var定义的变量是全局变量,可以修改,可以重复定义,不初始化会输出undefined

2. let定义的变量仅作用于块级作用域(不受外界影响),可以修改,但不能重复定义,不初始化会输出undefined

3. const定义的变量是全局变量,不能修改,不能重复定义,不初始化会报错

上一篇:异常configure: *** apu library not found.


下一篇:CCI4.4/LintCode Balanced Binary Tree, Binary Tree, Binary Search Tree