Sem variáveis, as linguagens de programação são quase inúteis. Felizmente, o sistema de variáveis ​​do JavaScript é incrivelmente poderoso e versátil. Este artigo mostra como usar variáveis ​​JavaScript para armazenar números, strings de texto, objetos e outros tipos de dados. Depois de armazenar essas informações, você poderá usá-las em qualquer lugar do seu programa.

Tudo sobre variáveis ​​JavaScript

Aqui está o que você aprenderá neste artigo:

  • O que é uma variável definida pelo usuário em JavaScript?
  • Tipos de dados em variáveis ​​JavaScript
  • Como criar variáveis ​​JavaScript
  • Como armazenar tipos de dados em variáveis ​​JavaScript
  • Dicas para nomear variáveis ​​JavaScript
  • Digitação dinâmica e variáveis ​​JavaScript
  • Como trabalhar com variáveis ​​de string
  • O que você precisa saber sobre escopo variável

O que é uma variável definida pelo usuário em JavaScript?

Toda a programação JavaScript acontece em um ambiente como um navegador da web, Node ou Bun.js. Cada um desses ambientes possui seu próprio conjunto de variáveis ​​predefinidas, como window e console. Essas variáveis ​​não são definidas pelo usuário porque são definidas pelo ambiente. Outro tipo de variável é a variável definida pelo usuário definida por outros desenvolvedores, como em estruturas ou bibliotecas de terceiros que você usa. Depois, há variáveis ​​que você cria enquanto escreve seus programas, usando o let e const palavras-chave. Eles são definidos por você, usuário. Este artigo é sobre como criar suas próprias variáveis ​​definidas pelo usuário.

Tipos de dados em variáveis ​​JavaScript

As variáveis ​​retêm uma grande variedade de informações temporariamente. Os tipos de dados JavaScript que podem ser armazenados em uma variável incluem:

  • Valores numéricos ou “números”: as variáveis ​​contêm números, que podem ser usados ​​em cálculos matemáticos simples ou complexos. Exemplo: 2 + 2 = 4.
  • Sequências de caracteres: A corda é uma coleção de texto, como “JavaScript” ou “Meu nome é Mudd”.
  • Valores verdadeiros/falso: o tipo de dados booleano, que possui apenas valores verdadeiros ou falsos.
  • Objetos: variáveis ​​podem conter objetos JavaScript ou objetos definidos pelo usuário.

Variáveis ​​JavaScript podem conter alguns outros tipos de dados, mas esses são de longe os tipos mais usados.

Como criar variáveis ​​JavaScript

Diversas instruções JavaScript são usadas para criar variáveis, mas a maneira mais básica de criar uma variável manualmente é com os equalizadores (=) operador de atribuição:

VariableName = value

O primeiro argumento é o nome da variável. Os nomes das variáveis ​​podem ser muito longos, mas há restrições quanto aos caracteres que você pode usar. Discutiremos isso em detalhes em breve.

Na prática, as variáveis ​​devem ser declaradas usando o método let ou const declarações:


let myVariable = “foo”; 
const myOtherVariable = 42;

Ambos let e const restringir a visibilidade da variável ao bloco de código atual. O const instrução cria uma variável “constante”, que não pode ser alterada. Quando possível, use const para um código mais limpo.

O segundo argumento é o conteúdo da variável. Você pode colocar todos os tipos de dados em uma variável, incluindo um número, uma string, uma expressão matemática (como 2 + 2) e várias outras coisas. Em JavaScript, as variáveis ​​são digitadas dinamicamente, portanto, a mesma variável pode conter qualquer tipo de dado.

Como armazenar tipos de dados em variáveis ​​JavaScript

Vamos dar uma olhada em como armazenar os tipos de dados mais comuns em variáveis ​​JavaScript.

Armazenando números em variáveis ​​JavaScript

A número é um ou mais dígitos armazenados no computador de forma que o JavaScript possa realizar cálculos matemáticos com eles. JavaScript oferece suporte a valores inteiros e de ponto flutuante. Para colocar um número em uma variável, basta fornecer o nome da variável, o sinal de igual (também conhecido como o operador de atribuição de variável) e o valor que você deseja usar. Por exemplo, o código a seguir coloca o número 10 em uma variável chamada myVar:


