Agradecemos por acompanhar o Google I/O. Assista ao conteúdo sob demanda.

Esta página foi traduzida pela API Cloud Translation.

Variáveis

As variáveis são uma estrutura de dados que atribui um nome representativo a um valor. Eles podem conter dados de qualquer tipo.

O nome dela é chamado de identificador. Deve haver um identificador válido estas regras:

Os identificadores podem conter letras Unicode, cifrões ($), sublinhado caracteres (_), dígitos (0-9) e até mesmo alguns caracteres Unicode.
Os identificadores não podem conter espaços em branco, porque o analisador usa espaços em branco para elementos de entrada separados. Por exemplo, se você tentar chamar uma variável my Variable em vez de myVariable, o analisador vê dois identificadores, my e Variable, e gera um erro de sintaxe ("token inesperado: identificador").
Os identificadores precisam começar com uma letra, sublinhado (_) ou cifrão ($). Não podem começar com dígitos, para evitar confusão entre números e identificadores:
```
let 1a = true;

> Uncaught SyntaxError: Invalid or unexpected token
```
Se o JavaScript permitesse números no início de um identificador, identificadores compostos apenas de números, causando conflitos entre números usados como números e números usados como identificadores:
```
let 10 = 20

10 + 5
> ?
```
"Palavras reservadas" que já são sintaticamente significativos não podem ser usados como identificadores.
Os identificadores não podem conter caracteres especiais (! . , / \ + - * =).

As regras a seguir não são rígidas para a criação de identificadores, práticas recomendadas do setor que facilitam a manutenção do código. Caso suas tem padrões diferentes, siga-os para manter a consistência.

Seguindo o exemplo definido pelos métodos e propriedades integrados do JavaScript, camelCase (também estilizado como "camelCase") é uma convenção muito comum para identificadores compostos por várias palavras. CamelCase é a prática de letras maiúsculas na primeira letra de cada palavra, exceto a primeira para melhores facilitar a leitura sem espaços.

let camelCasedIdentifier = true;

Alguns projetos usam outras convenções de nomenclatura dependendo do contexto e da natureza dos dados. Por exemplo, a primeira letra de uma class normalmente são maiúsculas, então nomes de classe com várias palavras costumam usar uma variante de camelo que é comumente chamado de ou caso da Pascal.

class MyClass {

}

Os identificadores devem descrever de forma concisa a natureza dos dados que contêm (por exemplo, currentMonthDays é um nome melhor que theNumberOfDaysInTheCurrentMonth) e ler rapidamente (originalValue é melhor que val). A Os identificadores myVariable usados neste módulo funcionam no contexto de isolados, mas não seriam muito úteis no código de produção porque não fornecem informações sobre os dados que elas contêm.

Os identificadores não devem ser muito específicos sobre os dados que contêm, porque seus valores podem mudar dependendo de como os scripts agem sobre esses dados ou decisões dos mantenedores futuros. Por exemplo, uma variável originalmente com a o identificador miles pode precisar ser alterado para um valor em quilômetros mais tarde em projeto, exigindo que os mantenedores alterem quaisquer referências a essa variável para evitar confusões futuras. Para evitar isso, use distance como seu identificador como alternativa.

O JavaScript não dá privilégios ou significados especiais aos identificadores que começam com caracteres sublinhados (_), mas costumam ser usados para mostrar que uma variável, um método ou uma propriedade é "private", ou seja, ela só foi projetada para uso no contexto do objeto que a contém e não deve ser acessados ou modificados fora desse contexto. Essa é uma convenção que se estende de outras linguagens de programação e antecede a adição da propriedades particulares.

Declaração de variável

Há várias formas de fazer com que o JavaScript reconheça um identificador, um processo chamada de "declaração", uma variável. Uma variável é declarada usando let, const, ou var palavras-chave.

let myVariable;

Use let ou var para declarar uma variável que pode ser modificada a qualquer momento. Esses as palavras-chave dizem ao intérprete de JavaScript que uma string de caracteres é uma identificador que pode conter um valor.

Ao trabalhar em uma base de código moderna, use let em vez de var. var ainda funciona em navegadores modernos, mas tem alguns comportamentos não intuitivos que foram definidos no as versões mais antigas do JavaScript e que não podiam ser alteradas posteriormente para preservar a compatibilidade com versões anteriores. let foi adicionado no ES6 para resolver alguns problemas com o design de var.

Uma variável declarada é inicializada atribuindo um valor a ela. Use um sinal de igual (=) para atribuir ou reatribuir um valor a uma variável. Você pode fazer como parte da mesma declaração que o declara:

let myVariable = 5;

myVariable + myVariable
> 10

Você também pode declarar uma variável com let (ou var) sem inicializá-la imediatamente. Se você fizer isso, o valor inicial da variável será undefined até que atribui um valor a ela.

let myVariable;

myVariable;
> undefined

myVariable = 5;

myVariable + myVariable
> 10

Uma variável com um valor undefined é diferente de uma variável indefinida cujo identificador ainda não foi declarado. Referenciar uma variável que você não declarado causa um erro.

