Introdução ao TypeScript para iniciantes

TypeScript é um superconjunto poderoso de JavaScript que adiciona tipagem estática e outros recursos avançados à linguagem. Ele ajuda os desenvolvedores a detectar erros antecipadamente, escrever código mais limpo e manter grandes bases de código de forma mais eficaz. Neste guia, vamos guiá-lo pelos conceitos básicos do TypeScript e ajudá-lo a começar a usá-lo, mesmo que você seja um iniciante completo.

O que é TypeScript?

TypeScript é uma linguagem de programação de código aberto desenvolvida pela Microsoft. Ela se baseia em JavaScript adicionando tipos estáticos, que podem ajudar a identificar erros em tempo de compilação em vez de tempo de execução. Isso torna mais fácil escrever código confiável e sustentável. O código TypeScript precisa ser compilado em JavaScript antes de poder ser executado em um navegador ou em um ambiente Node.js.

Por que usar TypeScript?

  • Qualidade de código aprimorada e detecção precoce de bugs com tipagem estática
  • Melhores ferramentas e recursos de preenchimento automático em IDEs modernos
  • Melhor legibilidade e manutenibilidade para grandes bases de código
  • Suporta os recursos JavaScript mais recentes e padrões futuros

Como instalar o TypeScript

Antes de começar a usar o TypeScript, você precisa instalá-lo na sua máquina. Você precisará do Node.js e do npm (Node Package Manager) instalados. Se você não os tiver instalado, baixe-os do site do Node.js.

  1. Abra seu terminal ou prompt de comando.
  2. Execute o seguinte comando para instalar o TypeScript globalmente:
npm install -g typescript

Este comando instalará o TypeScript globalmente no seu sistema, tornando-o acessível de qualquer pasta.

Criando seu primeiro programa TypeScript

Depois que o TypeScript estiver instalado, você pode criar seu primeiro arquivo TypeScript. Siga estas etapas:

  1. Crie uma nova pasta para seu projeto e navegue até ela usando o terminal:
mkdir my-first-typescript-app
cd my-first-typescript-app
  1. Crie um novo arquivo TypeScript chamado app.ts:
echo "console.log('Hello, TypeScript!');" > app.ts

Isso cria um arquivo TypeScript simples que registra "Olá, TypeScript!" no console.

Compilando TypeScript para JavaScript

O código TypeScript não pode ser executado diretamente por navegadores ou Node.js; ele deve primeiro ser compilado para JavaScript. Você pode compilar seu arquivo TypeScript executando o seguinte comando em seu terminal:

tsc app.ts

Este comando gera um arquivo JavaScript chamado app.js no mesmo diretório. Agora você pode executar o arquivo JavaScript compilado usando Node.js:

node app.js

Você deverá ver Hello, TypeScript! impresso no console.

Compreendendo os tipos básicos em TypeScript

O TypeScript apresenta vários tipos básicos que ajudam você a definir a forma e a estrutura dos seus dados. Aqui estão alguns tipos comuns:

  • Número: Representa valores numéricos.
  • String: Representa valores de texto.
  • Boolean: Representa valores verdadeiros ou falsos.
  • Matriz: Representa uma coleção de valores do mesmo tipo.
  • Tupla: Representa uma matriz com um número fixo de elementos de tipos diferentes.
  • Enum: Representa uma coleção de constantes nomeadas.
  • Any: Representa um tipo dinâmico que pode conter qualquer valor.

Exemplo: Usando tipos em TypeScript

Vejamos um exemplo simples que demonstra o uso de diferentes tipos no TypeScript:

let age: number = 30;
let name: string = "John Doe";
let isStudent: boolean = true;
let hobbies: string[] = ["Reading", "Gaming", "Traveling"];
let person: [string, number] = ["Jane", 25];

enum Color {
  Red,
  Green,
  Blue,
}

let favoriteColor: Color = Color.Green;

console.log(age, name, isStudent, hobbies, person, favoriteColor);

Neste exemplo, definimos variáveis ​​com tipos específicos como number, string, boolean, array, tuple e enum. O compilador TypeScript garantirá que as variáveis ​​sejam atribuídas aos tipos corretos, fornecendo uma camada de segurança que o JavaScript vanilla não oferece.

Conclusão

TypeScript é uma ótima escolha para desenvolvedores que buscam escrever códigos mais robustos e sustentáveis. Ao adicionar tipos estáticos ao JavaScript, o TypeScript pode ajudar você a detectar erros antecipadamente e fornecer melhor suporte de ferramentas. Neste tutorial, você aprendeu os conceitos básicos do TypeScript, como instalá-lo, escrever um programa simples e usar alguns de seus tipos básicos. Conforme você continua a explorar o TypeScript, descobrirá muitos outros recursos poderosos que podem ajudar a melhorar seu fluxo de trabalho de desenvolvimento.