Introdução ao TypeScript: A Linguagem de Alto Nível para pessoas Desenvolvedoras Web

O TypeScript é uma linguagem de programação que tem se tornado cada vez mais popular entre desenvolvedores web. Criada pela Microsoft, é uma extensão do JavaScript que oferece recursos poderosos de tipagem estática, melhorando a produtividade do desenvolvedor e aumentando a qualidade e robustez do código.

Neste texto, vamos explorar os conceitos básicos do TypeScript e exemplos práticos para aqueles que desejam aprender e começar a utilizar essa linguagem.

Vamos lá!

1. O que é TypeScript?

O TypeScript é uma linguagem de código aberto desenvolvida pela Microsoft e lançada em 2012. É baseada em JavaScript, mas traz a adição de tipos estáticos opcionais, o que permite aos desenvolvedores especificar o tipo de cada variável e parâmetro em seus programas. Esses tipos são verificados em tempo de compilação, fornecendo feedback imediato sobre possíveis erros e permitindo que os desenvolvedores encontrem e corrijam problemas antes mesmo de executar o código.

2. Configurando ambiente

Primeiro, vamos instalar nosso editor de códigos, Ha várias razões pelas quais o Visual Studio Code (VSCode) é amplamente recomendado como um editor de código, especialmente para desenvolvedores web e outras áreas de programação. Algumas dessas razões incluem:

Gratuito e de código aberto: O VSCode é totalmente gratuito e de código aberto, o que significa que você pode usá-lo sem custo e a comunidade de desenvolvedores pode contribuir com melhorias e correções de bugs.

Multiplataforma: O VSCode é compatível com Windows, macOS e Linux, garantindo que você possa utilizá-lo em qualquer sistema operacional de sua preferência.

Leve e rápido: O editor é conhecido por sua rapidez e eficiência. Ele inicia rapidamente, consome poucos recursos do sistema e oferece um desempenho excelente, mesmo em computadores mais antigos.

Interface de usuário amigável: O VSCode possui uma interface de usuário limpa e intuitiva, com menus, barras de ferramentas e atalhos de teclado bem organizados, tornando a navegação e a edição de código mais fáceis.

Suporte para diversas linguagens: Embora seja conhecido como um excelente editor para JavaScript e TypeScript, o VSCode oferece suporte para várias outras linguagens de programação, incluindo Python, Java, C++, PHP, Go e muitas outras. Além disso, graças à sua arquitetura extensível, você pode instalar extensões para ampliar a compatibilidade com linguagens adicionais.

Integração com Git: O VSCode tem integração nativa com o sistema de controle de versão Git, o que facilita muito o gerenciamento de repositórios Git diretamente do editor.

Abundância de extensões: A extensa biblioteca de extensões disponíveis para o VSCode permite que você personalize o editor de acordo com suas necessidades e preferências. Há extensões para depuração, formatação de código, snippets, temas e muito mais.

Depuração e Testes: O VSCode possui poderosas ferramentas de depuração, permitindo que você depure seu código passo a passo e monitore variáveis e expressões. Além disso, suporta a execução de testes unitários, tornando-o uma escolha popular entre desenvolvedores de testes.

Suporte a comunidade: O VSCode é apoiado por uma comunidade ativa de desenvolvedores, o que significa que há muitos recursos online, tutoriais, documentação e fóruns disponíveis para ajudar você a aproveitar ao máximo o editor.

Integração com ecossistema da Microsoft: Se você estiver desenvolvendo aplicativos usando tecnologias Microsoft, o VSCode oferece uma excelente integração com o ecossistema Microsoft, facilitando o desenvolvimento em plataformas como .NET e Azure.

Para instalar o Visual Studio Code (VSCode) em seu computador, siga as etapas abaixo dependendo do sistema operacional que você está usando:

Windows:

1. Acesse o site oficial do VSCode em https://code.visualstudio.com/.

2. Clique no botão "Download for Windows".

3. O download do instalador (`.exe`) começará automaticamente. Aguarde o término do download.

