Vamos falar sobre sintaxe do TypeScript

Antes de se aprofundar nesta série de posts, vamos falar um pouco sobre a sintaxe básica do TypeScript e algumas convenções também, para você já ficar acostumado com algumas boas práticas.

Comandos para compilar

• tsc: Roda o compilador, baseado nas configurações setadas no tsconfig.json;
• tsc nome_do_arquivo.ts: Faz a transpilação (transforma em uma maneira do browser lidar com ele);
• tsc src/*ts: Transpila todos os arquivos dentro do src com a extensão .ts;
• tsc –project tsconfig.json src/.ts: Transpila todos os arquivos .ts dentro do src, porém as configurações vêm do tsconfig.json.

Flags do compilador

• –help: Mostra o manual;
• –init: Inicializa um projeto TypeScript e cria o arquivo tsconfig.json;
• –target: Seta a versão do ECMA para a padrão;
• –watch: Fica observando as mudanças e faz a recompilação automaticamente;
• –outFile: Compila vários arquivos em um;
• –noImplicitAny: Tira a possibilidade de setar o tipo para “any”;
• –removeComments: Tira todos os comentários;
• –build: Builda o projeto e todas as suas dependências.

Comentários

Vamos falar um pouco sobre comentários e como fazer nos projetos de TypeScript, caso você e sua equipe façam comentários de forma correta pode poupar muito tempo de outros programadores e até o seu mesmo, se for revisitar um trecho do código.

No mundo ideal, não precisaríamos comentar em nossos códigos, pois ele deveria falar por si próprio e ser bem claro em sua função, mas sabemos que nem sempre é assim, então podemos fazer os chamados comentários em trechos do código, para ajudar no entendimento.

Vou mostrar algumas maneiras de como fazer isso:

// Assim a gente só comenta uma única linha
/*
    Agora desta forma, qualquer coisa
    Dentro desse bloco
     Será considerado um comentário
     E não será compilado
*/

Vale bastante a pena perguntar para seu time como é feito os comentários dentro do projeto, alguns preferem por blocos e outros por linhas únicas, mesmo que sejam várias de uma vez, uma embaixo da outra.

Quer saber mais sobre o Angular ou TypeScript? Acompanhe o Blog e o meu Curso de Angular

Identificadores

Agora como podemos fazer as nomeações ( ou dar nome aos bois ) dentro do TypeScript. Devemos seguir algumas pequenas regras, vou mostrar quais:

1 – Não podemos começar com números:

// Não funciona
5_de_setembro

// Funciona
arroz_10

2 – Podemos colocar alguns caracteres especiais como ( _ e $)e também maiúsculo e minúsculo (lembrando é sensitive case):

// funciona
Nome
nome
_nome

3 – Porém os outros caracteres especiais não funcionam:

// Não funciona
^nome
Dener@troquatte
#jogoDaVelha

4 – Como eu falei, ele é case sensitive:

// Não é a mesma coisa
Nome
nome
NOME

5 – Não pode conter palavras reservadas:

if
Enum

Agora vamos falar um pouquinho de convenções e como deixar o código parecendo que foi escrito por uma pessoa só.

Mas lembre-se, tudo vai de como a sua equipe adotou as estratégias de escrita de código.

Podemos usar camelcase que é mais usado para nomes de functios, parâmetros, métodos e outras coisas:

// Camel case
denerTroquatte

Agora em pascal case é tipicamente usamos para enums e classes:

// Pascal case
DenerTroquatte

Usamos esse tipo de escrita para nomes múltiplos e assim evitando o uso de outros artifícios para escrita.

Escopo

No TypeScript tudo que está dentro de chaves “{ }” está dentro do escopo dele.

function escrever() {
       let msg = “Dener Troquatte”
       console.log(msg);
}

No exemplo a variável “msg” está dentro da function só existe dentro do escopo dele e não pode ser usado fora, assim devemos nos preocupar onde será criado as variáveis.

Falamos um pouco sobre como escrever um código um pouco mais limpo e como seguir algumas convenções do TypeScript, o que usar para dar nomes e o que não usar para não ter qualquer tipo de erro.

Porém como foi dito no texto acima, tudo vai de como o seu time combinou de usar, o que pode variar muito de equipe para equipe.