DEV Community

Ricardo
Ricardo

Posted on

Tipos de dados [iniciante]

Sim, eu sei: o assunto 'tipos de dados em JavaScript' já foi tema de muitos posts por aí, e ainda será. Mas agora chegou a minha vez de falar sobre isso. Este é um assunto básico e que, na minha opinião, todo programador deveria dominar se não quiser passar mal quando criar suas aplicações. Isso faz parte do dia a dia de um programador, e apesar de ser relativamente simples, algumas situações bem específicas te farão pensar um pouco sobre qual o melhor tipo a ser utilizado no momento.

Então se você é daqueles que acredita que a IA vai roubar seu emprego não importa o que você faça e que isso não serve pra nada, sinta-se à vontade para não ler o restante deste post. Dito isso, vamos em frente.

Atualmente existem 9 tipos de dados em JavaScript, sendo 7 do tipo primitivo e 2 do tipo de referência. Os tipos primitivos são: Number, String, Boolean, Null, Undefined, Symbol e BigInt. Já os não primitivos são Object e Function. E sendo 100% honesto: eu nunca utilizei os tipos Symbol e BigInt em projetos reais, então irei deixá-los de fora neste post.

Number

O tipo Number é exatamente o que o nome diz, utilizado para representar um valor de número inteiro ou de ponto flutuante. Por exemplo: a idade de alguém, o nível de algum game, o preço de um produto — esse é polêmico, mas deixa pra outro momento — ou altura e peso de alguém.

// declarando uma variável chamada age que armazena o valor 42 let age = 42 
Enter fullscreen mode Exit fullscreen mode

String

O tipo String é utilizado para representar textos de uma forma geral, por exemplo: nome de pessoa, nome de produto, mensagem, nome de curso, nome de usuário, email, e assim por diante.

// declarando uma variável chamada name que armazena o valor 'Ricardo' const name = 'Ricardo' 
Enter fullscreen mode Exit fullscreen mode

Boolean

O tipo Boolean é um tipo mais simples e bem interessante. Ele só tem dois valores possíveis: true ou false. Ele é utilizado basicamente para indicar o estado de algo, ou seja, se a pergunta é se uma pessoa é programadora e ela de fato for uma, o valor será true, mas caso ela não seja, o valor será false. Outros exemplos: se a pessoa é casada, se um usuário está ativo em um sistema, se uma pessoa é maior de idade, se um cachorro é vacinado, entre outros.

// declarando uma variável chamada isVaccinated que armazena o valor true let isVaccinated = true 
Enter fullscreen mode Exit fullscreen mode

Null

O tipo Null é utilizado para representar um valor nulo. Sim, exatamente isso. E a palavra utilizada para isso é a null. Geralmente este tipo é utilizado para atribuir um valor nulo na inicialização de algo, que vamos chamar aqui de variável — caso não saiba o que é uma variável, é basicamente um nome que utilizamos para armazenar um valor. Então se eu crio uma variável nickname para armazenar o apelido de uma pessoa, eu posso começar atribuindo a ela o valor null, para que em algum momento seguinte, eu possa atualizar com o valor esperado, ou ainda manter nulo caso eu não consiga obter o apelido da pessoa. Em resumo, o objetivo do tipo Null é bem simples: representar um valor nulo a algo.

// declarando uma variável chamada address que armazena o valor null // e que poderá ter o valor alterado em algum outro momento let address = null 
Enter fullscreen mode Exit fullscreen mode

Undefined

O tipo Undefined é um tipo que significa a não definição de algo, e que é utilizado mais pelo próprio JavaScript do que por você mesmo. Na verdade, não é necessário definir explicitamente esse tipo. O próprio JavaScript definirá por conta própria. Embora o JavaScript permita atribuir explicitamente o valor undefined, isso é incomum, afinal undefined representa justamente a ausência de definição. Um pequeno exemplo é, invocar uma função sem passar um argumento esperado por ela. Dentro da função, esse valor será do tipo undefined. Ou ainda, declarar uma variável sem atribuir nenhum valor a ela.

// declarando uma variável sem inicializá-la com um valor let favoriteSport; 
Enter fullscreen mode Exit fullscreen mode

Object

O tipo Object é um tipo um pouco mais complexo, onde é possível ter uma lista de propriedades e valores que é chamada de objeto, assim como também poderá ser uma lista apenas de valores, que é chamada de array. Imagine agora que você é algo do tipo Object, logo você poderá ter algumas propriedades como por exemplo, nome, idade, altura, peso, se é formado, se é casado, a profissão, e assim por diante. Note que as propriedades estão todas relacionadas ao mesmo objeto, que é você, e cada uma dessas propriedades terá o seu devido valor. Um outro exemplo é ter listas de valores, como uma lista de convidados para sua festa de aniversário, lista de preços dos produtos que deseja comprar, e assim por diante.

