Entendendo os tipos de dados em JavaScript

Tutoriais
JavaScript

Introdução

Os tipos de dados são usados para classificar um tipo particular de dados em linguagens de programação. Por exemplo, um número e uma string de caracteres são diferentes tipos de dados que serão tratados de forma diferente pelo JavaScript.

Isso é importante porque o tipo de dados específico que você usa determinará quais valores você pode atribuir a ele e o que você pode fazer com ele. Isso quer dizer que, para ser capaz de realizar operações com variáveis em JavaScript, é importante entender o tipo de dados de qualquer variável fornecida.

Neste tutorial, vamos explicar como os tipos de dados funcionam em JavaScript, bem como os tipos de dados importantes nativos da linguagem. Esta não é uma investigação exaustiva dos tipos de dados, mas irá ajudá-lo a se familiarizar com as opções disponíveis para você em JavaScript.

Tipagem Dinâmica

O JavaScript possui tipos de dados dinâmicos, o que significa que a verificação de tipo é feita em tempo de execução, em vez de em tempo de compilação. Os tipos de dados do Python também são dinamicamente tipados.

Com linguagens de tipagem dinâmica, uma variável com o mesmo nome pode ser usada para armazenar diferentes tipos de dados.

Por exemplo, a variável t, definida como variável pela palavra-chave let (observe que let mantém uma variável dada limitada em escopo), pode ser atribuída para armazenar diferentes tipos de dados, ou pode ser inicializada mas deixada indefinida:

let t = 16;			// t é um número
let t = "Teresa";	// t é uma string
let t = true;		// t é um booleano
let t;				// t é indefinido

Cada uma das variáveis t acima pode ser definida para qualquer tipo de dados disponível em JavaScript; elas não precisam ser explicitamente declaradas com um tipo de dados antes de serem usadas.

Números

O JavaScript tem apenas um tipo de número, não há uma designação separada para inteiros e números de ponto flutuante. Por causa disso, números podem ser escritos em JavaScript com ou sem decimais:

let num1 = 93;
let num2 = 93.00;

Em ambos os casos acima, o tipo de dados é um número e é o mesmo independentemente de o número ter ou não pontos decimais.

A notação exponencial científica pode ser usada em JavaScript para abreviar números muito grandes ou muito pequenos, como nos exemplos a seguir:

let num3 = 987e8;		// 98700000000
let num4 = 987e-8;		// 0.00000987

Números em JavaScript são considerados precisos até 15 dígitos. Isso significa que os números serão arredondados após o 16º dígito ser alcançado:

let num5 = 999999999999999;		// permanece como 999999999999999
let num6 = 9999999999999999;	// arredondado para 10000000000000000

Além de representar números, o tipo de dado número em JavaScript também possui três valores simbólicos disponíveis:

  • Infinity — um valor numérico que representa um número positivo que se aproxima do infinito
  • -Infinity— um valor numérico que representa um número negativo que se aproxima do infinito
  • NaN — um valor numérico que representa um não-número, significando não é um número

Infinity ou -Infinity serão retornados se você calcular um número fora do maior número possível disponível em JavaScript. Isso também ocorrerá para valores que são indefinidos, como ao dividir por zero:

let num7 = 5 / 0;	// retornará Infinity
let num8 = -5 / 0;	// retornará -Infinity

Em termos técnicos, Infinity será exibido quando um número exceder o número 1.797693134862315E+308, que representa o limite superior em JavaScript.

Da mesma forma, -Infinity será exibido quando um número ultrapassar o limite inferior de -1.797693134862316E+308.

O número Infinity também pode ser usado em loops:

while (num9 != Infinity) { 
	// O código aqui será executado até num9 = Infinito
}

Para números que não são números legais, NaN será exibido. Se você tentar realizar uma operação matemática com um número e um valor não numérico, NaN será retornado. Este é o caso no seguinte exemplo:

let x = 20 / "Shark";	// x será NaN

Já que o número 20 não pode ser dividido pela string "Tubarão" porque não pode ser avaliado como um número, o valor retornado para a variável x é NaN.

No entanto, se uma string pode ser avaliada como um valor numérico, a expressão matemática pode ser realizada em JavaScript:

let y = 20 / "5";	// y será 4

No exemplo acima, já que a string "5" pode ser avaliada como um valor numérico em JavaScript, ela é tratada como tal e funcionará com o operador matemático para divisão, /.

Ao atribuir o valor NaN a uma variável usada em uma operação, o resultado será o valor de NaN, mesmo quando o outro operando é um número legal:

let a = NaN;
let b = 37;
let c = a + b; 	// c será NaN

Só há um tipo de dado de número em JavaScript. Ao trabalhar com números, qualquer número que você inserir será interpretado como o tipo de dado para números; você não precisa declarar que tipo de dado está inserindo porque JavaScript é tipado dinamicamente.

Cadeias de caracteres

A string is a sequence of one or more characters (letters, numbers, symbols). Strings are useful in that they represent textual data.

Em JavaScript, as cadeias de caracteres existem dentro de aspas simples ' ou aspas duplas ", então para criar uma cadeia de caracteres, coloque uma sequência de caracteres entre aspas:

let singleQuotes = 'This is a string in single quotes.';

let doubleQuotes = "This is a string in double quotes.";

Você pode optar por usar aspas simples ou aspas duplas, mas seja qual for sua escolha, deve permanecer consistente dentro de um programa.

O programa “Olá, Mundo!” demonstra como uma cadeia de caracteres pode ser usada na programação de computadores, já que os caracteres que compõem a frase Olá, Mundo! no alert() abaixo são uma cadeia de caracteres.

