TypeScript

TypeScript essencial para DEVs e concursos de TI. Entenda a tipagem estática e sua importância em frameworks como Angular, React e Node.js

Por
Atualizado em
Publicado em
4 min. de leitura

Olá, querida(o) estudante! Neste artigo, vamos conhecer o TypeScript, uma linguagem de programação que vem ganhando cada vez mais espaço no desenvolvimento web moderno. Criada pela Microsoft, ela surge como uma evolução do JavaScript tradicional, oferecendo novos recursos que tornam o código mais seguro, organizado e escalável — qualidades essenciais em sistemas complexos.

Compreender o TypeScript é importante não apenas para desenvolvedores, mas também para quem se prepara para concursos de TI, já que o tema aparece em diversas provas, especialmente quando o edital inclui frameworks como Angular, React ou Node.js.


O que é TypeScript

O TypeScript é uma linguagem de código aberto desenvolvida pela Microsoft em 2012. Ela é um superset do JavaScript, ou seja, estende a linguagem adicionando novos recursos sem alterar sua essência. O código escrito em TypeScript é transpilado (compilado) para JavaScript puro, garantindo compatibilidade com qualquer navegador ou ambiente que suporte JavaScript.

Em termos simples: tudo o que existe em JavaScript também funciona em TypeScript — mas o contrário nem sempre é verdadeiro.


Tipagem Estática: a principal característica

Uma das principais inovações do TypeScript é a tipagem estática, que permite definir tipos para variáveis, parâmetros e retornos de função em tempo de compilação. Isso significa que o próprio compilador detecta erros antes da execução do código, prevenindo falhas comuns de JavaScript, como uso de variáveis indefinidas ou incompatíveis.

Por exemplo:

function soma(a: number, b: number): number {
return a + b;
}

Se o desenvolvedor tentar chamar soma(“5”, 10), o compilador TypeScript emitirá um erro, pois a função espera dois números, e não uma string. Essa verificação antecipada torna o código mais confiável.


Transpilação para JavaScript

O código TypeScript não é executado diretamente pelos navegadores. Ele é compilado (ou transpilado) para JavaScript, gerando uma versão equivalente e compatível.

Por exemplo, o código:

function saudacao(nome: string) {
return Olá, ${nome}!;
}
console.log(saudacao(“Mundo TypeScript”));

é convertido pelo compilador em:

function saudacao(nome) {
return “Olá, ” + nome + “!”;
}
console.log(saudacao(“Mundo TypeScript”));

Note que o tipo string desaparece no código final, pois serve apenas para o compilador validar o código antes da execução.


Interfaces e Estruturação de Código

Outro recurso importante do TypeScript são as interfaces, usadas para definir contratos de objetos. Elas especificam quais propriedades e tipos um objeto deve ter, facilitando a padronização e evitando erros.

Exemplo:

interface Usuario {
nome: string;
idade: number;
}
const usuario: Usuario = { nome: “Carolina”, idade: 25 };

Caso o objeto não siga a estrutura exigida (por exemplo, omitindo o campo idade), o compilador gerará um erro.


Vantagens do TypeScript

  • Detecção antecipada de erros: o compilador identifica problemas antes da execução, reduzindo falhas em produção.
  • Melhor organização: a tipagem, interfaces e classes tornam o código mais legível e modular.
  • Integração com frameworks modernos: TypeScript é o padrão oficial do Angular e amplamente adotado em projetos React e Node.js.
  • Compatibilidade: o código compilado roda em qualquer ambiente que suporte JavaScript.
  • Suporte a recursos modernos: o TypeScript oferece compatibilidade com padrões mais recentes do ECMAScript, mesmo em navegadores antigos.

Desafios e Limitações

Apesar das vantagens, o TypeScript exige aprendizado adicional. É necessário configurar o compilador (tsc) e ajustar o ambiente de desenvolvimento. Além disso, a tipagem, embora útil, pode ser considerada verbosa em pequenos scripts.

Por isso, muitas equipes adotam TypeScript gradualmente, migrando partes críticas do sistema antes de uma adoção total.


TypeScript e Angular

O Angular, framework criado pelo Google, adotou o TypeScript como sua linguagem base. Isso ocorre porque o Angular utiliza intensivamente recursos como classes, decoradores e interfaces — todos nativamente suportados pelo TypeScript.

Assim, compreender o TypeScript é essencial para dominar o Angular, uma das tecnologias mais cobradas em concursos de desenvolvimento web.


Vamos ver como esse tema é cobrado nos concursos!

1) Ano: 2024 – Banca: Quadrix – Órgão: IBICT
Prova: Quadrix – 2024 – IBICT – Tecnologista – Tecnologia da Informação