myVariable
> Uncaught ReferenceError: myVariable is not defined

let myVariable;

myVariable
> undefined

A associação de um identificador a um valor geralmente é chamada de "vinculação". A sintaxe que segue as palavras-chave let, var ou const é chamada de "lista de encadernações", e permite várias declarações de variáveis separadas por vírgulas (terminando com o ponto e vírgula esperado). Isso faz com que os seguintes snippets de código funcionalmente idêntica:

let firstVariable,
     secondVariable,
     thirdVariable;

let firstVariable;
let secondVariable;
let thirdVariable;

A reatribuição do valor de uma variável não usa let (ou var), porque JavaScript já sabe que a variável existe:

let myVariable = true;

myVariable
> true

myVariable = false;

myVariable
> false

É possível reatribuir novos valores às variáveis com base nos valores atuais:

let myVariable = 10;

myVariable
> 10

myVariable = myVariable * myVariable;

myVariable
> 100

Se você tentar declarar novamente uma variável usando let em um ambiente de produção, você vai encontrar um erro de sintaxe:

let myVariable = true;
let myVariable = false;
> Uncaught SyntaxError: redeclaration of let myVariable

Navegadores ferramentas para desenvolvedores são mais permissivas sobre a declaração de let (e class). Por isso, talvez você não verá o mesmo erro no seu console do desenvolvedor.

Para preservar a compatibilidade com o navegador legado, o var permite uma nova declaração desnecessária sem erros em qualquer contexto:

var myVariable = true;
var myVariable = false;

myVariable\
> false

`const`

Use a palavra-chave const para declarar uma constante, um tipo de variável que precisa ser imediatamente inicializado e, em seguida, não pode ser alterado. Identificadores de constantes seguem as mesmas regras que as variáveis declaradas usando let (e var):

const myConstant = true;

myConstant
> true

Não é possível declarar uma constante sem atribuir um valor a ela imediatamente, porque constantes não podem ser reatribuídas depois de serem criadas, de modo que quaisquer constantes constante ficaria undefined para sempre. Se você tentar declarar uma constante sem inicializá-lo, ocorrerá um erro de sintaxe:

const myConstant;
Uncaught SyntaxError: missing = in const declaration

Tentar mudar o valor de uma variável declarada com const da maneira que você faria mudar o valor de uma variável declarada saga com let (ou var) faz com que um tipo erro:

const myConstant = true;

myConstant = false;
> Uncaught TypeError: invalid assignment to const 'myConstant'

No entanto, quando uma constante é associada a um objeto, as propriedades desse o objeto pode ser alterado.

const constantObject = { "firstvalue" : true };

constantObject
> Object { firstvalue: true }

constantObject.secondvalue = false;

constantObject
> Object { firstvalue: true, secondvalue: false }

Uma constante que contém um objeto é uma constante referência a um valor de dados mutável. Embora a constante não possa ser alterada, as propriedades da constante pode ser alterado, adicionado ou removido:

const constantObject = { "firstvalue" : true };

constantObject = false
> Uncaught TypeError: invalid assignment to const 'constantObject'

Quando você não espera que uma variável seja reatribuída, a prática recomendada é torná-la uma constante. O uso de const informa à equipe de desenvolvimento ou a futuros mantenedores de um projeto de não alterar esse valor, para evitar quebrar as suposições de seu código faz sobre como ela é usada - por exemplo, que uma variável acabará sendo avaliado em relação a um tipo de dados esperado.

Escopo de variáveis

O escopo de uma variável é a parte de um script em que ela está disponível. Fora do escopo de uma variável, ela não será definida, não como um identificador. contendo um valor undefined, mas como se ele não tivesse sido declarado.

Dependendo da palavra-chave usada para declarar uma variável e o contexto em que que você a define, é possível definir o escopo de variáveis para instruções de bloco (escopo de bloco), funções individuais (escopo da função) ou todo o aplicativo JavaScript (escopo global).

Escopo do bloco

Qualquer variável declarada usando let ou const tem o escopo mais próximo contendo uma instrução de bloco; ou seja, a variável só pode ser acessada dentro do bloco. Tentando acessar uma variável com escopo de bloco fora do bloco que a contém causa o mesmo erro como uma tentativa de acessar uma variável que não existe:

{
    let scopedVariable = true;
    console.log( scopedVariable );
}
> true

scopedVariable
> ReferenceError: scopedVariable is not defined

Para JavaScript, uma variável com escopo de bloco não existe. fora do bloco que a contém. Por exemplo, é possível declarar uma constante dentro de um bloco e depois declarar outra constante fora desse bloco que usa o mesmo identificador:

{
  const myConstant = false;
}
const myConstant = true;

scopedConstant;
> true

Embora uma variável declarada não possa se estender ao bloco pai, ela é disponível para todos os blocos descendentes:

{
    let scopedVariable = true;
    {
    console.log( scopedVariable );
    }
}
> true