hello.html
<!DOCTYPE HTML>
<html>
<head>
<script>
function helloFunction() {
    alert("Hello, World!");
}
</script>
</head>
<body>
<p><button onclick="helloFunction()">Click me</button></p>
</body>
</html>

Ao executarmos o código e clicarmos no botão Clique em mim, receberemos uma mensagem pop-up com a seguinte saída:

Output
Hello, World!

Assim como outros tipos de dados, podemos armazenar cadeias de caracteres em variáveis:

let hw = "Hello, World!";

E exibir a cadeia de caracteres no alert() chamando a variável:

hello.html
...
<script>
let hw = "Hello, World!";
function helloFunction() {
    alert(hw);
}
</script>
...

Output
Hello, World!

Há muitas operações que podemos realizar em cadeias de caracteres dentro de nossos programas para manipulá-las e alcançar os resultados desejados. Cadeias de caracteres são importantes para comunicar informações ao usuário e para o usuário comunicar informações de volta ao programa.

Booleanos

O tipo de dados Booleano pode ter um de dois valores, verdadeiro ou falso. Booleans são usados para representar os valores de verdade associados ao ramo lógico da matemática, que informa algoritmos na ciência da computação.

Muitas operações na matemática nos dão respostas que avaliam como verdadeiro ou falso:

  • maior que
    • 500 > 100 verdadeiro
    • 1 > 5 falso
  • menor que
    • 200 < 400 verdadeiro
    • 4 < 2 falso
  • igual
    • 5 = 5 verdadeiro
    • 500 = 400 falso

Assim como com outros tipos de dados, podemos armazenar um valor Booleano em uma variável:

let myBool = 5 > 8;	// falso

Como 5 não é maior que 8, a variável myBool tem o valor de falso.

À medida que você escreve mais programas em JavaScript, você ficará mais familiarizado com como os Booleans funcionam e como diferentes funções e operações avaliando como verdadeiro ou falso podem mudar o curso do programa.

Matrizes

Uma matriz pode conter múltiplos valores dentro de uma única variável. Isso significa que você pode conter uma lista de valores dentro de uma matriz e iterar por eles.

Cada item ou valor que está dentro de uma matriz é chamado de elemento. Você pode se referir aos elementos de uma matriz usando um número de índice.

Assim como as strings são definidas como caracteres entre aspas, as matrizes são definidas tendo valores entre colchetes [ ].

Uma matriz de strings, por exemplo, parece com isso:

let fish = ["shark", "cuttlefish", "clownfish", "eel"];

Se chamarmos a variável de fish, receberemos a seguinte saída:

["shark", "cuttlefish", "clownfish", "eel"]

As matrizes são um tipo de dados muito flexível porque são mutáveis, ou seja, podem ter valores de elementos adicionados, removidos e alterados.

Objetos

O tipo de dados objeto do JavaScript pode conter muitos valores como pares nome:valor. Esses pares fornecem uma maneira útil de armazenar e acessar dados. A sintaxe literal do objeto é composta por pares nome:valor separados por dois pontos com chaves em ambos os lados { }.

Geralmente usado para armazenar dados relacionados, como as informações contidas em um ID, um objeto literal JavaScript parece com isso, com espaços entre propriedades:

let sammy = {firstName:"Sammy", lastName:"Shark", color:"blue", location:"ocean"};

Alternativamente, e especialmente para literais de objeto com um grande número de pares nome:valor, podemos escrever este tipo de dados em várias linhas, com um espaço em branco após cada dois pontos:

let sammy = {
    firstName: "Sammy",
    lastName: "Shark",
    color: "blue",
    location: "Ocean"
};

A variável de objeto sammy em cada um dos exemplos acima possui 4 propriedades: firstName, lastName, color e location. Estes são cada um passado valores separados por dois pontos.

Trabalhando com Múltiplos Tipos de Dados

Embora cada programa que você criar contenha múltiplos tipos de dados, é importante ter em mente que geralmente você estará realizando operações dentro do mesmo tipo de dados. Ou seja, você estará realizando operações matemáticas com números ou fatiando strings.

Ao usar um operador que funciona em diferentes tipos de dados, como o operador + que pode adicionar números ou concatenar strings, você pode obter resultados inesperados.

Por exemplo, ao usar o operador + com números e strings juntos, os números serão tratados como uma string (assim, eles serão concatenados), mas a ordem dos tipos de dados influenciará a concatenação.

Então, se você criar uma variável que realize a seguinte concatenação, o JavaScript interpretará cada elemento abaixo como uma string:

let o = "Ocean" + 5 + 3;

Se você chamar a variável o, obterá o seguinte valor retornado:

Output
Ocean53

No entanto, se você iniciar com números, os dois números serão adicionados antes de serem interpretados como uma string quando o programa atinge "Ocean", então o valor retornado será a soma dos dois números concatenados com a string:

let p = 5 + 3 + "Ocean";

Output
8Ocean

Devido a esses resultados inesperados, provavelmente você estará realizando operações e métodos dentro de um único tipo de dado em vez de entre eles. No entanto, o JavaScript não retorna erros ao misturar tipos de dados, como algumas outras linguagens de programação fazem.

Conclusão

Neste ponto, você deve ter uma compreensão melhor de alguns dos principais tipos de dados disponíveis para você usar em JavaScript.

Cada um desses tipos de dados será importante conforme você desenvolve projetos de programação na linguagem JavaScript.

Source:
https://www.digitalocean.com/community/tutorials/understanding-data-types-in-javascript