Typescript: o que é e quais são as vantagem de usar Typescript?

Typescript: o que é e quais são as vantagem de usar Typescript?


Quem estuda Tecnologia da Informação, certamente, já teve contato com o TypeScript. E se ainda não conhece, vale a pena se aprofundar neste recurso para aumentar a produtividade e as possibilidades quando se trabalha com Java Script (JS). Há quem pense que o TypeScript veio para substituir o JavaScript, no entanto, este é um grande erro.

Lançado em 2012 por Anders Hejlsberg, influente engenheiro de software, o TypeScript possui diferentes conceitos e vantagens e, nos últimos anos, tem se popularizado cada vez mais entre os desenvolvedores. Considerando isso, vamos mostrar como o TypeScript pode colaborar com os seus projetos, demonstrando conceitos e, claro, quais são os seus principais benefícios. Acompanhe!

O que é TypeScript?

Mais conhecido como um superset do Javascript, ou seja, um conjunto de ferramentas, o TypeScript foi criado com o objetivo de incluir recursos que não estão presentes no JS. Por meio dele é possível definir a tipagem estática, parâmetros e retorno de funções.

Além de ser uma ferramenta orientada a objetos, fortemente tipada e que pode ser escrita em qualquer ambiente de desenvolvimento, o TypeScript quando instalado via gerenciador de pacotes JS, permite checar erros e utilizar outros compiladores que suportam este mecanismo.

O nome TypeScript surgiu da combinação de palavras “JavaScript” + “Type”( “Tipo” em português), representa a sua finalidade mais importante: a tipagem estática, na qual possibilita programar tanto do lado do cliente (client-side), como no lado do servidor (server-side). Logo, o TypeScript eleva o nível de produtividade e ainda garante o desenvolvimento de aplicações complexas, eficazes e seguras.

Quais são as vantagens do TypeScript?

O potencial de detecção de erros durante o desenvolvimento de projetos e a possibilidade de incluir a inteligência (IntelliSense) da IDE (ambiente de desenvolvimento integrado) que está sendo usada. Isso reflete num ambiente muito mais ágil e seguro enquanto o código está sendo digitado pelo usuário.

Além de ajudar o ambiente de desenvolvimento, o TypeScript possibilita o uso de diferentes funcionalidades do superset que não estão inclusas na forma nativa e, também, a migração de linguagem gradativamente, refletindo no aumento da produtividade das equipes.

Qual é a diferença entre TypeScript e JavaScript?

Embora o TypeScript seja uma “extensão” mais completa do JavaScript, há diferenças entre eles. A primeira delas é que no TypeScript existe uma tipagem estática e , no JavaScript, uma linguagem dinâmica. 

Outra diferença entre eles é que o TypeScript possui um funcionamento voltado a orientação de objetos, já no JS há uma programação estruturada na linguagem. Além disso, o Typescript é uma linguagem compilada e que transpila para Javascript.

TypeScript: tipagem estática

Numa linguagem de tipagem estática, é fundamental a declaração do tipo de dado que a variável irá receber, antes de atribuir valor a ela. Além disso, a tipagem estática concede uma maior segurança ao código, já que garante que o “build” do código não seja gerado caso ocorra algum erro na tipagem.

TypeScript e a orientação a objetos

Como o próprio nome já diz, é uma programação orientada a objetos. Um objeto possui dados e ações que interagem durante a realização do projeto. Quase sempre esses objetos são do mundo real. Dois exemplos para ilustrar: celulares e bananas.

O celular existe e é o objeto. Agora, entre um Android e um IOS há diferenças. Diferença de modelo, configurações e propriedades. No mercado você encontra facilmente bananas. Elas podem ser prata, caturra, nanica, da terra ou ouro. A banana caturra, por exemplo, é doce, enquanto a prata não tem tanta sacarose quando comparada à caturra. As duas são bananas, mas são diferentes. Logo, os objetos podem ter os mesmos atributos, mas com características distintas. 

Classes