4. Após o download, clique duas vezes no arquivo baixado (`VSCodeSetup.exe`) para iniciar a instalação.

5. Siga as instruções do assistente de instalação. Você pode deixar as configurações padrão ou personalizá-las de acordo com suas preferências.

6. Concluída a instalação, o Visual Studio Code estará pronto para ser usado. Você pode encontrá-lo no menu Iniciar ou em sua área de trabalho.

macOS:

1. Acesse o site oficial do VSCode em https://code.visualstudio.com/.

2. Clique no botão "Download for macOS".

3. O download do arquivo `.zip` começará automaticamente. Aguarde o término do download.

4. Após o download, localize o arquivo baixado (geralmente na pasta "Downloads") e clique duas vezes para extrair o conteúdo.

5. Arraste o aplicativo "Visual Studio Code" para a pasta "Applications" (Aplicativos) para concluir a instalação.

6. Agora, você pode encontrar o Visual Studio Code em sua pasta de aplicativos e abri-lo a partir daí.

Linux:

As instruções de instalaçao para Linux podem variar de acordo com a distribuição específica que você está usando. Abaixo estão as instruções para instalar o VSCode nas distribuições mais populares:

Ubuntu/Debian:

1. Acesse o site oficial do VSCode em https://code.visualstudio.com/

2. Clique no botão "Download for Linux".

3. Escolha a opção `.deb` para sistemas baseados em Debian.

4. O download do pacote `.deb` começará automaticamente. Aguarde o término do download.

5. Após o download, abra o terminal e navegue até o diretório onde o arquivo foi baixado.

6. Instale o pacote `.deb` usando o comando:

sudo dpkg -i nome_do_arquivo.deb

Fedora/RHEL:

1. Acesse o site oficial do VSCode em https://code.visualstudio.com/

2. Clique no botão "Download for Linux".

3. Escolha a opção `.rpm` para sistemas baseados em Fedora.

4. O download do pacote `.rpm` começará automaticamente. Aguarde o término do download.

5. Após o download, abra o terminal e navegue até o diretório onde o arquivo foi baixado.

6. Instale o pacote `.rpm` usando o comando:

sudo dnf install nome_do_arquivo.rpm

Outras distribuições Linux:

Para outras distribuições Linux, você pode encontrar pacotes para o VSCode em seus repositórios oficiais ou seguir as instruções de instalação no site do VSCode.

Após a conclusão da instalação, você pode abrir o Visual Studio Code e começar a utilizá-lo para desenvolvimento de código. O VSCode é um editor altamente versátil, com uma variedade de extensões disponíveis para personalização, suporte a várias linguagens de programação e uma interface amigável que o torna uma excelente escolha para muitos desenvolvedores.

Antes de começarmos a escrever código TypeScript, precisamos instalá-lo em nosso ambiente de desenvolvimento. O TypeScript pode ser instalado através do gerenciador de pacotes npm, que geralmente é instalado junto com o Node.js. Para instalar o TypeScript globalmente em sua máquina, basta executar o seguinte comando:

npm install -g typescript

Para instalar o Node.js na sua máquina, siga os passos abaixo:

1. Acesse o site oficial do Node.js:

2. Visite o site oficial do Node.js em https://nodejs.org.

3. Baixe o instalador:

Na página principal do site, você verá duas versões do Node.js: a versão LTS (Long-Term Support) e a versão atual (Current). A versão LTS é recomendada para a maioria dos usuários, pois oferece estabilidade e suporte a longo prazo.

4. Escolha a versão que deseja instalar e clique no botão de download correspondente.

5. Execute o instalador:

Após o download do instalador, execute-o clicando duas vezes no arquivo baixado. O instalador irá guiá-lo pelo processo de instalação.

6. Aceite os termos de licença:

Durante a instalação, você será solicitado a aceitar os termos de licença do Node.js. Leia-os e clique em "Next" ou "Concordo" para prosseguir.

7. Escolha o local de instalação:

