80 lines
2.5 KiB
Plaintext
80 lines
2.5 KiB
Plaintext
---
|
|
title: Quais são as diferenças entre as variáveis criadas usando `let`, `var` ou `const`?
|
|
---
|
|
|
|
Variáveis declaradas usando a palavra-chave `var` têm escopo à função na qual foram criadas, ou se criadas fora de qualquer função, ao objeto global. `let` and `const` são _block scoped_, o que significa que eles só são acessíveis dentro do conjunto mais próximo de chaves (função, bloco if-else ou for-loop).
|
|
|
|
```js
|
|
function foo() {
|
|
// Todas as variáveis são acessíveis dentro de funções.
|
|
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 não é o console
|
|
console.log(baz); // ReferenceError: baz não é definido
|
|
console.log(qux); // ReferenceError: qux não é definido
|
|
```
|
|
|
|
```js
|
|
if (true) {
|
|
var bar = 'bar';
|
|
let baz = 'baz';
|
|
const qux = 'qux';
|
|
}
|
|
|
|
// var variáveis declaradas são acessíveis em qualquer lugar do escopo da função.
|
|
console.log(bar); // bar
|
|
// let e const defined variáveis não são acessíveis fora do bloco no qual eles foram definidos.
|
|
console.log(baz); // Referência: baz não está definido
|
|
console.log(qux); // Referência: qux não está definido
|
|
```
|
|
|
|
'var' permite que as variáveis sejam hoisted, o que significa que elas podem ser referenciadas no código antes de serem declaradas. 'let' e 'const' não permitirão isso, em vez disso, será lançado um erro.
|
|
|
|
```js
|
|
console.log(foo); // undefined
|
|
|
|
var foo = 'foo';
|
|
|
|
console.log(baz); // ReferenceError: não pôde acessar o console da declaração léxico 'baz' antes da inicialização
|
|
|
|
let baz = 'baz';
|
|
|
|
console.log(bar); // ReferenceError: não é possível acessar a declaração léxico 'bar' antes da inicialização
|
|
|
|
const bar = 'bar';
|
|
```
|
|
|
|
Redeclarar uma variável com `var` não causará um erro, mas `let` e `const` irá.
|
|
|
|
```js
|
|
var foo = 'foo';
|
|
var foo = 'bar';
|
|
console.log(foo); // "bar"
|
|
|
|
let baz = 'baz';
|
|
let baz = 'qux'; // Uncaught SyntaxError: Identifier 'baz' já foi declarado
|
|
```
|
|
|
|
`let` e `const` diferem que `let` permite reatribuir o valor da variável enquanto `const` não.
|
|
|
|
```js
|
|
// Tudo bem.
|
|
let foo = 'foo';
|
|
foo = 'bar';
|
|
|
|
// Isso causa uma exceção.
|
|
const baz = 'baz';
|
|
baz = 'qux';
|
|
```
|
|
|
|
## Notas
|
|
|
|
- Como a maioria dos navegadores suportam `let` e `const` atualmente, usar `var` não é mais recomendado. Se você precisa dar suporte a navegadores mais antigos, escreva seu código usando `let` e use um transpiler como o Babel para compilar seu código para uma sintaxe mais antiga.
|