From e72e36fe839b5f308aa24b0c22ac36a5ded73c44 Mon Sep 17 00:00:00 2001 From: luk3skyw4lker Date: Sun, 16 Jan 2022 18:46:15 -0300 Subject: [PATCH 1/6] Add pt-br TS for Functional Programmers.md --- .../TS for Functional Programmers.md | 503 ++++++++++++++++++ 1 file changed, 503 insertions(+) create mode 100644 docs/documentation/pt/get-started/TS for Functional Programmers.md diff --git a/docs/documentation/pt/get-started/TS for Functional Programmers.md b/docs/documentation/pt/get-started/TS for Functional Programmers.md new file mode 100644 index 00000000..b91d7eaf --- /dev/null +++ b/docs/documentation/pt/get-started/TS for Functional Programmers.md @@ -0,0 +1,503 @@ +--- +title: TypeScript para Programadores Funcionais +short: TS para Programadores Funcionais +layout: docs +permalink: /pt/docs/handbook/typescript-in-5-minutes-func.html +oneline: Aprenda Typescript se você tiver uma história com programação funcional +--- + +Typescript começou sua vida numa tentativa de trazer tipos tradicionalmente orientados a objeto para o JavaScript para que os programadores na Microsoft pudessem trazer programas tradicionalmente orientados a objeto para a web. Conforme foi se desenvolvendo, o sistema de tipos do Typescript evoluiu para código modelo escrito por JavaScripters nativos. O sistema resultante é poderoso, interessante e confuso. + +Essa introdução foi desenvolvida para ajudar programadores Haskell ou ML que querem aprender Typescript. Ela descreve como o sistema de tipos do Typescript difere do sistema de tipos do Haskell. Ela também descreve as funcionalidades únicas do sistema de tipos do Typescript que tem ascendência na modelagem de código JavaScript. + +Essa introdução não cobre programação orientada a objeto. Na prática, programação orientada a objeto em Typescript é similar a outras linguagens populares com funcionalidades OO. + +## Pré-requisitos + +Nessa introdução, eu assumo que você tenha os seguintes conhecimentos: + +- Como programar em JavaScript, as boas partes. +- Sintaxe de tipo de uma linguagem descendente do C. + +Se você precisa aprender as boas partes do Javascript, leia [JavaScript: As Boas Partes](https://shop.oreilly.com/product/9780596517748.do). Você pode ser capaz de pular o livro se você sabe como escrever programas em uma linguagem com escopo léxico de chamada-por-valor com muita mutabilidade e não muito mais. [R4RS Scheme](https://people.csail.mit.edu/jaffer/r4rs.pdf) é um bom exemplo. + +[A Linguagem de Programação C++](http://www.stroustrup.com/4th.html) é um bom lugar para aprender sobre sintaxe no estilo C. Diferente do C++, Typescript usa tipos pós-fixados, como: `x: string` ao invés de `string x`. + +## Conceitos que não estão em Haskell + +## Tipos Nativos + +JavaScript define 8 tipos nativos: + +| Type | Explanation | +| ----------- | ---------------------------------------------- | +| `Number` | um ponto flutuante de dupla precisão IEEE 754. | +| `String` | uma string imutável UTF-16. | +| `BigInt` | inteiros no formato de precisão arbitrário. | +| `Boolean` | `true` e `false`. | +| `Symbol` | um valor único usado como uma chave. | +| `Null` | equivalente ao tipo unit. | +| `Undefined` | também equivalente ao tipo unit. | +| `Object` | similar aos records. | + +[Veja a MDN para mais detalhes](https://developer.mozilla.org/docs/Web/JavaScript/Data_structures). + +Typescript tem os tipos primitivos correspondentes para os tipos nativos: + +- `number` +- `string` +- `bigint` +- `boolean` +- `symbol` +- `null` +- `undefined` +- `object` + +### Outros tipos importantes do Typescript + +| Type | Explanation | +| -------------- | ----------------------------------------------------------------- | +| `unknown` | o tipo do topo. | +| `never` | o tipo do final. | +| object literal | eg `{ property: Type }` | +| `void` | um subtipo de `undefined` para ser usado como um tipo de retorno. | +| `T[]` | arrays mutáveis, também escritos como `Array` | +| `[T, T]` | tuplas, que tem tamanho fixado mas são mutáveis | +| `(t: T) => U` | funções | + +Notas: + +4. Sintaxe de funções incluem os nomes dos parâmetros. É bem difícil se acostumar com isso! + + ```ts + let fst: (a: any, b: any) => any = (a, b) => a; + + // ou mais precisamente: + + let fst: (a: T, b: U) => T = (a, b) => a; + ``` + +5. Sintaxe de tipo literal de objeto espelha precisamente a sintaxe de valor de objeto literal: + + ```ts + let o: { n: number; xs: object[] } = { n: 1, xs: [] }; + ``` + +6. `[T, T]` é um subtipo de `T[]`. Isso é diferente em Haskell, onde tuplas não são relacionadas a listas. + +### Tipos em caixas + +Javascript tem tipos em caixas equivalentes aos tipos primitivos que contém métodos que os programadores associam com esses tipos. Typescript reflete isso com, por exemplo, a diferença entre o tipo primitivo `number` e o tipo em caixa `Number`. Os tipos em caixa raramente são necessários, já que seus métodos retornam primitivos. + +```ts +(1).toExponential(); +// é equivalente a +Number.prototype.toExponential.call(1); +``` + +Note que para chamar um método em um numérico literal ele tem que estar entre parênteses para auxiliar o tradutor. + +## Tipagem gradual + +Typescript usa o tipo `any` sempre que não pode dizer qual deveria ser o tipo de uma expressão. Comparado ao `Dynamic`, chamar o `any` de um tipo é um exagero. Ele apenas desativa o verificador de tipo onde quer que apareça. Por exemplo, você pode inserir qualquer valor em um `any[]` sem marcar o valor de nenhuma forma: + +```ts twoslash +// com "noImplicitAny": false no tsconfig.json, anys: any[] +const anys = []; +anys.push(1); +anys.push('oh não'); +anys.push({ qualquer: 'coisa' }); +``` + +E você pode usar expressões do tipo `any` em qualquer lugar: + +```ts +anys.map(anys[1]); // oh não, "oh não" não é uma função +``` + +`any` é contagioso, também — se você inicializar uma variável com uma expressão do tipo `any`, a variável tem o tipo `any` também. + +```ts +let sepsis = anys[0] + anys[1]; // isso poderia significar qualquer coisa +``` + +Para ter um erro quando o Typescript produzir um `any`, use `"noImplicitAny": true`, ou `"strict": true` no `tsconfig.json`. + +## Tipagem estrutural + +Tipagem estrutural é um conceito familiar para a maioria dos programadores funcionais, mesmo que Haskell e a maior parte das MLs não são estrturalmente tipadas. Sua forma básica é bem simples: + +```ts +// @strict: false +let o = { x: 'olá', extra: 1 }; // ok +let o2: { x: string } = o; // ok +``` + +Aqui, o objeto literal `{ x: "hi", extra: 1 }` tem um tipo literal correspondente `{ x: string, extra: number }`. Esse tipo é atribuível à `{ x: string }` já que tem todas as propriedades requisitadas e essas propriedades tem tipos atribíveis. A propriedade extra não tem nenhuma atribuição anterior, apenas forma um subtipo de `{ x: string }`. + +Tipos nomeados apenas dão um nome a um tipo; para propósitos de atribuição não há nenhuma diferença entre o nome de tipo `Um` e a interface de tipo `Dois` abaixo. Eles ambos tem uma propriedade `p: string`. (Nomes de tipos se comportam diferente de interfaces com respeito a definições recursivas e parâmetros de tipo entretanto.) + +```ts twoslash +// @errors: 2322 +type Um = { p: string }; +interface Dois { + p: string; +} +class Tres { + p = 'Olá'; +} + +let x: Um = { p: 'oi' }; +let dois: Dois = x; +dois = new Tres(); +``` + +## Uniões + +Em Typescript, os tipos uniões são marcados. Em outras palavras, eles não são uniões discriminadas como `data` em Haskell. Entretanto, você pode frequentemente discriminar tipos em uma união usando tags nativas ou outras propriedades. + +```ts twoslash +function começar( + arg: string | string[] | (() => string) | { s: string } +): string { + // isso é super comum em Javascript + if (typeof arg === 'string') { + return casoComum(arg); + } else if (Array.isArray(arg)) { + return arg.map(casoComum).join(','); + } else if (typeof arg === 'function') { + return casoComum(arg()); + } else { + return casoComum(arg.s); + } + + function casoComum(s: string): string { + // finalmente, apenas converta uma string para outra string + return s; + } +} +``` + +`string`, `Array` e `Function` têm predicados de tipos nativos, levando convenientemente o tipo objeto para a ramificação `else`. É possível, entretanto, gerar uniões que são difíceis de diferenciar em tempo de execução, para código novo, é melhor construir apenas uniões discriminadas. + +Os seguintes tipos tem predicados nativos: + +| Tipo | Predicado | +| --------- | ---------------------------------- | +| string | `typeof s === "string"` | +| number | `typeof n === "number"` | +| bigint | `typeof m === "bigint"` | +| boolean | `typeof b === "boolean"` | +| symbol | `typeof g === "symbol"` | +| undefined | `typeof undefined === "undefined"` | +| function | `typeof f === "function"` | +| array | `Array.isArray(a)` | +| object | `typeof o === "object"` | + +Note que funções e arrays são objetos em tempo de execução, porém tem seus próprios predicados. + +### Intersecções + +Em adição a uniões, Typescript também tem intersecções: + +```ts twoslash +type Combinada = { a: number } & { b: string }; +type Conflitante = { a: number } & { a: string }; +``` + +`Combinada` tem duas propriedades, `a` e `b`, como se tivessem sido escritas como um único tipo de objeto literal. Intersecções e uniões são recursivas em casos de conflito, então `Conflitante.a: number & string`. + +## Tipos unitários + +Tipos unitários são subtipos de tipos primitivos que contem exatamente um valor primitivo. Por exemplo, a string `foo` tem o mesmo tipo de `"foo"`. Jà que o JavaScript não tem enums nativas, é comum usar um conjunto de strings conhecidas. Uniões de tipos strings literais permitem que o TypeScript ter este padrão: + +```ts twoslash +declare function encher( + s: string, + n: number, + direction: 'esquerda' | 'direita' +): string; + +encher('hi', 10, 'esquerda'); +``` + +Quando necessário, o compilador _extende_ — converte para um super tipo — o tipo unitário para um tipo primitivo, como `"foo"` +para `string`. Isso acontece quando a mutabilidade é usada, que pode atrapalhar o uso de variáveis mutáveis: + +```ts twoslash +// @errors: 2345 +declare function encher( + s: string, + n: number, + direction: 'esquerda' | 'direita' +): string; +// ---cut--- +let s = 'direita'; +encher('hi', 10, s); // error: 'string' is not assignable to '"esquerda" | "direita"' +``` + +Como o erro acontece: + +- `"direita": "direita"` +- `s: string` pois `"direita"` expande para `string` quando atribuída para uma variável mutável. +- `string` não é atribuível para `"esquerda" | "direita"` + +Você pode resolver isso com uma notação de tipo para `s`, porém isso previne atribuições a `s` de variáveis que não são do tipo `"esquerda" | "direita"`. + +```ts twoslash +declare function encher( + s: string, + n: number, + direction: 'esquerda' | 'direita' +): string; +// ---cut--- +let s: 'esquerda' | 'direita' = 'direita'; +encher('hi', 10, s); +``` + +## Conceitos similares a Haskell + +## Tipagem contextual + +TypeScript tem alguns lugares óbvios onde ele pode inferir tipos, como declarações de variáveis: + +```ts twoslash +let s = 'Eu sou uma string!'; +``` + +Mas também infere tipos em alguns outros lugares que você pode não esperar se já trabalhou com outras linguagens com sintaxes baseadas em C: + +```ts twoslash +declare function map(f: (t: T) => U, ts: T[]): U[]; +let sns = map(n => n.toString(), [1, 2, 3]); +``` + +Aqui, `n: number` nesse exemplo também, apesar do fato que `T` e `U` não foram inferidas antes da chamada. Na verdade, antes de `[1,2,3]` ter sido usado para inferir `T=number`, o tipo de retorno de `n => n.toString()` é usado para inferir `U=string`, causando `sns` ter o tipo `string[]`. + +Note que inferência funcionará em qualquer ordem, mas o intellisense só funcionará da direita pra esquerda, então o TypeScript prefere declarar `map` com o array primeiro: + +```ts twoslash +declare function map(ts: T[], f: (t: T) => U): U[]; +``` + +Tipagem contextual também funciona de forma recursiva entre objetos literais, e em tipos unitários que seriam inferidos como `string` ou `number`. E pode inferir tipos de retorno do contexto: + +```ts twoslash +declare function rodar(thunk: (t: T) => void): T; +let i: { inferencia: string } = rodar(o => { + o.inferencia = 'INSIRA O ESTADO AQUI'; +}); +``` + +O tipo de `o` é determinado para ser `{ inferencia: string }` porque + +1. Inicializadores de declaração são contextualmente tipados pela delcaração do + tipo: `{ inference: string }`. +2. O tipo de retorno de uma chamada usa o tipo contextual para inferências, + então o compilador infere que `T={ inferencia: string }`. +3. Arrow functions usam a tipagem contextual para tipar seus parâmetros, + então o compilador entrega `o: { inferencia: string }`. + +E faz isso enquanto você está digitando, para que antes que você digite `o.`, você tem sugestões para a propriedade `inferencia`, junto com qualquer outras propriedades que você teria em um programa real. +Ao todo, essa feature pode fazer com que a inferência do TypeScript pareça um pouco como um motor de unificação de inferência de tipos, mas não é. + +## Apelidos de tipos + +Apelidos de tipos são meros apelidos, assim como `type` em Haskell. O compilador vai tentar usar o nome de apelido onde quer que tenha sido usado no código fonte, mas não vai ter sucesso sempre. + +```ts twoslash +type Tamanho = [number, number]; +let x: Tamanho = [101.1, 999.9]; +``` + +O equivalente mais próximo de `newtype` é uma _intersecção marcada_: + +```ts +type FString = string & { __compileTimeOnly: any }; +``` + +Uma `FString` é como uma string normal, exceto que o compilador pensa que ela tem uma propriedade chamada `__compileTimeOnly` que não existe de fato. Isso significa que `FString` ainda pode ser atribuída para string, mas não o inverso. + +## Uniões Discriminadas + +O equivalente mais próximo do `data` é uma união de tipos com propriedades discriminantes, normalmente chamadas de uniões discriminadas no TypeScript: + +```ts +type Forma = + | { tipo: 'circulo'; raio: number } + | { tipo: 'quadrado'; x: number } + | { tipo: 'triangulo'; x: number; y: number }; +``` + +Diferente de Haskell, a marcação, ou discriminante, é apenas uma propriedade em cada objeto de tipo. Cada variante tem uma propriedade idêntica com um tipo unitário diferente. Isso ainda é uma união de tipo normal; o `|` na frente é uma parte opcional da sintaxe de união de tipo. Você pode discriminar os membros de uma união usando código JavaScript normal: + +```ts twoslash +type Forma = + | { tipo: 'circulo'; raio: number } + | { tipo: 'quadrado'; x: number } + | { tipo: 'triangulo'; x: number; y: number }; + +function area(s: Forma) { + if (s.tipo === 'circulo') { + return Math.PI * s.raio * s.raio; + } else if (s.tipo === 'quadrado') { + return s.x * s.x; + } else { + return (s.x * s.y) / 2; + } +} +``` + +Note que o tipo de retorno de `area` é inferido como `number` porque o TypeScript sabe que a função é total. Se alguma variante não é coberta, o tipo de retorno será `number | undefined`. + +Também, diferente de Haskell, propriedades comuns aparecem em qualquer união, então você pode usualmente discriminar múltiplos membros da união: + +```ts twoslash +type Forma = + | { tipo: 'circulo'; raio: number } + | { tipo: 'quadrado'; x: number } + | { tipo: 'triangulo'; x: number; y: number }; +// ---cut--- +function altura(s: Forma) { + if (s.tipo === 'circulo') { + return 2 * s.raio; + } else { + // s.tipo: "quadrado" | "triangulo" + return s.x; + } +} +``` + +## Parâmetros de Tipo + +Como a maioria das linguagens descendentes de C, TypeScript pede a declaração de parâmetros de tipo: + +```ts +function levantarArray(t: T): Array { + return [t]; +} +``` + +Não há requerimento de caso, mas parâmetros de tipo são convencionalmente letras maiúsculas únicas. Parâmetros de tipo também podem ser restritos para um tipo, que se comporta um pouco como restrições de classes: + +```ts +function primeiro(t1: T, t2: T): T { + return t1.length > t2.length ? t1 : t2; +} +``` + +TypeScript pode usualmente inferir argumentos de tipo de uma chamada baseado no tipo dos argumentos, então argumentos de tipo não são usualmente necessários. + +Por TypeScript ser estrutural, ele não precisa de nenhum parâmetro de tipo quanto tanto sistemas nominais. Especificamente, eles não são necessários para fazer uma função polimórfica. Parâmetros de tipo devem ser usados apenas para _propagar_ informação de tipo, como restringir parâmetros para serem do mesmo tipo: + +```ts +function comprimento>(t: T): number {} + +function comprimento(t: ArrayLike): number {} +``` + +No primeiro `comprimento`, T não é necessário; note que ele só é referenciado uma vez, então não está sendo usado para restringir o tipo do valor de retorno ou de outros parâmetros. + +### Tipos superiores + +TypeScript não tem tipos superiores, então o seguinte não é permitido: + +```ts +function comprimento, U>(m: T) {} +``` + +### Programação livre de pontos + +Programação livre de pontos — uso pesado de currying e composição de funções — é possível em JavaScript, mas pode ser verboso. Em TypeScript, a inferência de tipo falha frequentemente para programas livres de pontos, então você vai acabar especificando os parâmetros de tipo ao invés de parâmetros de valor. O resultado é tão verboso que é usualmente melhor evitar progamação livre de pontos. + +## Sistema de módulos + +A sintaxe moderna de módulos do JavaScript é parecida com a de Haskell, exceto que qualquer arquivo com `import` ou `export` é implicitamente um módulo: + +```ts +import { value, Type } from 'npm-package'; +import { other, Types } from './local-package'; +import * as prefix from '../lib/third-package'; +``` + +Você também pode importar módulos commonjs — módulos escritos usando o sistema de móudlos do node.js: + +```ts +import f = require('single-function-package'); +``` + +Você pode exportar com uma lista de exportação: + +```ts +export { f }; + +function f() { + return g(); +} +function g() {} // g is not exported +``` + +Ou marcando cada export individualmente: + +```ts +export function f { return g() } +function g() { } +``` + +O último é mais comum mas ambos são permitidos, mesmo quando no mesmo arquivo. + +## `readonly` e `const` + +Em JavaScript, mutabilidade é o padrão, embora ele permita declarações de variáveis com `const` para declarar que _referência_ é mutável. O refernte ainda é mutável: + +```js +const a = [1, 2, 3]; +a.push(102); // ): +a[0] = 101; // D: +``` + +TypeScript tem o modificador adicional `readonly` para propriedades. + +```ts +interface Rx { + readonly x: number; +} +let rx: Rx = { x: 1 }; +rx.x = 12; // erro +``` + +Ele também conta com um tipo mapeado `Readonly` que faz todas as propriedades serem `readonly`: + +```ts +interface X { + x: number; +} +let rx: Readonly = { x: 1 }; +rx.x = 12; // erro +``` + +E tem um tipo específico `ReadonlyArray` que remove métodos de efeitos colaterais e previne escrita aos índices do array, assim como sintaxe especial para este tipo: + +```ts +let a: ReadonlyArray = [1, 2, 3]; +let b: readonly number[] = [1, 2, 3]; +a.push(102); // erro +b[0] = 101; // erro +``` + +Você também pode usar assertividade constante, que opera em objetos literais e arrays: + +```ts +let a = [1, 2, 3] as const; +a.push(102); // erro +a[0] = 101; // erro +``` + +Entretanto, nenhuma dessas opções são o padrão, então elas não são consistentemente usadas em código TypeScript + +## Próximos Passos + +Essa documentação é uma resumo de alto nível da sintaxe e tipos qeu você usaria em código no dia-a-dia. Daqui você deve: + +- Ler o Handbook completo [from start to finish](/docs/handbook/intro.html) (30m) +- Explorar os [exemplos do Playground](/play#show-examples) From 7f0dd23de9a61b008b269f2a556dcf258ca78159 Mon Sep 17 00:00:00 2001 From: luk3skyw4lker Date: Mon, 17 Jan 2022 19:49:51 -0300 Subject: [PATCH 2/6] Add TS for JS Programmers.md --- .../pt/get-started/TS for JS Programmers.md | 288 ++++++++++++++++++ 1 file changed, 288 insertions(+) create mode 100644 docs/documentation/pt/get-started/TS for JS Programmers.md diff --git a/docs/documentation/pt/get-started/TS for JS Programmers.md b/docs/documentation/pt/get-started/TS for JS Programmers.md new file mode 100644 index 00000000..f829babd --- /dev/null +++ b/docs/documentation/pt/get-started/TS for JS Programmers.md @@ -0,0 +1,288 @@ +--- +title: TypeScript para programadores JavaScript +short: TypeScript para programadores JavaScript +layout: docs +permalink: /pt/docs/handbook/typescript-in-5-minutes.html +oneline: Aprenda como o TypeScript extende o JavaScript +--- + +TypeScript tem uma relação incomum com JavaScript. TypeScript oferece todas as features do JavaScript, e uma camada adicional no topo deste: o sistema de tipos do TypeScript. + +Por exemplo, JavaScript oferece primitivos de linguagem como `string` e `number`, mas não checa consistentemente que você atribuiu estes. TypeScript checa. + +Isso significa que seu código JavaScript existente também é código TypeScript. O benefício principal do TypeScript é que ele pode destacar comportamento inesperado no seu código, diminuindo a chance de bugs. + +Este tutorial fornece um resumo do TypeScript, focando no seu sistema de tipos. + +## Tipos por Inferência + +TypeScript conhece a linguagem JavaScript e vai gerar tipos para você em muitos casos. Por exemplo quando criando uma variável e atribuindo à um determinado valor, TypeScript usará o valor como seu tipo. + +```ts twoslash +let olaMundo = 'Olá Mundo'; +// ^? +``` + +Entendendo como o JavaScript funciona, TypeScript pode construir um sistema de tipos que aceita código JavaScript mas tem tipos. Isso oferece um sistema de tipos sem a necessidade de adicionar caracteres extra para fazer com que os tipos sejam explícitos no seu código. É assim que o TypeScript sabe que `olaMundo` é uma `string` no exemplo acima. + +Você já pode ter escrito código JavaScript no Visual Studio Code, e teve auto-complete do editor. Visual Studio Code usa TypeScript por baixo dos panos para tornar mais fácil o trabalho com JavaScript. + +## Definindo Tipos + +Você pode usar uma ampla variedade de tipos de padrões de projetos no JavaScript. Entretanto, alguns padrões de projeto tornam a inferência de tipos automática difícil (por exemplo, padrões que usam programação dinâmica). Para cobrir estes casos, TypeScript suporta uma extensão do JavaScript, que oferece lugares para que você diga ao TypeScript quais deveriam ser os tipos. + +Por exemplo, para criar um objteo com um tipo inferido que inclui `name: string` e `id: number`, você pode escrever: + +```ts twoslash +const usuario = { + nome: 'Hayes', + id: 0 +}; +``` + +Você pode explicitamente descrever a forma desse objeto usando uma declaração de `interface`: + +```ts twoslash +interface Usuario { + nome: string; + id: number; +} +``` + +Você pode então declarar um objeto JavaScript conforme o formato da sua nova `interface` usando a sintaxe `: TypeName` depois da declaração de uma variável: + +```ts twoslash +interface Usuario { + nome: string; + id: number; +} +// ---cut--- +const usuario: Usuario = { + nome: 'Hayes', + id: 0 +}; +``` + +Se você fornecer um objeto que não corresponde a interface que você forneceu, o TypeScript vai te alertar: + +```ts twoslash +// @errors: 2322 +interface Usuario { + nome: string; + id: number; +} + +const usuario: Usuario = { + nomeDeUsuario: 'Hayes', + id: 0 +}; +``` + +Já que o JavaScript suporta classes e programação orientada a objeto, TypeScript também. Você pode usar a declaração de interface com classes: + +```ts twoslash +interface Usuario { + nome: string; + id: number; +} + +class UsuarioConta { + nome: string; + id: number; + + constructor(nome: string, id: number) { + this.nome = nome; + this.id = id; + } +} + +const usuario: Usuario = new UsuarioConta('Murphy', 1); +``` + +Você pode usar interfaces para tipar parâmetros e valores de retorno em funções: + +```ts twoslash +// @noErrors +interface Usuario { + nome: string; + id: number; +} +// ---cut--- +function buscarUsuarioAdmin(): Usuario { + //... +} + +function deletarUsuario(usuario: Usuario) { + // ... +} +``` + +Já há um pequeno conjunto de tipos primitivos disponíveis em JavaScript: `boolean`, `bigint`, `null`, `number`, `string`, `symbol`, e `undefined`, que você pode usar em uma interface. TypeScript extende essa lista com mais alguns como `any` (permitir qualquer coisa), [`unknown`](/play#example/unknown-and-never) (garanta que alguém usando esse tipo declare qual tipo é), [`never`](/play#example/unknown-and-never) (não é possível que esse tipo aconteça), e `void` (uma função que retorna `undefined` ou que não tem valor de retorno). + +Você verá que há duas sintaxes para construir tipos: [Interfaces e Types](/play/?e=83#example/types-vs-interfaces). Você deve preferir `interface`. Use `type` quando precisar de funcionalidades específicas. + +## Compondo Tipos + +Com TypeScript, você pode criar tipos complexos combinando os simples. Existem duas formas populares de fazer isso: com uniões, e com genéricos. + +### Uniões + +Com uma união, você pode declarar que um tipo pode ser um de muitos. Por exemplo, você pode descrever um tipo `boolean` como sendo `true` ou `false`: + +```ts twoslash +type MeuBooleano = true | false; +``` + +_Nota:_ se você passar o mouse por cima do `MeuBoleano` acima, você verá que é classificado como `boolean`. Essa é uma propriedade do Sistema de Tipos Estruturais. Mais sobre isso abaixo. + +Um caso de uso popular de tipos uniões é para descrever o valor que um conjunto de [literais](/docs/handbook/2/everyday-types.html#literal-types) de `string` ou `number` pode ter: + +```ts twoslash +type EstadoDaJanela = 'aberto' | 'fechado' | 'minimizado'; +type EstadosDeBloqueio = 'trancado' | 'destrancado'; +type NumerosImparesMenoresQue10 = 1 | 3 | 5 | 7 | 9; +``` + +Uniões fornecem uma forma de gerenciar tipos diferentes também. Por exemplo, você pode ter uma função que recebe como argumento um `array` ou uma `string`: + +```ts twoslash +function buscarComprimento(obj: string | string[]) { + return obj.length; +} +``` + +Para saber o tipo de uma variável, use `typeof`: + +| Tipo | Predicado | +| --------- | ---------------------------------- | +| string | `typeof s === "string"` | +| number | `typeof n === "number"` | +| boolean | `typeof b === "boolean"` | +| undefined | `typeof undefined === "undefined"` | +| function | `typeof f === "function"` | +| array | `Array.isArray(a)` | + +Por exemplo, você pode fazer uma função retornar diferentes tipos dependendo se uma string ou um array forem passados: + + +```ts twoslash +function envolverEmArray(obj: string | string[]) { + if (typeof obj === "string") { + return [obj]; +// ^? + } + return obj; +} +``` + +### Genéricos + +Genéricos fornecem variáveis para tipos. Um exemplo comum é um array. Um array sem genéricos pode conter qualquer coisa. Um array com genéricos pode descrever os valores que aquele array contém. + +```ts +type ArrayDeStrings = Array; +type ArrayDeNumeros = Array; +type ObjetoComNomeArray = Array<{ nome: string }>; +``` + +Você pode declarar seus próprios tipos usando genéricos: + +```ts twoslash +// @errors: 2345 +interface Mochila { + adicionar: (obj: Tipo) => void; + buscar: () => Tipo; +} + +// Esse é um atalho para dizer ao Typescript que há uma +// constante chamada mochila, e não se preocupar de onde ela veio. +declare const mochila: Mochila; + +// objeto é uma string, porque nós o declaramos acima como a parte variável de Mochila. +const objeto = mochila.buscar(); + +// Já que a variável mochila é uma string, você não pode passar um número para a função adicionar. +mochila.adicionar(23); +``` + +## Sistema de Tipos Estruturais + +Um dos princípios centrais do TypeScript é que a checagem de tipo é focada no _formato_ que os valores têm. Isso é chamado as vezes de "tipagem do pato" ou "tipagem estrutural". + +Em um sistema de tipagem estruturado, se dois objetos tem o mesmo formato, eles são considerados do mesmo tipo. + +```ts twoslash +interface Ponto { + x: number; + y: number; +} + +function exibirPonto(p: Ponto) { + console.log(`${p.x}, ${p.y}`); +} + +// exibe "12, 26" +const ponto = { x: 12, y: 26 }; +exibirPonto(ponto); +``` + +A variável `ponto` nunca é declarada como sendo do tipo `Ponto`. Entretanto, o TypeScript compara o formato de `ponto` ao formato de `Ponto` na checagem de tipo. Eles têm o mesmo formato, então o código passa. + +A correspondência de tipo só requere que um subconjunto de campos do objeto sejam correspondentes: + +```ts twoslash +// @errors: 2345 +interface Ponto { + x: number; + y: number; +} + +function exibirPonto(p: Ponto) { + console.log(`${p.x}, ${p.y}`); +} +// ---cut--- +const ponto3 = { x: 12, y: 26, z: 89 }; +exibirPonto(ponto3); // logs "12, 26" + +const rect = { x: 33, y: 3, largura: 30, altura: 80 }; +exibirPonto(rect); // logs "33, 3" + +const color = { hex: '#187ABF' }; +exibirPonto(color); +``` + +Não há diferença entre como as classes e os objetos se conformam aos formatos: + +```ts twoslash +// @errors: 2345 +interface Ponto { + x: number; + y: number; +} + +function exibirPonto(p: Ponto) { + console.log(`${p.x}, ${p.y}`); +} +// ---cut--- +class PontoVirtual { + x: number; + y: number; + + constructor(x: number, y: number) { + this.x = x; + this.y = y; + } +} + +const novoPontoV = new PontoVirtual(13, 56); +exibirPonto(novoPontoV); // logs "13, 56" +``` + +Se o objeto ou classe tem todas as propriedades requeridas, TypeScript dirá que eles são correspondentes, independente dos detalhes de implementação. + +## Próximos Passos + +Essa documentação é uma resumo de alto nível da sintaxe e tipos qeu você usaria em código no dia-a-dia. Daqui você deve: + +- Ler o Handbook completo [from start to finish](/docs/handbook/intro.html) (30m) +- Explorar os [exemplos do Playground](/play#show-examples) From 5091432be154669a035d3dedf5cc8c9b7e0f28ce Mon Sep 17 00:00:00 2001 From: luk3skyw4lker Date: Wed, 19 Jan 2022 21:00:10 -0300 Subject: [PATCH 3/6] Add TS for Oopers.md --- .../pt/get-started/TS for OOpers.md | 165 ++++++++++++++++++ 1 file changed, 165 insertions(+) create mode 100644 docs/documentation/pt/get-started/TS for OOpers.md diff --git a/docs/documentation/pt/get-started/TS for OOpers.md b/docs/documentation/pt/get-started/TS for OOpers.md new file mode 100644 index 00000000..0518acd3 --- /dev/null +++ b/docs/documentation/pt/get-started/TS for OOpers.md @@ -0,0 +1,165 @@ +--- +title: TypeScript para programadores Java/C# +short: TS para programadores Java/C# +layout: docs +permalink: /pt/docs/handbook/typescript-in-5-minutes-oop.html +oneline: Learn TypeScript if you have a background in object-oriented languages +--- + +TypeScript é uma escolha popular para programadores acostumados com outras linguagens com tipagem estática, como C# e Java. + +O sistema de tipos do TypeScript oferece muitos dos mesmos benefícios, como melhor conclusão de código, detecção prematura de erros e comuincação mais clara entre partes do seu programa. Enquanto o TypeScript fornece muitas features familiares para esses desenvolvedores, é válido dar um passo atrás para ver o quanto JavaScript (por consequência TypeScript) difere das linguagens orientadas a objeto. Entender essas diferenças vão te ajudar a escrever um código JavaScript melhor e evitar armadilhas comuns que programadores que vão diretamente de C#/Java para TypeScript caem. + +## Co-aprendendo JavaScript + +Se você já é familiar com JavaScript mas é primariamente um programador Java ou C#, essa página introdutória pode ajudar a explicar alguns dos equívocos e armadilhas comuns que você pode estar suscetível. Algumas das formas de modelos de tipo do TypeScript são bem diferentes de Java ou C# e é importante manter esses em mente quando se aprende TypeScript. + +Se você é um desenvolvedor Java ou C# que é novo no JavaScript em geral, nós recomendamos aprender um pouco de JavaScript _sem_ tipos primeiro para entender o comportamento do JavaScript em tempo de execução. Porque o TypeScript não muda a forma que seu código é _executado_, você ainda vai ter que aprender como o JavaScript funciona para escrever código que realmente faz alguma coisa! + +É importante lembrar que TypeScript usa o mesmo _ambiente de execução_ que o JavaScript, então qualquer recursos sobre como realizar determinado comportamento em tempo de execução (converter uma string para um número, exibir um alerta, escrever um arquivo em disco, etc.) vai sempre se aplicar igualmente para programas TypeScript. Não se limite a recursos específicos do TypeScript! + +## Repensando a Classe + +C# e Java são o que podemos chamar de linguagens _obrigatoriamente orientadas a objeto_. Nessas linguagens, a _classe_ é a unidade básica de organização de código e também o recipiente básico de todos os dados _e_ comportamento em tempo de execução. Forçar todas as funcionalidades e dados a serem contidos em classes pode ser um bom modelo de domínio para alguns problemas, mas nem todo domínio _precisa_ ser representado dessa forma. + +### Funções Livres e Dados + +Em JavaScript, funções podem existir em qualquer lugar e dados podem ser enviados livremente sem estar dentro de uma `class` ou `struct` pré definida. Essa flexiblidade é extremamente poderosa. Funções "livres" (aquelas que não são associadas à uma classe) trabalhando sobre os dados sem uma hierarquia de orientação a objeto implicada tendem a ser o modelo preferido para escrever programas em JavaScript. + +### Classes Estáticas + +Adicionalmente, certos construtos de C# e Java tais como singletons e classes estáticas são desnecessários em TypeScript. + +## POO em TypeScript + +Com isso dito, você ainda pode usar classes se quiser! Alguns problemas são adequados a serem resolvidosp por hierarquia de POO tradicional e o suporte do TypeScript a classes JavaScript fará esses modelos ainda mais poderosos. TypeScript suporta muitos padrões comuns tais como implementar interfaces, herança e métodos estáticos. + +Nós cobriremos classes mais tarde neste guia. + +## Repensando Tipos + +O entendimento do TypeScript de um _tipo_ é atualmente bem diferente do de C# ou Java. Vamos explorar algumas diferenças. + +### Sistema de Tipos Nominal Reificado + +Em C# ou Java, qualquer dado valor ou objeto tem um tipo exato - seja `null`, um primitivo, ou uma classe conhecida. Nós podemos chamar métodos como `value.GetType()` ou `value.getClass()` para buscar o tipo exato em tempo de execução. A definição desse tipo vai residir em uma classe em algum lugar com algum nome e nós não podemos usar duas classes com formatos similares no lugar uma da outra a não ser que haja uma relação de herança explícita ou uma interface comum implementada. + +Estes aspectos descrevem um sistema de tipo _nominal, reificado_. Os tipos que escrevemos no código são presentes em tempos de execução e esses tipos são relacionados por suas declarações, não suas estruturas. + +## Tipos como Conjuntos + +Em C# ou Java, é siginficante pensar em uma correspondência um pra um entre os tipos de tempo de execução e suas declarações de tempo de compilação. + +Em TypeScript, é melhor pensar em um tipo como um _conjunto de valores_ que compartilham algo em comum. Por tipos serem apenas conjuntos, um valor particular pode pertencer à _muitos_ conjuntos ao mesmo tempo. + +Uma vez que você começa a pensar em tipos como conjuntos, certas operações se tornam bastante naturais. Por exemplo, em C#, é bem estranho enviar um valor que _pode ser_ uma `string` ou um `int`, porque não há um tipo único que represente este valor. + +Em TypeScript, isso se torna bem natural uma vez que você realiza que todo tipo é apenas um conjunto. Como você descreve um valor que pode pertencer ao conjunto `string` ou ao conjunto `number`? Ele simplesmente pertence à _união_ desses conjuntos: `string | number`. + +TypeScript fornece um número de mecanismos para trabalhar com tipos em forma de conjuntos e você vai descobrir que eles são mais intuitivos se você pensar em tipos como conjuntos. + +### Tipos Estruturais Apagados + +Em TypeScript, objetos _não_ são de um tipo exato. Por Exemplo, se construímos um objeto que satisfaz uma interface, nós podemos usar este objeto onde aquela interface é esperada mesmo que não haja relação delcarativa entre os dois. + +```ts twoslash +interface Ponto { + x: number; + y: number; +} +interface Nomeada { + nome: string; +} + +function exibirPonto(point: Ponto) { + console.log('x = ' + point.x + ', y = ' + point.y); +} + +function exibirNome(x: Nomeada) { + console.log('Olá, ' + x.nome); +} + +const obj = { + x: 0, + y: 0, + nome: 'Origem' +}; + +exibirPonto(obj); +exibirNome(obj); +``` + +O sistema de tipos do TypeScript é _estrutural_, não nominal: Nós podemos usar `obj` como um `Ponto` porque as propriedades `x` e `y` são ambas números. A relação entre os tipos são determinadas pelas propriedades que eles contém, não se foram declarados com determinada relação. + +O sistema de tipos do TypeScript também não é _reificado_: Nâo há nada em tempo de execução que nós dirá se aquele `obj` é um `Ponto`. Na verdade, o tipo `Ponto` não é presente em _nenhuma forma_ em tempo de execução. + +Voltando para a ideia de `tipos como conjuntos`, nós podemos pensar que `obj` é um membro tanto do conjunto de valores `Ponto` quanto do conjunto de valores `Nomeada`. + +### Consequências da Tipagem Estrutural + +Programadores POO são frequentementes surpreendidos pelos aspectos particulares da tipagem estrutural. + +#### Tipos Vazios + +O primeiro é que o _tipo vazio_ parece desafiar as expectativas: + +```ts twoslash +class Vazio {} + +function fn(arg: Vazio) { + // fazer algo? +} + +// Sem erro, mas isso não é um 'Vazio' ? +fn({ k: 10 }); +``` + +TypeScript determina se a chamada para `fn` é válida por checar se o argumento fornecido é um `Vazio` válido. Ele faz isso examinando a `estrutura` de `{ k: 10 }` e `class Vazio { }`. Nós podemos ver que `{ k: 10 }` tem todas as propriedades que `Vazio` tem, porque `Vazio` não tem propriedades. Logo, é uma chamada válida. + +Isso pode parecer muito surpreendente, mas, em última análise, é uma relação muito similar a uma aplicada em linguagens de POO nominais. Uma subclasse não pode _remover_ uma propriedade de sua classe base, porque fazer isso destruiria a relação natural de subtipo entre a classe derivada e sua base. Sistemas de tipagem estrutural simplesmente identificam esse relacionamento implicitamente descrevendo subtipos em termos de tendo propriedades de tipos compatíveis. + +### Tipos Idênticos + +Outra frequente fonte de supresa vem com tipos idênticos: + +```ts +class Carro { + dirigir() { + // pressionar o acelerador + } +} +class Golfer { + dirigir() { + // jogar a bola para longe + } +} + +// Sem erro? +let w: Carro = new Golfer(); +``` + +Novamente, isso não é um erro porque as _estruturas_ dessas classes são as mesmas. Enquanto isso pode parecer como uma potencial fonte de confusão, na prática, classes idênticas que não deveriam ser relacionadas não são comuns. + +Nós aprendemos mais sobre como classes se relacionam umas com as outras no capítulo Classes. + +### Reflexão + +Programadores POO são acostumados a serem capazes de pegar o tipo de qualquer valor, até um genérico: + +```csharp +// C# +static void TipoDoLog() { + Console.WriteLine(typeof(T).Name); +} +``` + +Porque o sistema de tipos do TypeScript é totalmente apagado, informação sobre e.g. a instanciação de um parâmetro de tipo genérico não está disponível em tempo de execução. + +JavaScript tem alguns primitivos limitados como `typeof` e `instanceof`, mas lembre-se que esses operadores ainda funcionarão nos valores porque eles existem no código de saída com tipo apagado. Por exemplo `typeof (new Carro())` será `object`, não `Carro` ou `"Carro"` + +## Próximos Passos + +Essa documentação é uma resumo de alto nível da sintaxe e tipos qeu você usaria em código no dia-a-dia. Daqui você deve: + +- Ler o Handbook completo [from start to finish](/docs/handbook/intro.html) (30m) +- Explorar os [exemplos do Playground](/play#show-examples) From d88b3c496ed68679fa754028f048750d74505204 Mon Sep 17 00:00:00 2001 From: luk3skyw4lker Date: Wed, 19 Jan 2022 21:02:33 -0300 Subject: [PATCH 4/6] Fix oneline on metadata for TS for OOpers.md --- docs/documentation/pt/get-started/TS for OOpers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/documentation/pt/get-started/TS for OOpers.md b/docs/documentation/pt/get-started/TS for OOpers.md index 0518acd3..2038e9fd 100644 --- a/docs/documentation/pt/get-started/TS for OOpers.md +++ b/docs/documentation/pt/get-started/TS for OOpers.md @@ -3,7 +3,7 @@ title: TypeScript para programadores Java/C# short: TS para programadores Java/C# layout: docs permalink: /pt/docs/handbook/typescript-in-5-minutes-oop.html -oneline: Learn TypeScript if you have a background in object-oriented languages +oneline: Aprenda TypeScript se você tem um background com linguagens orientadas a objeto --- TypeScript é uma escolha popular para programadores acostumados com outras linguagens com tipagem estática, como C# e Java. From e1c59bd1c9c07538962de587ff6e8a3d713ae560 Mon Sep 17 00:00:00 2001 From: luk3skyw4lker Date: Fri, 21 Jan 2022 09:55:11 -0300 Subject: [PATCH 5/6] Add TS for the New Programmer.md --- .../get-started/TS for the New Programmer.md | 156 ++++++++++++++++++ 1 file changed, 156 insertions(+) create mode 100644 docs/documentation/pt/get-started/TS for the New Programmer.md diff --git a/docs/documentation/pt/get-started/TS for the New Programmer.md b/docs/documentation/pt/get-started/TS for the New Programmer.md new file mode 100644 index 00000000..8839a357 --- /dev/null +++ b/docs/documentation/pt/get-started/TS for the New Programmer.md @@ -0,0 +1,156 @@ +--- +title: TypeScript para o Novo Programados +short: TS para o Novo Programador +layout: docs +permalink: /pt/docs/handbook/typescript-from-scratch.html +oneline: Aprenda TypeScript do zero +--- + +Parabéns por escolher TypeScript como uma das suas primeiras linguagens - você já está fazendo boas decisões! + +Você provavelmente já deve ter ouvido que TypeScript é um "sabor" ou uma "variante" do JavaScript. O relacionamento entre TypeScript (TS) e JavaScript (JS) é único entre linguagens de programação modernas, então aprender mais sobre esse relacionamento vai te ajudar a entender como TypeScript soma ao JavaScript. + +## O Que é JavaScript? Uma Breve História + +JavaScript (também conhecido como ECMAScript) começou sua vida como uma lingaugem de script simples para navegadores. Na época em que foi inventada, sempre foi esperado que fosse usada para pequenos snippets de código embarcados em uma página web - escrevendo mais do que uma dúzia de linhas de código seria algo incomum. Por isso, navegadores jovens da época executavam tal código bem devagar. Entretanto, com o tempo, JS se tornou mais e mais popular e desenvolvedores web começaram a usar ele para criar experiências interativas. + +Desenvolvedores de navegadores web responderam a esse uso aumentado de JS otimizando seus motores de execução (compilação dinâmica) e extendendo o que poderia ser feito com ele (adicionando APIs), o que por sua vez fez os desenvolvedores web o usarem ainda mais. Em websites modernos, seu browser frequentemente está rodando aplicações que têm centenas de milhares de linhas de código. Esse é o crescimento longo e gradual da "web", começando como uma rede simples de páginas estáticas e evoluindo em uma plataforma para _aplicações_ ricas de todos os tipos. + +Mais do que isso, JS se tornou popular o suficiente para ser usado fora do contexto de navegadores, como a implementação de servidores JS usando node.js. A natureza de "rodar em qualquer lugar" do JS faz ele ser uma escolha atrativa para desenvolvimento multiplataforma. Há muitos desenvolvedores nesses dias que usam _apenas_ JavaScript para programar toda seu conjunto de aplicações! + +Para resumir, nós temos uma linguagem que foi desenvolvida para usos rápidos e então cresceu para uma ferramenta completa para escrever aplicações com milhões de linhas. Toda linguagem tem suas próprias _individualidades_ - uniquicidades e surpresas e o começo humilde do JavaScript faz com que ele tenha _muitas_ dessas. Alguns exemplos: + +- O operador de igualidade do JavaScript (`==`) _coage_ seus argumentos, levando a comportamento inesperado: + + ```js + if ('' == 0) { + // É! mas porque?? + } + if (1 < x < 3) { + // Verdadeiro para qualquer valor de x! + } + ``` + +- JavaScript também permite acessar propriedades que não estão presentes: + + ```js + const obj = { width: 10, height: 15 }; + // Porque isso é NaN? Ortografia é difícil! + const area = obj.width * obj.heigth; + ``` + +A maioria das linguagens de programação lançariam um erro quando esse tipo de situação ocorresse, algumas fariam isso em tempo de compilação - antes de qualquer código estar sendo executado. Quando escrevendo programas pequenos, tais individualidades são irritantes mas gerenciáveis; quando escrevendo aplicações com centenas ou milhares de linhas de código, essas surpresas constantes são um problema sério. + +## TypeScript: Um Verificador de Tipos Estáticos + +Nós dissemos antes que algumas linguagens não permitiriam esses programas bugados nem serem executados. Detecção de erros sem execução do código é chamada de _verificação estática_. Determinar o que é um erro e o que não é baseado nos tipos dos valores sendo operados é chamado de verificação estática de _tipos_. + +TypeScript verifica um programa por erros antes de sua execução e faz isso baseado nos _tipos dos valores_, é um _verificador de tipo estático_. Por exemplo, o último exemplo acima tem um erro por causa do _tipo_ de `obj`. Aqui está o erro que o TypeScript encontra: + +```ts twoslash +// @errors: 2551 +const obj = { width: 10, height: 15 }; +const area = obj.width * obj.heigth; +``` + +### Um Superconjunto Tipado de JavaScript + +Como TypeScript se realaciona com JavaScript então? + +#### Sintaxe + +TypeScript é uma linguagem que é um _superconjunto_ de JavaScript: sintaxe JS é, logo, válida em TS. Sintaxe se refere à forma que escrevemos texto para formar um programa. Por exemplo, este código tem um erro de _sintaxe_ porque falta um `)`: + +```ts twoslash +// @errors: 1005 +let a = (4 +``` + +TypeScript não considera qualquer código JavaScript como um erro por sua sintaxe. Isso significa que você pode pegar qualquer código funcional JavaScript e colocar em um arquivo TypeScript sem se preocupar em como está escrito. + +#### Tipos + +Entretanto, TypeScript é um superconjunto _tipado_, significando que adiciona regras sobre como diferentes tipos de valores podem ser usados. O erro anterior sobre `obj.heigth` não era um erro de _sintaxe_: é um erro de uso de um tipo de valor (um _tipo_) de uma maneira incorreta. + +Como outro exemplo, isso é um código JavaScript que você pode rodar no seu browser e ele _vai_ exibir um valor: + +```js +console.log(4 / []); +``` + +Este programa sintaticamente legal exibe `Infinity`. TypeScript por sua vez considera a divisão de um número por um array uma operação sem sentido e vai exibir um erro: + +```ts twoslash +// @errors: 2363 +console.log(4 / []); +``` + +É possível que você realmente _queira_ dividir um núemro po rum array, talvez só para ver o que acontece, mas na maior parte do tempo isso é um erro de programação. O verificador de tipo do TypeScript é desenvolvido para permitir programas corretos enquanto previne quantos erros comuns forem possíveis. (Mais tarde, aprenderemos sobre configurações que você pode usar para configurar quão estritamente o TypeScript verifica seu código.) + +Se você move algum código de um arquivo JavaScript para um arquivo TypeScript, você pode ver _erros de tipo_ dependendo de como o código é escrito. Esses podem ser problemas legítimos com o código ou TypeScript sendo conservador em excesso. Por meio deste guia nós vamos demonstrar como adicionar várias sintaxes do TypeScript para eliminar tais erros. + +#### Comportamento em Tempo de Execução + +TypeScript também é uma linguagem de programação que preserva o _comportamento de tempo de execução_ do JavaScript. Por exemplo, dividir por zero em JavaScript produz `Infinity` ao invés de lançar um erro em tempo de execução. Como um princípio, o TypeScript **nunca** muda o comporatmento de tempo de execução de código JavaScript. + +Isso significa que você mover código do JavaScript do TypeScript, é **garantido** que vai rodar da mesma forma mesmo que o TypeScript pensa que o código tem erros de tipos. + +Mantendo o mesmo comportamento em tempo de execução que o JavaScript é uma promessa fundamental do TypeScript porque significa que você pode facilmente transitar entre duas linguagens sem se preocupar com diferenças sutis que podem fazer seu programa parar de funcionar. + + + +#### Tipos Apagados + +A grosso modo, uma vez que o compilador do TypeScript terminou de verificar o seu código, ele _apaga_ os tipos para produzir o código resultante "compilado". Isso significa que uma vez que seu código for compilado, o código JS puro de resultado não tem informação de tipo. + +Isso também significa que o TypeScript nunca muda o _comportamento_ do seu programa baseado nos tipos que infere. O fim disso é que enquanto você vê erros de tipo durante a compilação, o sistema de tipos em si não tem influência sobre como seu programa funciona quando roda. + +Finalmente, TypeScript não fornece nenhuma biblioteca de tempo de execução adicional. Seus programas vão usar as mesmas bibliotecas padrão (ou externas) que os programas JavaScript, então não há ferramentas específicas do TypeScript adicionais para se aprender. + + + +## Aprendendo JavaScript e TypeScript + +Nós frequentemente vemos a questão "Eu deveria aprender JavaScript ou TypeScript?". + +A resposta é que vocẽ não pode aprender TypeScript sem aprender JavaScript! TypeScript compartilha sintaxe e comportamento de tempo de execução com JavaScript, então qualquer coisa que você queira aprender sobre JavaScript estará ajudando você a aprender TypeScript ao mesmo tempo. + +Hà muitos, muitos recursos disponíveis para programadores aprenderem JavaScript; você _não_ deveria ignorar estes recursos se você está escrevendo TypeScript. Por exemplo, há cerca de 20 vezes mais questões no StackOverflow marcadas com `javascript` do que com `typescript`, mas _todas_ as questões `javascript` também se aplicam ao TypeScript. + +Se você se encontra procurando por algo como "como organizar uma lista em TypeScript", lembre-se: **TypeSript é o ambiente de execução do JavaScript com verificador de tipo em tempo de compilação**. A forma com que você organiza uma lista em TypeScript é a mesma no JavaScript. Se você encontrar um recurso que usa TypeScript diretamente isso é ótimo também, mas não se limite a pensar que você precisa de respostas específicas do TypeScript para questões do dia a dia sobre como alcançar tarefas do ambiente de execução. + +## Próximos Passos + +Esse foi um pequeno resumo da sintaxe e ferramentas usadas no TypeScript no dia-a-dia. Daqui, você pode: + +- Aprender alguns fundamentos do JavaScript, nós recomendamos: + + - [Microsoft's JavaScript Resources](https://docs.microsoft.com/javascript/) or + - [JavaScript guide at the Mozilla Web Docs](https://developer.mozilla.org/docs/Web/JavaScript/Guide) + +- Continuar para [TypeScript para programadores JavaScript](/docs/handbook/typescript-in-5-minutes.html) +- Ler o Handbook completo [from start to finish](/docs/handbook/intro.html) (30m) +- Explorar os [exemplos do Playground](/play#show-examples) + + + From 90bf3d28ee8532ab72d8a4e46bd7ae5f89099621 Mon Sep 17 00:00:00 2001 From: luk3skyw4lker Date: Mon, 24 Jan 2022 10:38:19 -0300 Subject: [PATCH 6/6] Renamed TS for OOPers.md --- .../pt/get-started/{TS for OOpers.md => TS for OOPers.md} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename docs/documentation/pt/get-started/{TS for OOpers.md => TS for OOPers.md} (100%) diff --git a/docs/documentation/pt/get-started/TS for OOpers.md b/docs/documentation/pt/get-started/TS for OOPers.md similarity index 100% rename from docs/documentation/pt/get-started/TS for OOpers.md rename to docs/documentation/pt/get-started/TS for OOPers.md