let myVar = 10;

JavaScript facilita lidar com números. Você pode misturar e combinar flutuadores livremente. Por exemplo, myVar = 10 * .3 esta bem.

Armazenando strings em variáveis ​​JavaScript

Uma string é um ou mais caracteres de texto organizados na memória em um único arquivo. Strings podem conter números (dígitos), letras, pontuação ou uma combinação destes. Você não pode realizar cálculos matemáticos em strings (isso retornará NaN se você tentar, para Not a Number). Strings são atribuídas a variáveis ​​JavaScript sendo colocadas entre aspas, que podem ser simples ou duplas:


"I am a string"

ou


'I am a string'

Ao contrário de algumas linguagens, o JavaScript não faz distinção entre as duas formas de aspas. Aqui está um exemplo de como colocar uma string em uma variável:


let myVar = "This is JavaScript";

Armazenando valores booleanos em variáveis ​​JavaScript

Existem apenas dois valores booleanos: verdadeiro ou falso. Algumas linguagens de programação não possuem um conjunto separado de valores booleanos; em vez disso, eles usam 0 para falso e 1 ou -1 (ou qualquer outro valor diferente de zero) para verdadeiro. JavaScript permite usar esses números para representar verdadeiro e falso, mas, além disso, reserva as palavras verdadeiro e falso para se referir aos valores booleanos verdadeiro e falso.

Você pode pensar nos valores booleanos verdadeiro/falso como equivalentes a ligado/desligado ou sim/não. Para atribuir um valor booleano a uma variável, insira a palavra true ou false sem aspas. Aqui está um exemplo:


let myVar = true;

JavaScript “coage” variáveis ​​para booleanas ao testar para verdadeiro/falso. Além disso, existe uma variedade de variáveis ​​“falsas” e “verdadeiras” nesse sentido. Mencionamos 0 e 1, que naturalmente mapeiam para falso e verdadeiro. Na verdade, qualquer número diferente de 0 é forçado a verdadeiro. Outro valor forçado é a string vazia (false) e uma string contendo um valor (true):


if (“”) alert(“test”); // does not display alert

Outro uso comum é estabelecer a falsidade de undefined e null:


if (null) alert(“test”) // does not display alert

Armazenando objetos em variáveis ​​JavaScript

Variáveis ​​podem conter objetos, que são contêineres para outros valores e são extremamente úteis em muitos cenários. Existem dois tipos de variáveis ​​de objeto em JavaScript:

  • Variáveis ​​que contêm objetos internos relacionados ao navegador — janela, documento e assim por diante. Estas são referências a objetos que você não criou. São como cópias, mas as cópias mudam se o original mudar. Em alguns casos, alterar o objeto na variável afeta o objeto JavaScript original.
  • Variáveis ​​que contêm objetos definidos pelo usuário representam o objeto real. Uma alteração no objeto na variável altera apenas esse objeto.

Para atribuir um objeto JavaScript a uma variável, forneça o nome do objeto, como em:

myVar = window;;

Para atribuir uma nova cópia de um objeto definido pelo usuário a uma variável, use o comando new instrução e forneça o nome da função do objeto:


let myVar = new myObject();

Ou você pode usar um objeto literal:


let myVar = {
  name: “My Object”
}

Dicas para nomear variáveis ​​JavaScript

JavaScript oferece muita liberdade quando se trata de nomear variáveis. Os nomes das variáveis ​​JavaScript podem ter comprimento quase ilimitado, embora, por razões práticas, você provavelmente queira manter os nomes das variáveis ​​com menos de 10 ou 15 caracteres. Nomes de variáveis ​​mais curtos são mais fáceis de digitar e lembrar.