No que diz respeito ao Bootstrap, ao TypeScript e ao Angular, versão 1, julgue o item.

Uma característica do TypeScript é o suporte a tipos estáticos, isto é, as variáveis, os parâmetros de função e os valores de retorno de função têm tipos definidos em tempo de compilação.

Gabarito: Certo

Comentário:
A afirmativa está correta. O TypeScript realmente oferece suporte à tipagem estática, permitindo que o compilador verifique os tipos de dados antes da execução do código. Esse recurso ajuda a detectar erros precocemente e é uma das principais diferenças em relação ao JavaScript, que é de tipagem dinâmica.


2) Ano: 2024 – Banca: Instituto Acesso – Órgão: Câmara de Manaus – AM
Prova: Instituto Acesso – 2024 – Câmara de Manaus – AM – Analista de Segurança da Informação

TypeScript é compilado para JavaScript, o que significa que o código TypeScript é transformado em código JavaScript que pode ser executado em qualquer navegador ou ambiente que suporte JavaScript. O código TypeScript ao ser compilado, se tornaria, por exemplo, a isso em JavaScript:

function saudacao(nome: string) {
return Olá, ${nome}!;
}
console.log(saudacao(“Mundo TypeScript”));

As alternativas são:

a) function saudacao(nome:string) { return “Olá, ” + nome + “!”; } console.log(saudacao(“Mundo TypeScript”));
b) function saudacao(string) { return “Olá, ” + nome + “!”; } console.log(saudacao(“Mundo TypeScript”));
c) function saudacao(nome) { return “Olá, ” + nome + “!”; } console.log(saudacao(“Mundo TypeScript”));
d) function saudacao(nome) { return “Olá, ” + nome + “!”; } console.log(saudação{Mundo TypeScript”});
e) function saudacao(nome) { return “Olá, $nome$ “!”; } console.log(saudacao(“Mundo TypeScript”));

Gabarito: Letra C

Comentário:

  • Letra A: incorreta. Apesar de quase idêntica, o TypeScript remove as anotações de tipo (:string), o que não ocorre aqui.
  • Letra B: incorreta. A função não define corretamente o parâmetro; string não é o nome do argumento.
  • Letra C: correta. O compilador TypeScript gera exatamente essa saída, com a tipagem removida e concatenação feita com +.
  • Letra D: incorreta. O uso de chaves {} em saudação{} é inválido em JavaScript.
  • Letra E: incorreta. A interpolação $nome$ não existe em JavaScript; o correto seria ${nome} dentro de template strings.

3) Ano: 2024 – Banca: FGV – Órgão: TJ-MS
Prova: FGV – 2024 – TJ-MS – Técnico de Nível Superior – Analista de Sistemas Computacionais – Web Designer**

Observe o seguinte script em TypeScript:

interface Tribunal { sigla: string; id: integer; }
const tjms: Tribunal = { id: 4, sigla: “TJMS” }

Ao ser executado em um interpretador com TypeScript na versão 4 ou mais recente, o script acima imprime um erro indicando:

a) a indefinição do nome ‘string’;
b) a indefinição do nome ‘integer’;
c) a indefinição do nome ‘interface’;
d) o uso inesperado de ‘;’ ao declarar Tribunal;
e) a atribuição indevida do id de tjms antes da sigla.

Gabarito: Letra B

Comentário:

  • Letra A: incorreta. O tipo string é válido em TypeScript e amplamente utilizado.
  • Letra B: correta. O tipo integer não existe em TypeScript; o tipo correto para números é number.
  • Letra C: incorreta. interface é uma palavra-chave válida.
  • Letra D: incorreta. O uso de ; em declarações de interfaces é permitido.
  • Letra E: incorreta. A ordem das propriedades em um objeto não causa erro, desde que os tipos estejam corretos.

Conclusão

O TypeScript representa um avanço significativo no desenvolvimento JavaScript, oferecendo segurança e previsibilidade por meio da tipagem estática e de recursos de orientação a objetos. É uma linguagem moderna, que une produtividade, clareza e compatibilidade, sendo cada vez mais cobrada em provas e amplamente usada em frameworks de ponta como Angular e NestJS.


Referências

  1. Hejlsberg, A. (2012). Introducing TypeScript. Microsoft Open Source Blog.
  2. Cherny, B. (2019). Programming TypeScript: Making Your JavaScript Applications Scale. O’Reilly Media.
  3. Freeman, A.; Sanderson, S. (2020). Pro TypeScript: Application-Scale JavaScript Development. Apress.
  4. Fain, Y. (2021). TypeScript Quickly. Manning Publications.
  5. Microsoft Documentation. TypeScript Handbook (v5.3). Disponível em: https://www.typescriptlang.org/docs

Por
Atualizado em
Publicado em
4 min. de leitura