// declarando uma variável chamada person que armazena um objeto // onde todas as propriedades estão relacionadas a este objeto const person = { name: 'Ricardo', age: 42, profession: 'Software Engineer', technologies: ['JavaScript', 'Node', 'MongoDB'] } // declarando uma variável chamada pets que armazena um array de nomes const pets = ['Riquinha', 'Selina', 'Meg', 'Milk', 'Jujuba', 'Rock', 'Macelino'] 
Enter fullscreen mode Exit fullscreen mode

Function

O tipo Function é o que o nome diz: uma função. E você cria uma função para executar algo que poderá ser feito repetidas vezes apenas chamando o nome dado a ela. Então se você precisar de uma rotina que dê bom dia, boa tarde ou boa noite quando um usuário acessar seu sistema, você criará uma função para isso, e irá executá-la sempre que alguém acessar sua aplicação. É como se você fosse cumprimentar mesmo alguém na vida real, então quando você encontra alguém, você olha para o seu relógio, verifica o horário e cumprimenta de acordo com o horário. Outros exemplos de funções: calcular e retornar uma multa por atraso em um pagamento; reordenar uma tabela ao clicar nas colunas; gerar uma sugestão de senha.

Uma função pode receber ou não valores que serão utilizados dentro dela, pode retornar ou não algum valor para quem a chamou, e ainda pode causar ou não efeitos colaterais na aplicação.

// declarando uma função chamada returnDouble que deverá receber um número // e retornar o dobro de seu valor function returnDouble(number) { return number * 2 } const double = returnDouble(2) console.log(double) 
Enter fullscreen mode Exit fullscreen mode

Vimos até agora alguns exemplos mais didáticos, e que parecem não servir para nada, e sozinhos não servem mesmo. Mas veja agora um pouco de código possível de se ver no dia a dia de um programador, onde você verá alguns dos tipos falados acima. Você verá no exemplo palavras como const, console.log(), filter, length, mas não se preocupe. Falaremos sobre essas palavras nos próximos posts. Por enquanto basta você executar o seu código e ver o que acontece.

Observação: Você poderá executar esses códigos diretamente no console do navegador ou no terminal do Node. Se você for iniciante e não souber como executar estes códigos, basta chamar nos comentários que te ajudo.

const seats = [ { id: 1, seat: 'A1', occupied: false }, { id: 2, seat: 'A2', occupied: false }, { id: 3, seat: 'A3', occupied: true }, { id: 4, seat: 'B1', occupied: false }, { id: 5, seat: 'B2', occupied: true }, { id: 6, seat: 'B3', occupied: true }, { id: 7, seat: 'C1', occupied: true }, { id: 8, seat: 'C2', occupied: false }, { id: 9, seat: 'C3', occupied: false }, ] function getFreeSeats(seats) { return seats.filter(seat => seat.occupied === false) } function getTotalFreeSeats(freeSeats) { return freeSeats.length } function printFreeSeats(seats) { const freeSeats = getFreeSeats(seats) console.log('FREE SEATS') for (let i = 0; i < freeSeats.length; i++) { console.log(` - Seat ${freeSeats[i].seat}`) } console.log(`Total free seats: ${getTotalFreeSeats(freeSeats)}`) } printFreeSeats(seats) 
Enter fullscreen mode Exit fullscreen mode

No exemplo acima temos uma variável seats que armazena um array de objetos, onde cada objeto possui as propriedades id (Number), seat (String) e occupied(Boolean). É uma lista simplificada dos assentos de uma sala de cinema, onde a propriedade seat representa o nome do assento e a propriedade occupied representa se ela já está ocupada ou não.

Em seguida temos as seguintes funções: getFreeSeats, getTotalFreeSeats e printFreeSeats. A função getFreeSeats tem como objetivo retornar a lista de assentos que ainda estão livres. Essa função recebe uma lista de assentos de uma sala por parâmetro — entre os parênteses. Neste exemplo, foi utilizado o método filter para filtrar pelos assentos que estão livres e retornar a nova lista. A função getTotalFreeSeats tem como objetivo retornar um valor do tipo Number, indicando o total de assentos livres. Essa função recebe por parâmetro a lista com apenas os assentos disponíveis, ou seja, já temos a informação que precisamos. Neste caso, bastou utilizar a propriedade length, que nada mais faz do que retornar a quantidade de itens de um array. A função printFreeSeats tem como objetivo apenas imprimir as informações com os nomes dos assentos disponíveis e exibir ao final o total de assentos disponíveis. Essa função recebe a lista de assentos por parâmetro, e dentro dela chamamos as outras duas funções que criamos anteriormente.

Por fim, chamamos a função printFreeSeats, enviando a variável seats por parâmetro, e então a lista de assentos disponíveis será impressa no console.

Nesse exemplo utilizamos os tipos Object com objetos e arrays, Function, Number, String e Boolean. Então é possível ver a importância de se conhecer os tipos, para utilizar os valores da maneira correta e evitar problemas no futuro.

No post de hoje você pôde conhecer os tipos em JavaScript, entender alguns exemplos e formas de uso, além de códigos didáticos e um código que você poderá ver no seu dia a dia como programador.

Caso queira debater, corrigir, acrescentar ou tirar alguma dúvida, fique à vontade.

Top comments (0)