使用`let`、`var`或`const`创建的变量之间有什么差异?
Topics
JAVASCRIPT
在GitHub上编辑
使用var
关键字声明的变量的作用范围是创建这些变量的函数。 或者如果是在任何函数之外创建的,则是全局对象。 let
和 const
是 block scoped, 意思是它们只能在最近的一组大括号内(函数, if-else 块, 或循环块)。
function foo() {// All variables are accessible within functions.var bar = 'bar';let baz = 'baz';const qux = 'qux';console.log(bar); // barconsole.log(baz); // bazconsole.log(qux); // qux}console.log(bar); // ReferenceError: bar is not definedconsole.log(baz); // ReferenceError: baz is not definedconsole.log(qux); // ReferenceError: qux is not defined
if (true) {var bar = 'bar';let baz = 'baz';const qux = 'qux';}// var declared variables are accessible anywhere in the function scope.console.log(bar); // bar// let and const defined variables are not accessible outside of the block they were defined in.console.log(baz); // ReferenceError: baz is not definedconsole.log(qux); // ReferenceError: qux is not defined
var
允许变量被提升,这意味着它们可以在声明之前用代码引用。 let
和 const
将不允许这样做,而是抛出一个错误。
console.log(foo); // undefinedvar foo = 'foo';console.log(baz); // ReferenceError: can't access lexical declaration 'baz' before initializationlet baz = 'baz';console.log(bar); // ReferenceError: can't access lexical declaration 'bar' before initializationconst bar = 'bar';
用 var
重新声明变量不会产生错误,而 let
和 const
会。
var foo = 'foo';var foo = 'bar';console.log(foo); // "bar"let baz = 'baz';let baz = 'qux'; // Uncaught SyntaxError: Identifier 'baz' has already been declared
let
和 const
不同于let
允许重新分配变量的值,而const
不允许。
// This is fine.let foo = 'foo';foo = 'bar';// This causes an exception.const baz = 'baz';baz = 'qux';
备注
- 由于大多数浏览器在现如今都支持
let
和const
,因此不再推荐使用var
。 如果您需要针对较旧的浏览器,请使用let
写代码,并使用像 Babel 这样的转译器将您的代码编译成旧的语法。