O valor de uma variável declarada pode ser alterado a partir de um bloco descendente:

{
    let scopedVariable = false;
    {
    scopedVariable = true;
    }
    console.log( scopedVariable );
}
> true

Uma nova variável pode ser inicializada com let ou const dentro de uma descendente bloco sem erros, mesmo se usar o mesmo identificador que uma variável em um bloco pai:

{
    let scopedVariable = false;
    {
    let scopedVariable = true;
    }
    console.log( scopedVariable );
}
> false

Escopo da função

As variáveis declaradas usando var têm o escopo definido para a função mais próxima delas. ou bloco de inicialização estática dentro de uma classe.

function myFunction() {
    var scopedVariable = true;

    return scopedVariable;
}

scopedVariable;
> ReferenceError: scopedVariable is not defined

Isso continua ocorrendo depois que uma função é chamada. Embora o é inicializada enquanto a função é executada, essa variável ainda indisponível fora do escopo da função:

function myFunction() {
    var scopedVariable = true;

    return scopedVariable;
}

scopedVariable;
> ReferenceError: scopedVariable is not defined

myFunction();
> true

scopedVariable;
> ReferenceError: scopedVariable is not defined

Escopo global

Uma variável global está disponível em todo o aplicativo JavaScript, dentro de todos os blocos e funções, a qualquer script da página.

Embora isso possa parecer um padrão desejável, as variáveis que qualquer parte de um que o aplicativo pode acessar e modificar pode adicionar sobrecarga desnecessária ou até mesmo colisões com variáveis em outros lugares de um aplicativo com o mesmo identificador. Isso se aplica a todo e qualquer JavaScript envolvido na renderização de uma página, incluindo bibliotecas de terceiros e análises de usuários. Portanto, É uma prática recomendada para evitar a poluição do escopo global sempre que possível.

Qualquer variável declarada usando var fora de uma função pai, let ou const fora de um bloco pai é global:

var functionGlobal = true; // Global
let blockGlobal = true; // Global

{
    console.log( blockGlobal );
    console.log( functionGlobal );
}
> true
> true

(function() {
    console.log( blockGlobal );
    console.log( functionGlobal );
}());
> true
> true

Atribuir um valor a uma variável sem declará-lo explicitamente (ou seja, nunca usar var, let ou const para criá-la) elevará uma variável à escopo global, mesmo quando inicializado dentro de uma função ou bloco. Uma variável criado usando esse padrão é às vezes chamado de "global implícito".

function myFunction() {
    globalVariable = "global";

    return globalVariable
}

myFunction()\
> "global"

globalVariable\
> "global"

Elevação variável

Declarações de variáveis e funções são elevadas para o topo do escopo, ou seja, o intérprete JavaScript processa qualquer variável declarada em qualquer em um script e o move para a primeira linha do script antes de executar o script. Isso significa que uma variável declarada usando var pode ser referenciado antes de a variável ser declarada sem encontrar uma erro:

hoistedVariable
> undefined

var hoistedVariable;

Como somente a declaração de variável é hospedada, não a inicialização, variáveis que não foram declaradas explicitamente com var, let ou const não são elevados:

unhoistedVariable;
> Uncaught ReferenceError: unhoistedVariable is not defined

unhoistedVariable = true;

Como mencionado anteriormente, uma variável declarada, mas não inicializada, recebe o valor undefined. Esse comportamento se aplica a variáveis elevadas declarações, mas apenas para aquelas declaradas usando var.

hoistedVariable
> undefined

var hoistedVariable = 2 + 2;

hoistedVariable\
> 4

Esse comportamento não intuitivo é, em grande parte, uma restrição das decisões de design tomadas as versões mais antigas do JavaScript, e não podem ser alterados sem o risco de corromper sites que já existem.

let e const lidam com esse comportamento gerando um erro quando uma variável é acessada antes de ser criada:

{
    hoistedVariable;

    let hoistedVariable;
}
> Uncaught ReferenceError: can't access lexical declaration 'hoistedVariable' before initialization

Esse erro é diferente do erro "hoistedVariable não está definido" errone você pode esperar ao tentar acessar uma variável não declarada. Como o JavaScript elevou a variável, ela sabe que ela será criada escopo determinado. No entanto, em vez de disponibilizar a variável antes do com um valor de undefined, o intérprete vai gerar um erro. Variáveis declaradas com let ou const (ou class) existem em uma "zona morta temporal" ("TDZ") desde o início do seu bloco de inclusão até o no código em que a variável é declarada.

A zona inativa temporal torna o comportamento de let mais intuitivo do que var para autores. Ela também é fundamental para o design da const. Como as constantes não podem ser mudou, uma constante elevada para o topo de seu escopo e recebeu um valor implícito de undefined não podem ser inicializadas com um valor significativo.

Teste seu conhecimento

Com que tipos de caracteres é possível iniciar um identificador?

Uma letra

Um sublinhado

Um dígito

Qual é o método preferido de declarar uma variável cujo valor pode ser alterado a qualquer momento?

deixar

const

var