Entrevista TypeScript: 20 perguntas e respostas

O TypeScript é baseado na mesma sintaxe e semântica conhecidas por milhões de desenvolvedores de JavaScript. O TypeScript possibilita o trabalho com os recursos JS mais recentes e ainda emergentes, incluindo os que estão disponíveis no ECMAScript 2015 e os que existem atualmente apenas na forma de frases. Entre esses recursos estão, por exemplo, funções assíncronas e decoradoras. Tudo isso visa ajudar o desenvolvedor a criar aplicativos confiáveis ​​e modernos.

O programa TypeScript é compilado no código JavaScript comum que pode ser executado em qualquer navegador ou no Node.js. Esse código será entendido por qualquer mecanismo JS que suporte o ECMAScript 3 ou padrão mais recente.



O material, cuja tradução publicamos hoje, contém uma discussão de vinte perguntas que podem muito bem perguntar a alguém que vai passar em uma entrevista, reivindicando a posição do programador TypeScript.

Pergunta nº 1 (1). O que é o TypeScript e por que usá-lo em vez do JavaScript?

Entre parênteses, após o número da pergunta, é indicada sua complexidade, avaliada em uma escala de cinco pontos.

O TypeScript (TS) é um superconjunto de JavaScript (JS), entre os principais recursos, a possibilidade de atribuição explícita de tipo estático, suporte a classes e interfaces. Uma das principais vantagens do TS sobre o JS é a capacidade de criar, em vários IDEs, um ambiente de desenvolvimento que permita, logo no processo de inserção do código, identificar erros comuns. O uso do TypeScript em grandes projetos pode aumentar a confiabilidade dos programas, que, ao mesmo tempo, podem ser implantados nos mesmos ambientes em que os aplicativos JS comuns funcionam.

Aqui estão alguns detalhes sobre o TypeScript:

• O TypeScript suporta edições modernas dos padrões ECMAScript, o código escrito usando o qual é compilado levando em consideração a possibilidade de sua execução em plataformas que suportam versões mais antigas dos padrões. Isso significa que o programador TS pode usar os recursos do ES2015 e padrões mais recentes, como módulos, funções de seta, classes, operador de propagação, desestruturação e executar o que ele faz em ambientes existentes que ainda não suportam esses padrões.
• TypeScript é um complemento para JavaScript. O código escrito em JavaScript puro é um código TypeScript válido.
• O TypeScript estende o JavaScript com a capacidade de atribuir tipos estaticamente. O sistema do tipo TS é bastante extenso. Ou seja, inclui interfaces, enumerações, tipos híbridos, tipos genéricos, tipos de união e tipos de interseção, modificadores de acesso e muito mais. O uso do TypeScript também facilita um pouco as coisas usando a inferência de tipo.
• O uso do TypeScript, em comparação com o JavaScript, melhora significativamente o processo de desenvolvimento. O fato é que o IDE, em tempo real, recebe informações de tipo do compilador TS.
• Ao usar o modo null estrito (o sinalizador do compilador --strictNullChecks é usado para isso), o compilador TypeScript não permite atribuir null e undefined variáveis ​​dos tipos nos quais, nesse modo, o uso desses valores não é permitido.
• Para usar o TypeScript, você precisa organizar o processo de criação do projeto, que inclui o estágio de compilação do código TS em JavaScript. O compilador pode incorporar um mapa de origem nos arquivos JS gerados por ele ou criar arquivos .map separados. Isso permite definir pontos de interrupção e examinar os valores das variáveis ​​durante a execução do programa, trabalhando diretamente com o código TypeScript.
• TypeScript é um projeto de código aberto da Microsoft lançado sob a licença Apache 2. O iniciador de desenvolvimento do TypeScript é Anders Halesberg. Ele está envolvido na criação de Turbo Pascal, Delphi e C #.

→ Origem

Pergunta nº 2 (1). Conte-nos sobre tipos genéricos no TypeScript.