8. Selecione a pasta onde deseja instalar o Node.js ou simplesmente aceite a pasta padrão sugerida pelo instalador. Clique em "Next" ou "Instalar".

9. Aguarde a conclusão da instalação:

10. Aguarde até que o processo de instalação seja concluído. Isso pode levar alguns minutos, dependendo da velocidade do seu computador.

11. Verifique a instalação:

12. Após a conclusão da instalação, você pode verificar se o Node.js foi instalado corretamente abrindo o terminal ou prompt de comando e digitando os seguintes comandos:

node -v

npm -v

Se tudo estiver instalado corretamente, você verá as versões do Node.js e do npm sendo exibidas no terminal.

Pronto! Agora você tem o Node.js instalado em sua máquina e pode começar a desenvolver aplicativos JavaScript ou TypeScript. O npm (Node Package Manager) também foi instalado junto com o Node.js, permitindo que você instale e gerencie pacotes e bibliotecas de terceiros facilmente.

3. Primeiro Exemplo em TypeScript

Vamos começar com um exemplo simples para entender a sintaxe básica do TypeScript. Crie um novo arquivo chamado "hello.ts" e adicione o seguinte código:

function sayHello(name: string) {

return `Hello, ${name}!`;

}

const personName: string = "Alice";

console.log(sayHello(personName));

Aqui, declaramos uma função chamada `sayHello`, que recebe um parâmetro `name` do tipo `string` e retorna uma saudação personalizada. Em seguida, criamos uma variável `personName` do tipo `string` e a utilizamos como argumento para a função `sayHello`. A compilação desse código acontecerá sem problemas, pois as variáveis e parâmetros estão devidamente tipados.

4. Tipos Basicos

O TypeScript suporta diversos tipos básicos, que podem ser usados para declarar as variáveis de acordo com suas características. Alguns dos tipos mais comuns incluem:

Tipo `number`:

Em TypeScript, o tipo básico `number` é usado para representar valores numéricos, incluindo números inteiros e números de ponto flutuante (decimais). Esse tipo é muito semelhante ao tipo `number` do JavaScript, mas com a adição da verificação de tipo estático fornecida pelo TypeScript.

Vamos explorar algumas características importantes do tipo `number` no TypeScript:

Declaração de variáveis do tipo number:

let age: number;

let pi: number = 3.14;

Nesse exemplo, declaramos duas variáveis: `age` e `pi`. Ambas são do tipo `number`. A primeira variável foi declarada sem atribuir um valor inicial, enquanto a segunda recebeu o valor `3.14`.

Operações matemáticas:

O tipo `number` suporta todas as operações matemáticas comuns, como adição, subtração, multiplicação e divisão:

let a: number = 10;

let b: number = 5;

let sum: number = a + b; // 15

let difference: number = a - b; // 5

let product: number = a * b; // 50

let quotient: number = a / b; // 2

Outras operações:

Além das operações matemáticas básicas, o tipo `number` também suporta outras operações, como incremento (`++`) e decremento (`--`):

let x: number = 10;

x++; // x agora é 11

x--; // x agora é 10 novamente

NaN e Infinity:

Assim como no JavaScript, o TypeScript também suporta valores especiais como `NaN` (Not-a-Number) e `Infinity` (infinito):

let result: number = 0 / 0; // result é NaN

let infinityValue: number = Infinity;

Verificação de tipo:

Uma das principais vantagens do TypeScript é a verificação de tipo estático. Isso significa que, se você tentar atribuir um valor não numérico a uma variável do tipo `number`, o TypeScript emitirá um erro:

let age: number = "25"; // Erro: Type 'string' is not assignable to type 'number'.

Essa verificação ajuda a evitar erros comuns em tempo de execução e torna o código mais seguro e previsível.

Valores Literais:

No TypeScript, você pode usar valores literais numéricos para declarar uma variável com um valor específico:

let dayOfWeek: 1 | 2 | 3 | 4 | 5 | 6 | 7 = 3; // Apenas valores 1 a 7 são permitidos

