TypeScript, ame ou nem ligue

Se você aprendeu programação orientada a objetos com Java, C, C++ ou C#, e agora programa em JavaScript, deve ter sentido uma pequena dificuldade pra se adaptar. Se você já se adaptou e já programa em JavaScript há algum tempo o TypeScript é quase inútil pra você, exceto se você desejar usar Angular2, pois é seu framework padrão.

TypeScript

TypeScript é desenvolvida pela Microsoft, e é uma linguagem de desenvolvimento JavaScript em larga escala. Nela você pode escrever programas com estrutura de orientação a objetos, com interfaces, classe, métodos e atributos com nível de acesso, etc. Além de ter variáveis fortemente tipadas. O TypeScript pega o código escrito com a estrutura dele e transforma em JavaScript puro, para assim ser executado pelo browser, qualquer um deles, Node.js e por engines JavaScript que suportem ECMAScript 3.

Instalando

Se você usa NPM instalar, TypeScript é bem simples

$ npm install -g typescript

Você também pode instalar um plugin na sua IDE ou editor de texto como no Sublime, Visual Studio, Eclipse, etc.

Usando

Vamos ao que interessa: como usar o TypeScript?

* Estou considerando que você instalou via npm e que vai usar por linha de comando, então vamos lá:

No exemplo a seguir criaremos uma interface e uma classe que a implementa, contendo um método que retorna string. Depois o objeto é instanciado e o método chamado.

Salve o arquivo com o nome animal.ts, sempre com a extensão (ts).

Vá para o terminal, bash ou prompt de comando e acesse a pasta de nosso exemplo com o comando cd pasta/do/projeto

E execute.

$ tsc animal.ts

Ele irá gerar um arquivo com o mesmo nome, mas com extensão .js com o conteúdo semelhante a:

Então você pode executar esse arquivo com $ node animal ou adiciona-lo ao html para executar via browser.

Parece pouca coisa né? Mas não pare por aqui, continue

Playground

Você pode testar códigos TypeScript no Playground, que é um pequeno editor capaz de identificar erros de sintaxe e executar seus códigos TypeScript, convertendo-os para JavaScript. Ele também é capaz de autocompletar seu código mostrando as opções disponíveis.

Tipos de Variáveis

Com TypeScript você pode definir o tipo das variáveis, assim como em linguagens como Java por exemplo.

O caminho para se declarar uma variável é o seguinte:

Você pode usar também a keyword let para variáveis limitadas ao escopo no bloco. Ou const para constantes.

Boolean

O tipo mais básico, apenas  true/false

Number

Assim como em JavaScript, em TypeScript todos os números são ponto flutuante, assumindo o tipo number. Nele também são aceitos números hexadecimais, decimais literais, binários e octais, veja:

String

O tipo string aceita dados do tipo texto, dentro de aspas simples ( ‘ ) ou aspas duplas (  ).

Você também pode usar tamplate strings, para isso você precisa usar crase (  ), e colocar seu texto dentro, e pode usar expressões assim: ${ epressão }:

Note que a variável sentence recebe um texto com quebra de linha, o que só é possível fazer usando (  ).

Array

Existem duas maneiras básicas de se criar arrays em TS, a primeira é a mais comum, utilizando apenas os colchetes [ ] precedidos pelo tipo do array:

A segunda, conhecida como generics, usa <> para definir o tipo, ficando mais ou menos assim: Array<tipo>:

Você ainda pode criar tipos mistos e complexos de arrays, como por exemplo arrays que tem como tipo uma classe, ou seja um array de objetos dessa classe.

Enum

Quem usa C# conhece muito bem esse DataType, que pode ser usado para dar nomes amigáveis a valores numéricos. Ele é geralmente usado para determinar status de alguma coisa, ou coisas semelhantes. Como no exemplo a seguir:

No exemplo, a variável c vai receber o valor 1, pois Green é a segunda opção da lista, lembrando que a lista é iniciada sempre pelo número 0, a não ser que você mesmo determine o número de cada opção:

Se você precisar do nome da opção:

Any

Como o nome sugere, uma variável com o tipo any pode assumir qualquer valor, ou seja é uma variável dinamicamente tipada. Veja:


Continua…

Por enquanto é só, e já é muito. Na parte 2 deste post falaremos sobre classes, interfaces, herança, acessors, etc. Fique ligado.

 

Sobre o autor:

Graduado em Análise e Desenvolvimento de Sistemas - FLS; Desenvolvedor Full-stack na UniLeão; Revisor de conteúdo do site Clube dos Geeks, católico, gosto de ler e escrever.

Postagens relacionadas:

4 respostas

Deixe uma resposta

Seu e-mail não será publicado.