Um momento
Aula 02
Cursos / Aprenda TypeScript - Tutorial Básico Vindo do JavaScript
Como Declarar o Tipo das Variáveis no TypeScript (number, string, boolean)

Summary

Resumo da Aula de TypeScript

Nesta aula, aprendemos sobre a definição e aplicação de tipos em variáveis usando TypeScript.

Conceitos Principais

  1. Arquivos TypeScript vs. JavaScript

    • É importante escrever código TypeScript em arquivos com a extensão .ts e não em .js, pois os arquivos .js contêm o código gerado.
  2. Tipos de Variáveis

    • Exemplo de variável mensagem que é inicialmente uma string.
    • Tentar atribuir um valor de tipo number (como 48) a uma variável que deve ser string resultará em um erro de tipo em TypeScript, diferentemente do JavaScript.
  3. Definição Explícita de Tipos

    • Para adicionar explicitamente o tipo a uma variável, usamos a anotação : seguida pelo tipo:
      let mensagem: string = "Olá, mundo";
      
  4. Exemplo de idades

    • Variável idade pode ser definida como um number:
      let idade: number = 35;
      
    • As anotações de tipo não aparecem no arquivo JavaScript gerado, pois TypeScript somente verifica os tipos durante a compilação.
  5. Tipos Booleanos

    • Um exemplo de variável booleana:
      let sistemaRodando: boolean = true;
      
    • Atribuir uma string (como "false") a uma variável booleana resultará em um erro.

Conclusão

A aula destacou a importância da anotação de tipos e como TypeScript introduz a verificação de tipos, que ajuda a evitar erros comuns encontrados no JavaScript. É crucial garantir que as variáveis sejam do tipo correto, conforme definido pelo programador.

Aguardamos a próxima aula para continuar expandindo nosso conhecimento em TypeScript!

Video Transcript

Vamos continuar o aprendizado de TypeScript. Nesta aula vamos aprender como definir, aplicar um tipo para uma variável. Vamos começar voltando no nosso exemplo.js, vamos aprender como adicionar o tipo e definir o tipo para compilar do aqui saber que mensagem deve ser o one string. Por exemplo, antes de fazer isso, no JavaScript aqui a gente tem que mudar o arquivo. Olha que tome cuidado que quando você está escrevendo TypeScript, para você não escrever o seu código no .js. Esse é o código gerado, então eu não posso escrever aqui, não devo escrever aqui, eu vou fechar e vou escrever no .ts. Então cuidado com isso, escreva no .ts, não no .js. Então vamos continuar. Então temos uma variável mensagem aqui que tem um string ou la-mundo. Se for normal assim JavaScript eu posso fazer o seguinte, eu posso dar a tribuir um novo valor à variável mensagem que seja um valor de tipo número, number. Isso é perfeitamente legal no JavaScript, se eu for aqui no terminal e compilar de novo com o .tsc, exemplo.ts, não há nenhum erro. Ah, olha o que aconteceu. Tipo 48 não pode ser atribuído ao tipo string, não é atribuído. Então, se fosse JavaScript normal isso não teria problema, mas estamos usando TypeScript. Então TypeScript a gente definiu a variável como um string inicialmente e aí você decidiu mudar o valor do tipo? Ah, isso não dá, né? Então ele encontrou um erro, tá? Porque 48 não é um string. Então na verdade aqui ele chegou os tipos implicitamente. Mas agora vamos aprender como adicionar o tipo de maneira explícita. É só adicionar depois do nome da variável os dois pontos e o tipo, nesse caso é o tipo string. Essa variável chamada mensagem tem que armazenar o valor tipo string, tá? E é o certo aqui. Se eu só vá aqui, vou dar de novo, ainda tem um erro, né? Porque 48 não é string, mas se eu mudar esse para um string não vai ter mais problema, né? Sem problemas, nenhum erro. Tirou o arquivo .tsc, tá? Outra coisa aqui para você saber, vou deletar o arquivo .tsc, que é o que foi gerado, e vou reverter isso para 48 como um number, tá? Você sabe que vai dar problema aqui, porque mensagem é um string e você usou 48 que é um number. Então são tipos diferentes. Se eu tentar compilar isso, obviamente tem um erro, né? Encontrou um erro. Mas olha aqui, o arquivo exemplo .tsc foi gerado. Então embora que tenha erro do copilador, ele ainda vai gerar os arquivos .tsc. Então tome cuidado com esse exemplo, tá? Arquivos gerados não significam que não teve nenhum problema nesse caso. Então vamos continuar. De volta ao ponto ts, que é o ponto tsc, tá? Então temos que concertar isso, não podemos atribuir um número à mensagem. Então tem que ser outro string, né? Agora vamos ver como é que a gente define um número. Vamos botar um número para idade, por exemplo, tem o valor 35. Sem problemas assim, mas como é que adiciona a anotação do tipo? Nesse caso é o tipo number. Então você vai usar o dois pontos, number, tá? Depois o nome da variável adiciona dois pontos, number. Aí eu adiciono esse espaço, repostilo, mas não precisa, tá? Meu estilo. Sem problemas, tá? Espaço ou não, tava no mesmo. Então vamos ver o que é que foi gerado. Então foi gerado, deixa eu botar do outro lado. Então tá aqui no lado esquerdo, arquivo, ponto ts, do lado direito, arquivo, ponto js que foi gerado. Aí ele criou a mensagem usando var ou la mundo. Depois você troua a mensagem para o outro string, criou idade 35. Você nota que todas as anotações de tipo não aparecem no arquivo gerado. Porque no JavaScript normal não tem tipos, né? Anotação de tipo. Não precisa, né? Isso é só na parte do TypeScript. Ele vai checar o copilador para ver os tipos assim por diante. Depois disso ele gera o arquivo JavaScript sem as anotações do TypeScript. Por isso que vai rodar, funcionar sem problemas em qualquer navegador, né? Ou no servidor do Node.js. Tá, então vamos aprender outro tipo, no arquivo, ponto ts. A gente vai aprender o string, o número, temos também booleano, tá? True ou false. Como é que faz o booleano? Por exemplo, let, sistema tá rodando ou não? Tá rodando sim, true. Como é que faz a anotação aqui? É, você põe booleano, tá? Essa maneira aqui. Note que tem um e, an, não é só bool, tá? Boolean, dessa maneira, tá? Então não esqueça de escrever o nome todo. Então vai ser um valor booleano que eu posso mudar para false, eu quiser. Vamos lá rodar o copilador, tsc, no terminal, sem problemas. Tá? Aqui o arquivo gerado, rodando true, rodando false, não tem mais anotação. E boolean, tá? Se eu, o que aconteceria se eu tivesse mudado o rodando para uma string com um nome false? Não é mais booleano, né? O que é que vai dar? Então deu o erro. Tipo, asples false, não pode ser atribuído ao tipo booleano, tá? Então isso não é permitido porque rodando, o valor booleano, tipo booleano, variável de tipo booleano, booleano, que não pode armazenar valores do tipo string. O valor string não é booleano, nesse caso. Tá certo? Então por essa aula só e até a próxima. Tchau.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: