0% acharam este documento útil (0 voto)
3 visualizações17 páginas

Introdução ao TypeScript: Tipos e Uso

Enviado por

Jazz
Direitos autorais
© All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
0% acharam este documento útil (0 voto)
3 visualizações17 páginas

Introdução ao TypeScript: Tipos e Uso

Enviado por

Jazz
Direitos autorais
© All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd

Professor: Arnaldo Coelho T. Junior arnaldojunior1991@gmail.

com

TypeScript
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

O que é?
 Linguagem de programação fortemente tipada;

 Adiciona sintaxe sobre o JavaScript permitindo o


uso de tipos;

 Permite especificar os tipos dos dados que estão


sendo passados ao longo do código;

 Reporta erros quando os tipos não batem;

 Possui checagem de tipo em tempo de


compilação.
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Como usar?
 Comumente, utiliza-se o compilador TypeScript
oficial, que transpila código TypeScript em
JavaScript;

 Pode ser instalado através do npm:

npm install typescript --save-dev

 npx tsc – exibe a versão do compilador.


Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Configurando o Compilador
A configuração é feita no arquivo [Link];

O arquivo acima pode ser criado através do


comando:

npx tsc --init

 Exemplo:
{
"include": ["src"],
"compilerOptions": {
"outDir": "./build"
}
}
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Tipos simples (primitivos)


3 tipos principais:
 boolean: true ou false;
 number: números inteiros e decimais;
 string: textos.
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Formas de atribuição
 Explícita:

 Implícita:
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Erro na atribuição de tipo


 No exemplo abaixo será disparado um erro pelos
tipos não coincidirem:
let nome: string = “Arnaldo";
nome = 31;

 No JavaScript, isto não gera mensagem de erro.


Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Tipos especiais
 any: desabilita a verificação de tipos;
 unknown: para tipos de dados desconhecidos;
 never: lança um erro se a variável nunca foi
atribuída;
 undefined: equivalente ao mesmo tipo no
JavaScript.
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Arrays
 Sintaxe específica para definir arrays:
const names: string[] = [];
[Link]("Dylan");
// [Link](3); // Erro: Argumento do tipo ‘number’
não é atribuível para parâmetro do tipo ‘string’.

 Readonly: impede que arrays sejam


modificados;
const names: readonly string[] = ["Dylan"];
[Link]("Jack"); // Erro: 'push' não existe no tipo
'readonly string[]'.
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Tuplas
É um array “tipado” com tipos predefinidos para
cada índice;
 Permite que cada elemento no array tenha seu
próprio tipo de valor;
// define uma tupla
let tupla: [number, boolean, string];

// inicializa a tupla
tupla = [10, true, ‘Professor Arnaldo'];
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Tuplas Nomeadas
 Permite prover contexto para os valores de cada
índice:
const graph: [x: number, y: number] = [55.2, 41.3];
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Objetos
A sintaxe específica para definir objetos é:
const carro: { tipo: string, modelo: string, ano: number } = {
tipo: "Toyota",
modelo: "Corolla",
ano: 2009
};

 Com propriedade opcional:


const carro: { marca: string, ano?: number } = { // sem erro
marca: "Toyota"
};
[Link] = 2000;
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Funções
O tipo do valor de retorno precisa ser definido:
function getTime(): number {
return new Date().getTime();
}

 Função sem retorno:


function printHello(): void {
[Link]('Hello!');
}
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Funções
 Parâmetros opcionais:
function add(a: number, b: number, c?: number) {
return a + b + (c || 0);
}

 Parâmetros padrões:
function pow(value: number, exponent: number = 10) {
return value ** exponent;
}
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

União | (OR)
 Quando o valor pode ter mais de um tipo:
function printStatusCode(code: string | number) {
[Link](`My status code is ${code}.`)
}
printStatusCode(404);
printStatusCode('404');
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Casting (as)
 Sobrescreve o tipo de uma variável:
let x: unknown = 'hello';
[Link]((x as string).length);
ou
let x: unknown = 'hello';
[Link]((<string>x).length);
Professor: Arnaldo Coelho T. Junior arnaldojunior1991@[Link]

Classes
class Pessoa {
private nome: string;

public constructor(nome: string) {


[Link] = nome;
}

public getNome(): string {


return [Link];
}
}

const pessoa = new Pessoa("Jane");


[Link]([Link]());

Você também pode gostar