Tipos generalizados (genéricos) permitem criar componentes ou funções que podem funcionar com tipos diferentes, e não com qualquer um. Considere um exemplo:

 /**       */ class Queue<t> { private data = []; push = (item: T) => this.data.push(item); pop = (): T => this.data.shift(); } const queue = new Queue<number>(); queue.push(0); queue.push("1"); //  :      ,      

→ Origem

Pergunta nº 3 (2). O TypeScript suporta todos os princípios da programação orientada a objetos?

Sim sim. Existem quatro princípios básicos de programação orientada a objetos:

• Encapsulamento
• Herança
• Abstração
• Polimorfismo

Usando as ferramentas TypeScript simples e claras, você pode implementar todos esses princípios.

→ Origem

Pergunta nº 4 (2). Como no TypeScript verificar os valores de igualdade nula e indefinida?

Para executar essas verificações, basta usar a seguinte construção:

 if (value) { } 

A expressão entre parênteses será true se não constar da lista a seguir:

• null
• undefined
• NaN
• Linha vazia
• 0 0
• false

O TypeScript suporta as mesmas regras de conversão de tipo que o JavaScript.

→ Origem

Pergunta nº 5 (2). Como implementar propriedades de classe constantes no TypeScript?

No TypeScript, ao declarar propriedades da classe, você não pode usar a palavra-chave const . Quando você tenta usar essa palavra-chave, a seguinte mensagem de erro é exibida: A class member cannot have the 'const' keyword . O TypeScript 2.0 possui um modificador readonly que permite criar propriedades de classe somente leitura:

 class MyClass {   readonly myReadonlyProperty = 1;   myMethod() {       console.log(this.myReadonlyProperty);   } } new MyClass().myReadonlyProperty = 5; // ,        

→ Origem

Pergunta nº 6 (2). O que são arquivos .map no TypeScript?

Os arquivos com a extensão .map armazenam mapas de origem, que contêm dados sobre a correspondência do código gravado no código TypeScript para o JavaScript criado com base em ele. Muitos depuradores podem trabalhar com esse arquivo (por exemplo, Visual Studio e as ferramentas de desenvolvedor do Chrome). Isso permite, durante a depuração, trabalhar com o código fonte dos programas TypeScript, e não com seus equivalentes JS.

→ Origem

Pergunta nº 7 (2). O que são getters e setters no TypeScript?

O TypeScript suporta getters e setters, que permitem controlar o acesso a membros de objetos. Eles dão ao desenvolvedor controle sobre as propriedades de leitura e gravação de objetos.

 class foo { private _bar:boolean = false; get bar():boolean {   return this._bar; } set bar(theBar:boolean) {   this._bar = theBar; } } var myBar = myFoo.bar;  //    myFoo.bar = true;  //    

→ Origem

Pergunta nº 8 (2). O TypeScript pode ser usado no desenvolvimento de servidores e, em caso afirmativo, como?

Os programas escritos em TypeScript são adequados não apenas ao desenvolvimento front-end, mas também à criação de aplicativos para servidores. Por exemplo, no TS, você pode escrever programas para a plataforma Node.js. Isso fornece ao programador ferramentas adicionais para controle de tipo e permite o uso de outros recursos da linguagem. Para criar aplicativos de servidor no TS, basta configurar o processo de processamento de código correto, na entrada da qual os arquivos TypeScript são recebidos e a saída são arquivos JavaScript adequados para execução no Node.js. Para organizar esse ambiente, você deve primeiro instalar o compilador TypeScript:

 npm i -g typescript 

Os parâmetros do compilador são configurados usando o arquivo tsconfig.json , que determina, entre outras coisas, o objetivo da compilação e o local onde os arquivos JS prontos devem ser colocados. Em geral, esse arquivo é muito semelhante aos arquivos de configuração babel ou webpack:

 { "compilerOptions": {   "target": "es5",   "module": "commonjs",   "declaration": true,   "outDir": "build" } } 