Uma classe nada mais é do que uma representação de algum tipo de objeto. Além disso, uma classe pode ser utilizada para criar quantos objetos forem precisos. Sendo composta por métodos (ações) e atributos (características). As classes são modelos a serem seguidos porque nelas estarão características comuns e métodos compartilhados entre si pelos objetos. 

Herança

Muito conhecido entre os profissionais da área, o princípio de herança permite que uma classe filha possa herdar, ou não, as ações e as características de uma classe pai, sem a necessidade de redefinição das funções. A palavra para herança em TypeScript é “extends”, igual a linguagem  em Java. 

Encapsulamento

Presente no TypeScript e em outras linguagens que usam a orientação a objetos como base, o encapsulamento é um recurso ativado através de setter e getters, permitindo que o código tenha acesso a características de uma classe que esteja protegida. Ao aplicar este conceito, é possível definir quais são os atributos de uma classe que pode ser visível aos usuários, assim como os que estarão expostos para uma interface pública.

Classes abstratas

Conhecida por ser somente herdada e não instanciada, a classe abstrata é usada para destacar algumas características de determinado elemento. A partir dele é possível agrupar características do mundo real em classes ou empregar funções de sistema nas classes abstratas.

Interfaces

Outro conceito importante no TypeScript é a oportunidade de criar interfaces customizadas, que facilitam a construção entre os conjuntos de objetos, permitindo assim que os tipos adequados sejam usados. Em outras palavras, funciona como um contrato entre si e qualquer outra classe ou estrutura que empregue sua interface.

Instalação do TypeScript

Existem duas maneiras de instalar as ferramentas do TypeScript, a primeira delas é por meio do npm do NodeJs, e a outra é através da  instalação de plugins do Visual Stúdio. Após isso, é só abrir o terminal e digitar o comando npm install -g typescript.

Verificando instalação

Para verificar se está tudo certo com a instalação, execute o comando: tsc -v. 

Se o TS estiver instalado, aparecerá no console.

Começando a utilização

Para começar a usar o TS é necessário criar um arquivo de configurações para o compilador do JS. Para isso, dentro de um diretório, execute o comando: tsc –init.

Com ele será criado de forma automática o arquivo tsconfig.json. Após isso, é só criar um arquivo com extensão .ts e começar a usar.

React TypeScript

Desenvolvida pelo Facebook para o desenvolvimento de interface de usuários (IU), o React é uma biblioteca JavaScript muito semelhante a framework. O template padrão que o React usa é com o JavaScript, no entanto, pode ser alterado para TS de maneira muito simples.

No React com Javascript, os arquivos têm extensões .js ou .jsx. Já com o template TypeScript, as extensões são .ts ou .tsx.

Angular TypeScript

Famoso por ser um framework moderno, o Angular foi desenvolvido com TS para aplicações Web SPA baseada em componentes. Além disso, sua documentação oferece suporte e uma referência mais atualizada. Por meio do recurso do Angular é comum o uso do CLI (Command Line Interface).

Conclusão

Como vimos até aqui, o TypeScript é um superset que serve para potencializar a linguagem JavaScript. Com ele é possível construir projetos complexos sem nenhum empecilho. Além disso, ele oferece uma forte tipagem que permite maior desempenho e produtividade na hora de executar uma aplicação.

Este recurso está cada vez mais em ascensão no universo do desenvolvimento web, considerando isso, é super importante que os profissionais da área estejam atentos, principalmente, os desenvolvedores JS. Compreendendo a diferença entre eles, fica muito mais simples tomar uma decisão assertiva considerando a linguagem que cabe melhor a cada projeto.

Se você deseja escrever códigos com uma arquitetura aprimorada, o TS é, sem dúvida nenhuma, imprescindível.

Se você gostou desse conteúdo e gostaria de entrar na área de programação, eu recomendo que você faça a sua inscrição na Kenzie Academy Brasil. Estude Desenvolvimento Full Stack e só pague quando estiver formado. Faça já a sua inscrição.

+1

Escreva o primeiro comentário

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *