0%

使用let、var和const创建变量有什么区别?

var声明的变量的作用域是它当前的执行上下文,它可以是嵌套的函数,也可以是声明在任何函数外的变量。letconst是块级作用域,意味着它们只能在最近的一组花括号(function、if-else 代码块或 for 循环中)中访问。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function foo() {
// 所有变量在函数中都可访问
var bar = 'bar';
let baz = 'baz';
const qux = 'qux';

console.log(bar); // bar
console.log(baz); // baz
console.log(qux); // qux
}

console.log(bar); // ReferenceError: bar is not defined
console.log(baz); // ReferenceError: baz is not defined
console.log(qux); // ReferenceError: qux is not defined
1
2
3
4
5
6
7
8
9
10
11
if (true) {
var bar = 'bar';
let baz = 'baz';
const qux = 'qux';
}

// 用 var 声明的变量在函数作用域上都可访问
console.log(bar); // bar
// let 和 const 定义的变量在它们被定义的语句块之外不可访问
console.log(baz); // ReferenceError: baz is not defined
console.log(qux); // ReferenceError: qux is not defined

var会使变量提升,这意味着变量可以在声明之前使用。letconst不会使变量提升,提前使用会报错。

1
2
3
4
5
6
7
8
9
10
11
console.log(foo); // undefined

var foo = 'foo';

console.log(baz); // ReferenceError: can't access lexical declaration 'baz' before initialization

let baz = 'baz';

console.log(bar); // ReferenceError: can't access lexical declaration 'bar' before initialization

const bar = 'bar';

var重复声明不会报错,但letconst会。

1
2
3
4
5
6
var foo = 'foo';
var foo = 'bar';
console.log(foo); // "bar"

let baz = 'baz';
let baz = 'qux'; // Uncaught SyntaxError: Identifier 'baz' has already been declared

letconst的区别在于:let允许多次赋值,而const只允许一次。

1
2
3
4
5
6
7
// 这样不会报错。
let foo = 'foo';
foo = 'bar';

// 这样会报错。
const baz = 'baz';
baz = 'qux';

全局作用域下,使用var声明的变量会挂载到window对象上,使用letconst声明的变量不会挂载到window对象上

1
2
3
4
5
6
let a = 10;
const b = 20;
var c =30;
window.a; // undefined
window.b; // undefined
window.c; // 30
-------------本文结束感谢您的阅读-------------