Agora, desde que o compilador tenha algo a processar, você precisa executá-lo:

 tsc 

E, finalmente, levando em consideração o fato de que os arquivos JS adequados para execução no ambiente Node.js. estão localizados na pasta build , é necessário executar o seguinte comando no diretório raiz do projeto:

 node build/index.js 

→ Origem

Pergunta nº 9 (3). Conte-nos sobre os principais componentes do TypeScript.

O TypeScript possui três componentes principais:

• Idioma. Do ponto de vista dos desenvolvedores, essa é a parte mais importante do TypeScript. "Idioma" é a sintaxe, as palavras-chave, tudo o que permite escrever programas no TypeScript.
• Compilador O TypeScript possui um compilador de código aberto, é multiplataforma, especificação aberta e é escrito em TypeScript. O compilador converte o código TypeScript em código JavaScript. Além disso, se algo estiver errado com o programa, ele exibirá mensagens de erro. Ele permite combinar vários arquivos TypeScript em um único arquivo JS de saída e pode criar mapas de códigos.
• Ferramentas auxiliares. As ferramentas auxiliares do TypeScript foram projetadas para facilitar o processo de desenvolvimento com seu uso em vários IDEs. Entre eles estão o Visual Studio, VS Code , Sublime, várias ferramentas para iniciar rapidamente o código TS e outras.

→ Origem

Pergunta nº 10 (3). Existem erros no código TypeScript que você forneceu? Explique sua resposta.

Aqui está o trecho de código:

 class Point {   x: number;   y: number; } interface Point3d extends Point {   z: number; } let point3d: Point3d = {x: 1, y: 2, z: 3}; 

Não há erros neste código. Uma declaração de classe cria duas entidades: esse é o tipo de dados usado para instanciar a classe e a função construtora. Como as classes criam tipos de dados, você pode usá-los onde pode usar interfaces.

→ Origem


Apenas realmente amo este filme)

Pergunta nº 11 (3). Conte-nos sobre o uso de decoradores de propriedades no TypeScript.

Os decoradores podem ser usados ​​para alterar o comportamento das classes, e você pode obter ainda mais benefícios deles ao usá-los com qualquer estrutura. Por exemplo, se sua estrutura tiver métodos para os quais o acesso é limitado (por exemplo, eles são destinados apenas ao administrador), será fácil escrever um decorador do método @admin , que proibirá usuários que não são administradores de acessar os métodos correspondentes. Você pode criar um decorador @owner que permita modificar um objeto apenas para seu proprietário. Veja como pode ser o uso de decoradores:

 class CRUD {   get() { }   post() { }   @admin   delete() { }   @owner   put() { } } 

→ Origem

Pergunta nº 12 (3). O TypeScript pode usar funções fortemente tipadas como parâmetros?