Nesse exemplo, a variável `dayOfWeek` só pode ter os valores 1 a 7, pois especificamos um tipo de união literal usando `|`

Tipo `string`:

Em TypeScript, o tipo básico `string` é usado para representar valores de texto, ou seja, sequências de caracteres. Esse tipo é usado para manipular dados como palavras, frases, sentenças e qualquer outro conteúdo textual.

Declaração de variáveis do tipo string:

Você pode declarar variáveis do tipo `string` da seguinte forma:

let nome: string;

let mensagem: string = "Olá, mundo!";

Na primeira declaração, a variável `nome` é declarada, mas não é atribuído um valor inicial. Nesse caso, a variável tem o valor inicial `undefined`. Na segunda declaração, a variável `mensagem` é inicializada com a string `"Olá, mundo!"`.

Concatenação de strings:

O TypeScript permite a concatenação de strings usando o operador `+`:

let saudacao: string = "Olá";

let nome: string = "João";

let mensagem: string = saudacao + " " + nome; // "Olá João"

Template Strings:

O TypeScript também suporta o uso de template strings (ou template literals) com a sintaxe de `${}`. Isso permite inserir expressões dentro de uma string delimitada por crases (\`...\`), facilitando a interpolação de variáveis e expressões em uma string:

let nome: string = "Alice";

let idade: number = 30;

let apresentacao: string = `Meu nome é ${nome} e tenho ${idade} anos.`;

// "Meu nome é Alice e tenho 30 anos."

Comprimento de uma string:

Para obter o comprimento de uma string, você pode usar a propriedade `length`:

let texto: string = "Hello, world!";

let comprimento: number = texto.length; // 13

Verificação de tipo:

A verificação de tipo estático do TypeScript também se aplica ao tipo `string`. Se você tentar atribuir um valor de tipo não string a uma variável do tipo `string`, o TypeScript emitirá um erro:

let nome: string = 25; // Erro: Type 'number' is not assignable to type 'string'

Tipo `boolean`:

Em TypeScript, o tipo básico `boolean` é usado para representar valores verdadeiros (`true`) ou falsos (`false`). Esse tipo é fundamental quando você precisa trabalhar com lógica condicional e controle de fluxo em seus programas.

Declaração de variáveis do tipo boolean:

Você pode declarar variáveis do tipo `boolean` da seguinte forma:

let isAtivo: boolean;

let temPermissao: boolean = true;

Na primeira declaração, a variável `isAtivo` é declarada, mas não é atribuído um valor inicial. Nesse caso, a variável tem o valor inicial `undefined`. Na segunda declaração, a variável `temPermissao` é inicializada com o valor `true`.

Operações lógicas:

O tipo `boolean` suporta operações lógicas como `&&` (e), `||` (ou) e `!` (negação).

let temIdadeMinima: boolean = true;

let temCarteiraEstudante: boolean = false;

let podeEntrar: boolean = temIdadeMinima && temCarteiraEstudante; // false

let podeTerDesconto: boolean = temIdadeMinima || temCarteiraEstudante; // true

let naoTemCarteiraEstudante: boolean = !temCarteiraEstudante; // true

Verificação de tipo:

A verificação de tipo estático do TypeScript também se aplica ao tipo `boolean`. Se você tentar atribuir um valor nao booleano a uma variável do tipo `boolean`, o TypeScript emitirá um erro:

let isAtivo: boolean = "sim"; // Erro: Type 'string' is not assignable to type 'boolean'.

Valores truthy e falsy:

Em JavaScript e, portanto, em TypeScript, existem valores "truthy" e "falsy". Valores truthy são aqueles que são avaliados como verdadeiros em contextos booleanos, enquanto valores falsy são avaliados como falsos.

Os seguintes valores são considerados "falsy" em JavaScript e são tratados como `false` em contextos booleanos:

- `false`

- `0`

- `""` (string vazia)

- `null`

- `undefined`

- `NaN`

Todos os outros valores são considerados "truthy" e são tratados como `true` em contextos booleanos.

let valorFalsy: boolean = false; // false

let valorTruthy: boolean = 10; // true

Tipo `array`:

Em TypeScript, o tipo básico `Array` (ou `[]`) é usado para representar uma lista ou coleção de elementos do mesmo tipo. Isso permite que você trabalhe com conjuntos de dados e realize operações em várias entradas de uma só vez.

Declaração de variáveis do tipo Array:

Você pode declarar variáveis do tipo `Array` de algumas maneiras diferentes:

let numeros: number[]; // Declaração com tipo de elemento

let nomes: Array<string>; // Outra forma de declaração, usando a sintaxe de generic

let frutas: Array<string> = ["maçã", "banana", "laranja"]; // Inicialização com elementos

Na primeira declaração, a variável `numeros` é declarada como uma lista vazia de números. Na segunda declaração, a variável `nomes` também é uma lista vazia, mas com elementos do tipo `string`. Na terceira declaração, a variável `frutas` é inicializada com uma lista de três strings representando diferentes tipos de frutas.

Acessando elementos do Array:

Você pode acessar os elementos de um Array usando o índice entre colchetes:

let frutas: string[] = ["maçã", "banana", "laranja"];

let primeiraFruta: string = frutas[0]; // "maçã"

let segundaFruta: string = frutas[1]; // "banana"

Adicionando e removendo elementos do Array:

Você pode adicionar ou remover elementos de um Array usando métodos específicos, como `push()`, `pop()`, `shift()` e `unshift()`:

let frutas: string[] = ["maçã", "banana"];

frutas.push("laranja"); // Adiciona "laranja" no final do Array

frutas.pop(); // Remove o último elemento do Array ("laranja")

frutas.unshift("abacaxi"); // Adiciona "abacaxi" no início do Array

frutas.shift(); // Remove o primeiro elemento do Array ("abacaxi")

Verificação de tipo:

O TypeScript também fornece verificação de tipo para Arrays. Por exemplo, se voce tentar atribuir um valor que não é do tipo do Array, o TypeScript emitirá um erro:

let numeros: number[] = [1, 2, 3];

numeros.push("quatro"); // Erro: Argument of type 'string' is not assignable to parameter of type 'number'.

Operações com Arrays:

O TypeScript suporta várias operações úteis em Arrays, como `map()`, `filter()`, `reduce()` e muitas outras, que permitem manipular e transformar os elementos de um Array de forma fácil e expressiva.

let numeros: number[] = [1, 2, 3, 4, 5];

let quadrados: number[] = numeros.map((num) => num * num); // [1, 4, 9, 16, 25]

let pares: number[] = numeros.filter((num) => num % 2 === 0); // [2, 4]

let soma: number = numeros.reduce((acc, num) => acc + num, 0); // 15

Tipo `tuple`:

Em TypeScript, o tipo básico `tuple` é usado para representar uma estrutura de dados que consiste em uma sequência fixa de elementos de diferentes tipos. Ao contrario dos arrays, onde todos os elementos têm o mesmo tipo, as tuplas permitem definir o tipo de cada elemento individualmente.

Declaração de tuplas:

Você pode declarar uma tupla utilizando colchetes `[]` com os tipos dos elementos entre parênteses:

let tupla: [string, number, boolean];

tupla = ["texto", 10, true];

Nesse exemplo, a variável `tupla` é uma tupla que pode conter um valor `string`, um valor `number` e um valor `boolean`, nesta ordem específica.

Acesso a elementos da tupla:

Você pode acessar os elementos da tupla utilizando índices numéricos, assim como em um array:

let tupla: [string, number];

tupla = ["texto", 10];

let primeiroElemento: string = tupla[0]; // "texto"

let segundoElemento: number = tupla[1]; // 10

Modificando elementos da tupla:

As tuplas permitem a modificação de elementos individuais, desde que sejam do mesmo tipo definido na declaração original:

let tupla: [string, number];

tupla = ["texto", 10];

tupla[0] = "outroTexto";

tupla[1] = 20;

Restrições de comprimento:

As tuplas têm um comprimento fixo, determinado pela quantidade de tipos fornecidos na declaração. Isso significa que você não pode adicionar ou remover elementos da tupla como faria com arrays.

let tupla: [string, number] = ["texto", 10];

tupla.push("novoElemento"); // Erro: Property 'push' does not exist on type '[string, number]'.

tupla.pop(); // Erro: Property 'pop' does not exist on type '[string, number]'.

Conversão de array para tupla:

Você pode converter um array em uma tupla usando type assertion (conversão de tipo):

let arrayNumeros: number[] = [1, 2, 3];

let tuplaNumeros: [number, number, number] = arrayNumeros as [number, number, number];

Tipo `enum`:

Em TypeScript, o tipo básico `enum` (enumeração) é usado para criar um conjunto de valores nomeados com valores associados. Ele permite definir um conjunto de constantes com nomes mais descritivos, tornando o código mais legível e fácil de entender.

Declaração de enums:

Para criar um enum, você pode usar a palavra-chave `enum` seguida dos nomes dos valores entre chaves:

enum DiaDaSemana {

Domingo,

Segunda,

Terça,

Quarta,

Quinta,

Sexta,

Sábado,

}

Neste exemplo, definimos um enum chamado `DiaDaSemana` com sete valores: `Domingo`, `Segunda`, `Terça`, `Quarta`, `Quinta`, `Sexta` e `Sábado`. Os valores do enum são números inteiros, começando do 0 por padrão, mas você pode definir valores específicos para cada elemento, conforme mostrarei a seguir.

Atribuição de valores específicos aos elementos do enum:

Você pode atribuir valores específicos a cada elemento do enum. Por padrão, eles serão incrementados a partir do valor inicial de 0, mas você pode definir valores personalizados para cada elemento:

enum DiaDaSemana {

Domingo = 1,

Segunda = 2,

Terça = 3,

Quarta = 4,

Quinta = 5,

Sexta = 6,

Sábado = 7,

}

Nesse exemplo, atribuímos explicitamente os valores de 1 a 7 aos elementos do enum `DiaDaSemana`.

Acesso aos elementos do enum:

Você pode acessar os elementos do enum pelo seu nome ou pelo valor numérico associado:

enum DiaDaSemana {

Domingo,

Segunda,

Terça,

Quarta,

Quinta,

Sexta,

Sábado,

}

let dia: DiaDaSemana = DiaDaSemana.Segunda;

console.log(dia); // 1

let valor: number = DiaDaSemana.Terça;

console.log(valor); // 2

Uso de enums em condicionais:

Os enums podem ser úteis em condicionais, tornando o código mais legível:

enum DiaDaSemana {

Domingo,

Segunda,

Terça,

Quarta,

Quinta,

Sexta,

Sábado,

}

let dia: DiaDaSemana = DiaDaSemana.Quinta;

if (dia === DiaDaSemana.Sábado || dia === DiaDaSemana.Domingo) {

console.log("Fim de semana!");

} else {

console.log("Dia útil.");

}

Tipo `any`:

Com certeza! Em TypeScript, o tipo básico `any` é um tipo especial que representa um valor que pode ser de qualquer tipo. Quando uma variável é do tipo `any`, você pode atribuir a ela qualquer valor sem a verificação de tipo estático do TypeScript.

Uso do tipo `any`:

O tipo `any` é geralmente usado quando você não conhece o tipo de dado que será armazenado na variável ou quando está trabalhando com código legado que não possui tipagem adequada. Também pode ser útil em situações em que você está migrando gradualmente um código JavaScript para TypeScript e ainda não definiu os tipos completos.

let valorQualquer: any;

valorQualquer = 10; // number

valorQualquer = "Olá"; // string

valorQualquer = true; // boolean

Neste exemplo, a variável `valorQualquer` é do tipo `any`, permitindo que você atribua a ela valores de diferentes tipos em diferentes momentos.

Perda de checagem de tipo:

Uma desvantagem do tipo `any` é que ele desativa a verificação de tipo estático do TypeScript para a variável em questão. Isso significa que, se você usar o tipo `any`, perderá os benefícios da verificação de tipo estático, que é uma das principais vantagens do TypeScript.

let valorQualquer: any = 10;

console.log(valorQualquer.toUpperCase()); // Não há erro, mas em tempo de execução ocorrerá um erro: valorQualquer.toUpperCase is not a function

Neste exemplo, embora `toUpperCase()` seja um método de strings, não ocorre um erro em tempo de compilação devido ao uso do tipo `any`, mas em tempo de execução ocorrerá um erro porque `toUpperCase()` não é um método de números.

Evitando o uso excessivo do tipo `any`:

Embora o tipo `any` seja útil em algumas situações específicas, é recomendado evitá-lo sempre que possível, pois ele pode levar à perda de segurança e previsibilidade no seu código TypeScript. Em vez disso, é melhor usar tipos mais específicos sempre que possível para aproveitar as vantagens da verificação de tipo estático e obter mais segurança e confiabilidade no código.

Se você precisar lidar com valores que podem ter tipos diferentes, pode usar tipos de união (`|`) ou tipos genéricos para garantir uma melhor tipagem.

let valor: number | string;

valor = 10; // OK

valor = "Olá"; // OK

valor = true; // Erro: Type 'boolean' is not assignable to type 'string | number'.

5. Funções com Tipos

Em TypeScript, também é possível definir os tipos dos parâmetros e do valor de retorno das funções. Vamos exemplificar:

function addNumbers(num1: number, num2: number): number {

return num1 + num2;

}

function greet(name: string): void {

console.log(`Hello, ${name}!`);

}

function multiplyByTwo(num: number): number {

return num * 2;

}

Na primeira função, `addNumbers`, declaramos que os parâmetros `num1` e `num2` são do tipo `number`, e que o valor de retorno da função também é do tipo `number`. Isso permite que o TypeScript faça verificações de tipos durante a compilação.

Na segunda função, `greet`, o tipo de retorno é especificado como `void`, o que significa que a função não retorna nenhum valor.

Na terceira função, `multiplyByTwo`, o parâmetro `num` é do tipo `number`, e o valor de retorno também é `number`. Com essa informação, o TypeScript nos ajuda a evitar erros, garantindo que apenas números sejam passados como argumentos e que a função retorne um valor numérico.

6. Interfaces e Tipos Personalizados

O TypeScript permite criar tipos personalizados através de interfaces. As interfaces definem a estrutura de um objeto, especificando os nomes das propriedades e seus tipos. Vamos ver como criar e utilizar interfaces:

interface Person {

name: string;

age: number;

email?: string; // Propriedade opcional

}

function displayPersonInfo(person: Person) {

console.log(`Name: ${person.name}`);

console.log(`Age: ${person.age}`);

if (person.email) {

console.log(`Email: ${person.email}`);

}

}

const person1: Person = {

name: "Alice",

age: 30,

};

const person2: Person = {

name: "Bob",

age: 25,

email: "bob@example.com",

};

Aqui, definimos uma interface chamada `Person`, com propriedades `name` e `age` de tipos `string` e `number`, respectivamente. A propriedade `email` é opcional, indicada pelo símbolo `?`.

Em seguida, utilizamos essa interface para declarar objetos `person1` e `person2`. O TypeScript nos alertaria se esquecêssemos de incluir alguma das propriedades obrigatórias ou se tentássemos adicionar uma propriedade inexistente.

7. Classes em TypeScript

O TypeScript suporta programação orientada a objetos com a definição de classes. Vamos criar uma classe simples para representar uma forma geométrica e calcular a área:

class Shape {

private width: number;

private height: number;

constructor(width: number, height: number) {

this.width = width;

this.height = height;

}

getArea(): number {

return this.width * this.height;

}

}

const rectangle = new Shape(5, 10);

console.log("Rectangle Area:", rectangle.getArea());

Com este guia, espero poder ajudar você nessa jornada com o TypeScript!