Variáveis de JS

4 maneiras de declarar uma variável JavaScript:

• Usando var

• Usando let

• Usando const

• Usando nada

O que são variáveis?

Variáveis são contêineres para armazenamento de dados (armazenamento de valores de dados).

Neste exemplo, x, y e z são variáveis, declarada com a var palavra-chave:

Exemplo:


    var x = 5;
    var y = 6;
    var z = x + y;
    

Neste exemplo, x, y e z são variáveis, declarada com a let palavra-chave:

Exemplo:


    let x = 5;
    let y = 6;
    let z = x + y;
    

A partir dos exemplos acima, você pode adivinhar:

• x armazena o valor 5

• y armazena o valor 6

• z armazena o valor 11

Quando usar var

As palavras-chave var foram usadas em todos os códigos escritos antes de 2015.

As palavras-chave let e const foram adicionadas ao JavaScript em 2015.

Se quiser que seu código seja executado em um navegador mais antigo, você deve usar var.

Neste exemplo, price1, price2 e total são variáveis:

Exemplo:


    const price1 = 5;
    const price2 = 6;
    let total = price1 + price2;
    

Ambos os preços são declarados com a const palavra - chave.

Por isso, os preços são valores constantes.

Os valores constantes não podem ser reatribuídos (alterados).

Ainda assim, price1 e price2 são chamados de variáveis.

Apenas como álgebra

Assim como na álgebra, as variáveis contêm valores:


    let x = 5;
    let y = 6;
    

Assim como na álgebra, as variáveis são usadas em expressões:


    let z = x + y;
    

A partir do exemplo acima, você pode adivinhar que o total é calculado em 11.

Observação

Variáveis são contêineres para armazenar valores de dados.

Identificadores JavaScript

Todas as variáveis JavaScript devem ser identificadas com nomes exclusivos.

Esses nomes exclusivos são chamados de identificadores.

Os identificadores podem ser nomes curtos (como x e y) ou nomes mais descritivos (idade, soma, volume total).

As regras gerais para construir nomes para variáveis (identificadores únicos) são:

• Os nomes podem conter letras, dígitos, sublinhados e cifrões.

• Os nomes devem começar com uma letra

• Os nomes também podem começar com $ e _ (mas não os usaremos neste tutorial)

• Os nomes diferenciam maiúsculas de minúsculas (y e Y são variáveis diferentes)

• Palavras reservadas (como palavras-chave JavaScript) não podem ser usadas como nomes

Observação

Os identificadores de JavaScript diferenciam maiúsculas de minúsculas.

O Operador de Atribuição

Em JavaScript, o sinal de igual ( =) é um operador de "atribuição", não um operador "igual a".

Isso é diferente de álgebra. O seguinte não faz sentido em álgebra:


    x = x + 5
    

Em JavaScript, entretanto, faz todo o sentido: atribui o valor de x + 5 a x.

(Ele calcula o valor de x + 5 e coloca o resultado em x. O valor de x é incrementado em 5.)

Observação

O operador "igual a" é escrito como == em JavaScript.

Tipos de dados JavaScript

Variáveis JavaScript podem conter números como 100 e valores de texto como "John Doe".

Na programação, os valores de texto são chamados de strings de texto.

JavaScript pode lidar com muitos tipos de dados, mas por enquanto, pense apenas em números e strings.

As strings são escritas entre aspas duplas ou simples. Os números são escritos sem aspas.

Se você colocar um número entre aspas, ele será tratado como uma string de texto.

Exemplo:


    const pi = 3.14;
    let person = "John Doe";
    let answer = 'Yes I am!';
    

Declarando (criando) variáveis JavaScript

A criação de uma variável em JavaScript é chamada de "declaração" de uma variável. Você declara uma variável JavaScript com a var palavra-chave:

    var carName;
    

Após a declaração, a variável não tem valor (tecnicamente tem o valor de undefined).

Para atribuir um valor à variável, use o sinal de igual:


    carName = "Volvo";
    

Você também pode atribuir um valor à variável ao declará-la:


    var carName = "Volvo";
    

No exemplo abaixo, criamos uma variável chamada carNamee atribuímos o valor "Volvo" a ela.

Em seguida, "exibimos" o valor dentro de um parágrafo HTML com id = "demo":

Exemplo:


    <p id="demo"><p>
    <script>
    var carName = "Volvo";
    document.getElementById("demo").innerHTML = carName;
    <script>
    

É uma boa prática de programação declarar todas as variáveis no início de um script.

Uma afirmação, muitas variáveis

Você pode declarar muitas variáveis em uma instrução.

Comece a instrução com var e separe as variáveis por vírgula:

Exemplo:


    let person = "John Doe", carName = "Volvo", price = 200;
    

Uma declaração pode abranger várias linhas:

Exemplo:


    let person = "John Doe",
    carName = "Volvo",
    price = 200;
    

Valor = indefinido

Em programas de computador, as variáveis são freqüentemente declaradas sem um valor. O valor pode ser algo que precisa ser calculado ou algo que será fornecido posteriormente, como uma entrada do usuário.

Uma variável declarada sem um valor terá o valor undefined.

A variável carName terá o valor undefined após a execução desta instrução:

Exemplo:


    var carName;
    

Re-declaração de variáveis JavaScript

Se você declarar novamente uma variável JavaScript, ela não perderá seu valor.

A variável carName ainda terá o valor "Volvo" após a execução dessas instruções:

Exemplo:


    var carName = "Volvo";
    var carName;
    

JavaScript Aritmética

Assim como na álgebra, você pode fazer aritmética com variáveis JavaScript, usando operadores como = e +:

Exemplo:


    var x = 5 + 2 + 3;
    

Você também pode adicionar strings, mas as strings serão concatenadas:

Exemplo:


    var x = "John" + " " + "Doe";
    

Experimente também:

Exemplo:


    var x = "5" + 2 + 3;
    

Se você colocar um número entre aspas, o resto dos números serão tratados como strings e concatenados.

Agora tente isto:

Exemplo:


    var x = 2 + 3 + "5";
    

Cifrão JavaScript $

Lembre-se de que os identificadores (nomes) JavaScript devem começar com:

• Uma letra (AZ ou az)

• Um cifrão ($)

• Ou um sublinhado (_)

Como o JavaScript trata o cifrão como uma letra, os identificadores que contêm $ são nomes de variáveis válidos:

Exemplo:


    var $$$ = "Hello World";
    var $ = 2;
    var $myMoney = 5;
    

Usar o cifrão não é muito comum em JavaScript, mas os programadores profissionais costumam usá-lo como um apelido para a função principal em uma biblioteca JavaScript.

Na biblioteca JavaScript jQuery, por exemplo, a função principal $ é usada para selecionar elementos HTML. Em jQuery $ ("p"); significa "selecionar todos os elementos p".

Sublinhado de JavaScript (_)

Como o JavaScript trata o sublinhado como uma letra, os identificadores que contêm _ são nomes de variáveis válidos:

Exemplo:


    var _lastName = "Johnson";
    var _x = 2;
    var _100 = 5;
    

Usar o sublinhado não é muito comum em JavaScript, mas uma convenção entre os programadores profissionais é usá-lo como um apelido para variáveis "privadas (ocultas)".

Fonte: w3schools