Considere o seguinte exemplo:

 class Foo {   save(callback: Function) : void {       //        var result : number = 42; //             //      -  ,        number?       callback(result);   } } var foo = new Foo(); var callback = (result: string) : void => {   alert(result); } foo.save(callback); 

É possível organizar o trabalho com um retorno de chamada digitado no método save ? Reescreva o código para demonstrar isso.

No TypeScript, você pode declarar um tipo de retorno de chamada e, em seguida, reescrever o código:

 type NumberCallback = (n: number) => any; class Foo {   //    save(callback: NumberCallback): void {       console.log(1)       callback(42);   } } var numCallback: NumberCallback = (result: number) : void => {   console.log("numCallback: ", result.toString()); } var foo = new Foo(); foo.save(numCallback) 

→ Origem

Pergunta nº 13 (3). Como tornar as classes declaradas em um módulo acessíveis fora do módulo?

Classes declaradas em um módulo estão disponíveis dentro deste módulo. Lá fora, o acesso a eles não pode ser obtido.

 module Vehicle {   class Car {       constructor (           public make: string,           public model: string) { }   }   var audiCar = new Car("Audi", "Q7"); } //     var fordCar = Vehicle.Car("Ford", "Figo"); 

No código acima, ocorrerá um erro ao tentar inicializar a variável fordCar . Para tornar uma classe declarada em um módulo acessível fora deste módulo, você precisa usar a palavra-chave export :

 module Vehicle {   export class Car {       constructor (           public make: string,           public model: string) { }   }   var audiCar = new Car("Audi", "Q7"); } //       var fordCar = Vehicle.Car("Ford", "Figo"); 

→ Origem

Pergunta nº 14 (3). O TypeScript suporta sobrecarga de função?

O TypeScript suporta sobrecarga de funções, mas a implementação desse mecanismo é diferente do que pode ser visto em outras linguagens orientadas a objetos. Ou seja, no TS, eles criam apenas uma função e um certo número de anúncios. Quando esse código é compilado em JavaScript, apenas uma função específica é visível. Esse mecanismo funciona porque as funções JS podem ser chamadas transmitindo-lhes um número diferente de parâmetros.

 class Foo {   myMethod(a: string);   myMethod(a: number);   myMethod(a: number, b: string);   myMethod(a: any, b?: string) {       alert(a.toString());   } } 

→ Origem

Pergunta nº 15 (4). O que há de errado com o código fornecido a você?

Aqui está o código em questão:

 /* */ interface Fetcher {   getObject(done: (data: any, elapsedTime?: number) => void): void; } 

É recomendável que você use parâmetros opcionais nos retornos de chamada apenas se entender com absoluta precisão as conseqüências dessa etapa. Esse código tem um significado muito específico: o retorno de chamada done pode ser chamado com 1 ou 2 argumentos. O autor do código provavelmente pretendeu nos dizer que o retorno de chamada pode não prestar atenção ao parâmetro elapsedTime , mas para conseguir isso, você sempre pode criar um retorno de chamada que use menos argumentos.

→ Origem

Pergunta nº 16 (4). Como sobrecarregar o construtor de classes no TypeScript?

O TypeScript permite declarar muitas variantes de métodos, mas só pode haver uma implementação, e essa implementação deve ter uma assinatura compatível com todas as variantes de métodos sobrecarregados. Para sobrecarregar o construtor de classe, você pode usar várias abordagens:

• Você pode usar o parâmetro opcional:
  
  

   class Box {   public x: number;   public y: number;   public height: number;   public width: number;   constructor();   constructor(obj: IBox);   constructor(obj?: any) {          this.x = obj && obj.x || 0       this.y = obj && obj.y || 0       this.height = obj && obj.height || 0       this.width = obj && obj.width || 0;   } } 

• Você pode usar as configurações padrão:
  
  

   class Box {   public x: number;   public y: number;   public height: number;   public width: number;   constructor(obj : IBox = {x:0,y:0, height:0, width:0}) {          this.x = obj.x;       this.y = obj.y;       this.height = obj.height;       this.width = obj.width;   } } 

• Você pode usar sobrecargas adicionais como métodos estáticos de fábrica:
  
  

   class Person {   static fromData(data: PersonData) {       let { first, last, birthday, gender = 'M' } = data       return new this(           `${last}, ${first}`,           calculateAge(birthday),           gender       )   }   constructor(       public fullName: string,       public age: number,       public gender: 'M' | 'F'   ) {} } interface PersonData {   first: string   last: string   birthday: string   gender?: 'M' | 'F' } let personA = new Person('Doe, John', 31, 'M') let personB = Person.fromData({   first: 'John',   last: 'Doe',   birthday: '10-09-1986' }) 

• Você pode usar o tipo de união:
  
  

   class foo {   private _name: any;   constructor(name: string | number) {       this._name = name;   } } var f1 = new foo("bar"); var f2 = new foo(1); 

→ Origem

Pergunta nº 17 (4). Quais são as diferenças entre as palavras-chave da interface e do tipo no TypeScript?

Aqui estão exemplos de uso dessas palavras-chave:

 interface X {   a: number   b: string } type X = {   a: number   b: string }; 

Ao contrário de uma declaração de interface, que sempre representa um tipo nomeado de um objeto, o uso da palavra-chave type permite especificar um alias para qualquer tipo de tipo, incluindo tipos primitivos, tipos de união e tipos de interseção.

Ao usar a palavra-chave type vez da palavra-chave da interface , as seguintes possibilidades são perdidas:

• Uma interface pode ser usada em uma expressão de extends ou implements , mas um alias para um tipo de objeto literal não pode.
• Uma interface pode ter várias declarações mescladas e, ao usar a palavra-chave type esse recurso não está disponível.

→ Origem

Pergunta nº 18 (5). Conte-nos sobre quando o TypeScript usa a palavra-chave declare.

A palavra-chave declare é usada no TypeScript para declarar variáveis, cuja origem pode ser um arquivo que não é um arquivo TypeScript.

Por exemplo, suponha que tenhamos uma biblioteca chamada myLibrary . Ele não possui um arquivo com declarações de tipo TypeScript, possui apenas o namespace myLibrary no namespace global. Se você deseja usar esta biblioteca em seu código TS, pode usar a seguinte construção:

 declare var myLibrary; 

O TypeScript atribuirá a variável myLibrary a any . O problema aqui é que, no momento do desenvolvimento, você não terá dicas inteligentes para esta biblioteca, embora possa usá-lo em seu código. Nessa situação, você pode usar outra abordagem que leva ao mesmo resultado. Estamos falando sobre o uso de uma variável do tipo any :

 var myLibrary: any; 

Nos dois casos, ao compilar o código TS em JavaScript, o resultado é o mesmo, mas a opção declare é melhor legível. O uso desta palavra-chave leva à criação da chamada declaração externa de uma variável (declaração ambiental).

Pergunta nº 19 (5). O que são declarações de variáveis ​​externas no TypeScript e quando devem ser usadas?

Uma declaração externa de uma variável (declaração de ambiente) é um mecanismo que permite ao compilador TypeScript saber que existe algum código-fonte em algum lugar fora do arquivo atual. Anúncios externos ajudam a integrar bibliotecas JavaScript de terceiros em programas TS.

Essas declarações são feitas no arquivo de declaração de tipo com a extensão .d.ts. Variáveis ​​ou módulos externos declaram assim:

 declare module Module_Name { } 

Os arquivos que contêm código externo devem ser incluídos no arquivo TS usando-os, da seguinte maneira:

 /// <reference path=" Sample.d.ts"></reference> 

→ Origem

Pergunta nº 20 (5). Posso gerar automaticamente criativos TypeScript a partir de bibliotecas JS?

O JavaScript nem sempre contém informações suficientes que permitem ao TypeScript inferir tipos automaticamente. Portanto, é quase impossível criar declarações de tipo automaticamente com base no JavaScript. No entanto, você pode tentar fazer isso usando as seguintes ferramentas:

• Microsoft / dts-gen é a ferramenta oficial usada pela Microsoft como ponto de partida para criar declarações de tipo.
• O dtsmake é uma ferramenta de desenvolvimento promissora para criar automaticamente declarações de tipo com base em arquivos JS. Depende do sistema de análise de código Tern , que alguns editores usam para implementar o mecanismo de preenchimento automático ao inserir o código JS.

→ Origem

Sumário

Esperamos que uma discussão das perguntas deste material o ajude a conhecer melhor o TypeScript, talvez preste atenção ao que você não prestou atenção antes e, se estiver se preparando para uma entrevista, aumente suas chances de passar com êxito.

Caros leitores! Que perguntas você faria ao entrevistador que se candidatou a um emprego que exige conhecimento em TypeScript?


- E qual é o desconto para este código promocional ?!
Parece 7%. Vou verificar se você quer ...
"Sim, você confere." Na minha opinião, o desconto é um pouco caro!
...
- Desculpe, eu estava um pouco enganado sobre o desconto. 10% em todos os servidores virtuais.