O que é typescript? Aprenda agora sobre tipagem

Digital House

16 de Abr de 2021 • 5 min de leitura

Minha primeira linguagem de programação foi o Javascript e, por isso, eu tenho um amor muito grande por ela. Quando procurei sobre o que é Typescript, fiquei pensando por que eu iria perder tempo tipando as coisas. Javascript é mais prático e dinâmico. Mas será? Hoje vamos entender a linguagem Typescript e como ela resolve alguns problemas do Javascript.

Quando eu mudei de time na empresa em que trabalho, passei a entender o que é Typescript pode ser a resolução de muitos problemas. Trabalhar com projetos de front-end em Javascript que eu ainda não conhecia.

Você já se esqueceu quais são os parâmetros de uma função ou as propriedades de um objeto e teve que ficar indo e voltando no código? Você já precisou acessar camadas e camadas do projeto até encontrar as informações que precisava para entender o retorno de uma função?

Sem tipagem é assim mesmo, né? Para quem está acostumado com Javascript, pode não parecer nada de mais. Mas, depois que comecei a trabalhar com linguagens tipadas, quando estou usando Javascript, às vezes parece que estou codando no escuro. E é por isso que hoje irei apresentar o Typescript.

O que é Typescript?

Typescript é uma linguagem de programação criada pela Microsoft que estende o Javascript e adiciona novas funcionalidades. Ou seja, ela não é uma linguagem completamente nova e sim um superset de Javascript.

O nome Typescript vem da combinação das palavras Javascript + tipo, representando sua funcionalidade adicional principal que é a tipagem estática.

Para que serve Typescript?

O Typescript tem tudo o que o Javascript possui e ainda resolve alguns problemas, sendo os principais a tipagem estática e o suporte à programação orientada a objetos.

Com a tipagem estática é possível compreender e refatorar com muita facilidade os dados que você está trabalhando no código. A intellisense da IDE fica muito melhor. Ao posicionar o cursor em cima do dado, a IDE te informa a tipagem dele, assim como sugere as propriedades de um objeto que você estiver usando.

Para quem trabalha com programação orientada a objeto, o Typescript é muito mais apropriado, com funcionalidades e sintaxe adequadas. Ele dá suporte à: encapsulamento, herança, abstração e polimorfismo.

Como funciona o Typescript?

O Typescript é uma linguagem compilada, possibilitando a identificação de erros, sugerindo correções antes da execução do código e gerando economia de tempo.

Com Javascript, você precisa executar o código para verificar possíveis erros. Ele transpila para Javascript, ou seja, o código é convertido para Javascript no build de produção, sendo utilizado apenas em ambiente de desenvolvimento. Todo código Typescript é no fim um código Javascript. Portanto ele funciona em todo navegador e sistema operacional que o Javascript rodar.

Ele trabalha com inferência de tipo, tornando opcional a tipagem de todos os elementos do código. Só será necessária a tipagem do que o compilador não conseguir deduzir automaticamente.

Adotar TypeScript pode ser gradual, sem necessidade de converter todos os arquivos de uma vez. Ele aceita arquivos Javascript, podendo então substituir aos poucos a linguagem do projeto até que todo o código tenha sido refatorado.

Qual a diferença entre Javascript e Typescript?

Quando falamos em diferenças, é importante ressaltar que o Typescript tem tudo o que o Javascript possui, sendo então muito parecidas.

Podemos dizer que as grandes diferenças de funcionalidades entre Javascript e Typescript são a tipagem estática e o suporte a OOP (Programação Orientada a Objetos) e que o Typescript é uma linguagem compilada e que transpila para Javascript.

Outras alternativas:

JSDoc

É possível adicionar tipagem via JSDocs, através de comentários. É uma possibilidade que auxilia na adoção parcial do Typescript em projetos pré existentes.

O JSDoc é apenas uma funcionalidade que atua através de comentários, enquanto Typescript é uma linguagem com diversas funcionalidades. Pelo JSDoc atuar através de comentários, a tipagem poderá ficar desatualizada. O Javascript não irá detectar alterações na documentação e exigirá a correção da tipagem, ao contrário do Typescript.

Flow

Uma alternativa ao Typescript é o Flow. Eles possuem funcionalidades muito parecidas, mas o Typescript é muito mais maduro e com maior apoio da comunidade. Isso faz toda a diferença na escolha de uma tecnologia.

Typescript diminui a produtividade?

No início da adoção do Typescript, sim, você irá levar mais tempo devido à curva de aprendizado da linguagem. Criar a tipagem leva um tempo extra também. Mas esse tempo perdido no aprendizado e na tipagem é recuperado e até superado com o crescimento da aplicação.

A tipagem ajuda muito na produtividade, principalmente para novos devs, que não dominam o projeto. Isso porque o código fica muito mais simples de ser entendido e refatorado.

Quais as vantagens e desvantagens

Como todas as outras linguagens, Typescript também possui os seus prós e contras. Um código tipado tem suas vantagens e desvantagens, assim como um código não tipado. Confira abaixo quais são elas:

Vantagens

- Tipagem estática opcional

- Previsibilidade e legibilidade

- Rápida refatoração

- Validação do código

- Adoção parcial

- Melhora a documentação

- Melhora o IntelliSense da IDE

- Novas funcionalidades

- Melhor suporte a OOP

Desvantagens

- Curva de aprendizado da linguagem

- Tempo gasto para tipar

- Configuração do projeto

- Tempo pra compilar / transpilar

- Possível necessidade de refatoração

E sorvete, você gosta?

Eu poderia falar mais sobre Typescript, mas como a gente explica pra alguém que nunca experimentou sorvete que ele pode ser muito bom, apesar de ser extremamente gelado e até congelar seu cérebro se você for com muita sede ao pote?

"Você escreve código para outras pessoas poderem entender."

Se eu puder resumir esse artigo, a lição que quero passar é que nós não escrevemos código para nós mesmos. Nós escrevemos código para que nossos colegas de trabalho, atuais e futuros, possam compreendê-lo e refatorá-lo sempre que necessário da forma mais fácil possível.

Devemos sempre pensar em como diminuir a barreira para novos desenvolvedores e desenvolvedoras, ressaltando que eles terão diferentes senioridades e pessoas júnior já tem muitas barreiras a serem vencidas.

Confira meus projetos comparando Javascript e Typescript

Para essa prova de conceito, eu fiz 2 projetos com a mesma proposta, um em Javascript e outro em Typescript, para estudar e apresentar as diferenças entre eles. É um projeto simples, que consome a api do Pokémon. Confira ele aqui.

Vocês podem conferir o repositório nesse link.

Entenda o que é Typescript na prática

Agora que você entendeu o que é Typescript deve estar cheio de vontade de aplicar esses conhecimentos na prática. Na Digital House, você aprende desenvolvimento web através de aulas remotas, 100% ao vivo, com interação entre professores e colegas de sala. Aprenda programação mão na massa e ainda saia com um Projeto Integrador que servirá de portfólio para você embarcar para o mercado de trabalho.