Aqui estão mais dicas para ter em mente ao nomear suas variáveis:

  • Os nomes das variáveis ​​devem consistir apenas em letras, sem espaços. Você pode usar números, desde que o nome não comece com um dígito. Por exemplo, myVar1 está tudo bem, mas 1MyVar não é.
  • Não use caracteres de pontuação em nomes de variáveis, com uma exceção: o caractere de sublinhado ( _ ). Então, a variável my_Var está tudo bem, mas my*Var não é. As variáveis ​​podem começar com o caractere sublinhado.
  • Os nomes das variáveis ​​diferenciam maiúsculas de minúsculas. A variável MyVar não é considerada a mesma variável que myVar, myVare outras variações.
  • É convencional usar camelCase para nomes de variáveis ​​JavaScript, por exemplo: thisIsMyVariable.
  • Evite abreviações obscuras. Uma abreviatura como msg está tudo bem porque a maioria das pessoas sabe que é uma abreviação de “mensagem”. Abreviaturas menos comuns devem ser evitadas.

Digitação dinâmica e variáveis ​​JavaScript

Ao contrário de algumas outras linguagens de programação, o JavaScript não exige que você defina explicitamente o tipo de variável que deseja criar. Este comportamento do JavaScript às vezes é chamado digitação de dados solta, mais formalmente conhecido como digitação dinâmica ou fraca. A digitação de dados solta do JavaScript difere de C e Java, que usam digitação de dados estrita.

O que isso significa é que em JavaScript você não precisa declarar um tipo de variável. O JavaScript usará alegremente a mesma variável para números, strings e objetos. (Parte do poder do TypeScript é que ele adiciona uma camada fortemente tipada sobre o JavaScript.)

Atribuindo variáveis ​​com let e const

Um bom JavaScript usa o let e const palavras-chave para declarar variáveis. Aqui está um exemplo:


let myVar = "This is a variable";
const myConst = “This is a constant”;

Você ainda verá var em algum código mais antigo. Se possível, refatore-o para usar let. (Embora isso às vezes não seja simples se a variável for usada como global.) Você também verá variáveis ​​declaradas sem uma declaração de palavra-chave — por exemplo, myVar = “foo”. Isso é apenas mau estilo!

Você também pode usar o let instrução com um nome de variável para declarar a variável, mas não definir um valor para ela:


let yVar;

Neste caso, você definiu myVar na memória, mas ainda não atribuiu um valor a ele. Mais tarde, você poderá usar a variável.

Trabalhando com limites de variáveis ​​de string

Os limites das variáveis ​​​​de string já foram um problema comum no JavaScript front-end. Hoje em dia, o limite de comprimento que uma variável de string JavaScript pode ter depende do mecanismo em que você está executando – seja Chrome, Edge, Node, Bun, etc. limites.

Você pode criar strings mais longas “juntando-as”. Depois de atribuir uma string a cada variável, você as combina usando o sinal de adição (+) personagem. Isso é chamado concatenação. O exemplo a seguir mostra como funciona a concatenação:


let myVar = "This is the start " + of how you " + " can build strings";

Você também pode usar interpolaçãoo que facilita a incorporação de variáveis ​​em uma string:


let name = “John Lennon”;
let myVar = “The song Across the Universe was written by ${name}.”;

O que você precisa saber sobre escopo variável

O escopo de uma variável não tem nada a ver com óptica ou enxaguatório bucal, mas sim com a extensão em que uma variável é visível para outras partes de um programa JavaScript. Nos velhos tempos, var elevaria uma variável para o topo do escopo. No JavaScript moderno, let e const comportar-se mais de acordo com outras linguagens, mantendo a variável dentro do bloco de código atual. O bloco atual é delimitado por chaves, conforme mostrado aqui:


let myFunction = function() {
    let foo = "bar";
    if (true){
        let foo = "baz";
    }
    console.log(foo); // outputs “bar”
}

Neste exemplo, o console produzirá “bar”. Ofoo definido dentro do if bloco é mantido dentro desse bloco. Variáveis ​​globais são uma fonte comum de erros lógicos, portanto, manter uma variável no menor escopo é sempre uma boa prática.

Conclusão

Embora as variáveis ​​sejam um aspecto bastante simples do JavaScript, elas também são universais e essenciais. Saber trabalhar com eles é como dominar os movimentos básicos de uma arte marcial: a prática compensa. Você nunca deixa o básico para trás; você simplesmente fica melhor em fazê-los trabalhar para você.

Esta história, “Variáveis ​​​​definidas pelo usuário em JavaScript” foi publicada originalmente por

JavaWorld.