Entrevista TypeScript: 20 preguntas y respuestas

TypeScript se basa en la misma sintaxis y semántica que son familiares para millones de desarrolladores de JavaScript. TypeScript permite trabajar con las funciones JS más recientes y emergentes, incluidas las que están disponibles en ECMAScript 2015 y las que actualmente solo existen en forma de oraciones. Entre estas características se encuentran, por ejemplo, funciones asincrónicas y decoradores. Todo esto tiene como objetivo ayudar al desarrollador a crear aplicaciones confiables y modernas.

El programa TypeScript se compila en un código JavaScript normal que se puede ejecutar en cualquier navegador o en Node.js. Este código será entendido por cualquier motor JS que sea compatible con el estándar ECMAScript 3 o más reciente.



El material, cuya traducción publicamos hoy, contiene una discusión de veinte preguntas que bien pueden hacerle a alguien que va a pasar una entrevista, alegando la posición de programador de TypeScript.

Pregunta No. 1 (1). ¿Qué es TypeScript y por qué usarlo en lugar de JavaScript?

Entre paréntesis, después del número de la pregunta, se indica su complejidad, evaluada en una escala de cinco puntos.

TypeScript (TS) es un superconjunto de JavaScript (JS), entre cuyas características principales se encuentra la posibilidad de asignación explícita de tipos estáticos, soporte para clases e interfaces. Una de las principales ventajas de TS sobre JS es la capacidad de crear, en varios IDE, un entorno de desarrollo que permita, justo en el proceso de ingresar el código, identificar errores comunes. El uso de TypeScript en proyectos grandes puede aumentar la confiabilidad de los programas, que, al mismo tiempo, pueden implementarse en los mismos entornos donde funcionan las aplicaciones JS normales.

Aquí hay algunos detalles sobre TypeScript:

• TypeScript admite ediciones modernas de los estándares ECMAScript, el código escrito utilizando el cual se compila teniendo en cuenta la posibilidad de su ejecución en plataformas que admiten versiones anteriores de los estándares. Esto significa que el programador de TS puede utilizar las capacidades de ES2015 y estándares más nuevos, como módulos, funciones de flecha, clases, operador extendido, desestructuración y realizar lo que hace en entornos existentes que aún no son compatibles con estos estándares.
• TypeScript es un complemento para JavaScript. El código escrito en JavaScript puro es un código TypeScript válido.
• TypeScript extiende JavaScript con la capacidad de asignar tipos estáticamente. El sistema de tipo TS es bastante extenso. A saber, incluye interfaces, enumeraciones, tipos híbridos, tipos genéricos, tipos de unión y tipos de intersección, modificadores de acceso y mucho más. El uso de TypeScript también facilita un poco las cosas al usar la inferencia de tipos.
• El uso de TypeScript, en comparación con JavaScript, mejora significativamente el proceso de desarrollo. El hecho es que el IDE, en tiempo real, recibe información de tipo del compilador de TS.
• Cuando se usa el modo null estricto (el indicador del compilador --strictNullChecks se usa para esto), el compilador TypeScript no permite asignar null e undefined variables de esos tipos en los que, en este modo, no se permite el uso de estos valores.
• Para usar TypeScript, debe organizar el proceso de compilación del proyecto, que incluye la etapa de compilación del código TS en JavaScript. El compilador puede incrustar un mapa fuente en los archivos JS generados por él, o crear archivos .map separados. Esto le permite establecer puntos de interrupción y examinar los valores de las variables durante la ejecución del programa, trabajando directamente con el código TypeScript.
• TypeScript es un proyecto de código abierto de Microsoft lanzado bajo la licencia Apache 2. El iniciador de desarrollo TypeScript es Anders Halesberg. Está involucrado en la creación de Turbo Pascal, Delphi y C #.

→ Fuente

Pregunta No. 2 (1). Cuéntanos acerca de los tipos genéricos en TypeScript.

Los tipos generalizados (genéricos) le permiten crear componentes o funciones que pueden funcionar con diferentes tipos, y no con ninguno. Considere un ejemplo:

 /**       */ 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"); //  :      ,      

→ Fuente

Pregunta No. 3 (2). ¿TypeScript admite todos los principios de la programación orientada a objetos?

Si lo hace. Hay cuatro principios básicos de programación orientada a objetos:

• Encapsulación
• Herencia
• Abstracción
• Polimorfismo

Usando las herramientas simples y claras de TypeScript, puede implementar todos estos principios.

→ Fuente

Pregunta No. 4 (2). ¿Cómo en TypeScript verificar los valores de igualdad nula e indefinida?

Para realizar tales comprobaciones, es suficiente usar la siguiente construcción:

 if (value) { } 

La expresión entre paréntesis será true si no es algo de la siguiente lista:

• null
• undefined
• NaN
• Linea vacia
• 0 0
• false

TypeScript admite las mismas reglas de conversión de tipos que JavaScript.

→ Fuente

Pregunta No. 5 (2). ¿Cómo implementar propiedades de clase que son constantes en TypeScript?

En TypeScript, al declarar propiedades de clase, no puede usar la palabra clave const . Cuando intenta utilizar esta palabra clave, se muestra el siguiente mensaje de error: A class member cannot have the 'const' keyword . TypeScript 2.0 tiene un modificador de readonly que le permite crear propiedades de clase de solo lectura:

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

→ Fuente

Pregunta No. 6 (2). ¿Qué son los archivos .map en TypeScript?

Los archivos con la extensión .map almacenan mapas fuente, que contienen datos sobre la correspondencia del código escrito en TypeScript con el código JavaScript creado sobre esta base. Muchos depuradores pueden trabajar con este archivo (por ejemplo, Visual Studio y las herramientas de desarrollador de Chrome). Esto permite, durante la depuración, trabajar con el código fuente de los programas TypeScript, y no con sus equivalentes JS.

→ Fuente

Pregunta No. 7 (2). ¿Qué son getters y setters en TypeScript?

TypeScript admite getters y setters, que le permiten controlar el acceso a los miembros de los objetos. Le dan al desarrollador control sobre las propiedades de lectura y escritura de los 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;  //    

→ Fuente

Pregunta No. 8 (2). ¿Se puede usar TypeScript en el desarrollo del servidor? De ser así, ¿cómo?

Los programas escritos en TypeScript son adecuados no solo para el desarrollo front-end, sino también para crear aplicaciones de servidor. Por ejemplo, en TS puede escribir programas para la plataforma Node.js. Esto le da al programador herramientas adicionales para el control de tipo y le permite usar otras características del lenguaje. Para crear aplicaciones de servidor en TS, solo necesita configurar el proceso de procesamiento de código correcto, en la entrada de la cual se reciben los archivos TypeScript, y la salida son archivos JavaScript adecuados para su ejecución en Node.js. Para organizar dicho entorno, primero debe instalar el compilador TypeScript:

 npm i -g typescript 

Los parámetros del compilador se configuran utilizando el archivo tsconfig.json , que determina, entre otras cosas, el propósito de la compilación y el lugar donde se deben colocar los archivos JS listos para usar. En general, este archivo es muy similar a los archivos de configuración de babel o webpack:

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

Ahora, siempre que el compilador tenga algo que procesar, debe ejecutarlo:

 tsc 

Y finalmente, teniendo en cuenta el hecho de que los archivos JS adecuados para la ejecución en el entorno Node.js se encuentran en la carpeta de build , debe ejecutar el siguiente comando en el directorio raíz del proyecto:

 node build/index.js 

→ Fuente

Pregunta No. 9 (3). Cuéntanos sobre los componentes principales de TypeScript.

TypeScript tiene tres componentes principales:

• Idioma. Esto, desde el punto de vista de los desarrolladores, es la parte más importante de TypeScript. "Idioma" es la sintaxis, las palabras clave, todo lo que le permite escribir programas en TypeScript.
• Compilador TypeScript tiene un compilador de código abierto, es multiplataforma, de especificación abierta y está escrito en TypeScript. El compilador convierte el código TypeScript en código JavaScript. Además, si algo está mal con el programa, muestra mensajes de error. Le permite combinar varios archivos TypeScript en un solo archivo JS de salida y puede crear mapas de código.
• Herramientas auxiliares. Las herramientas auxiliares de TypeScript están diseñadas para facilitar el proceso de desarrollo con su uso en varios IDE. Entre ellos se encuentran Visual Studio, VS Code , Sublime, varias herramientas para iniciar rápidamente TS-code y otras.

→ Fuente

Pregunta No. 10 (3). ¿Hay algún error en el código TypeScript que proporcionó? Explica tu respuesta.

Aquí está el fragmento de código:

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

No hay errores en este código. Una declaración de clase crea dos entidades: este es el tipo de datos utilizado para instanciar la clase y la función constructora. Dado que las clases crean tipos de datos, puede usarlos donde puede usar interfaces.

→ Fuente


Realmente amo esta película)

Pregunta No. 11 (3). Cuéntanos sobre el uso de decoradores de propiedades en TypeScript.

Los decoradores se pueden usar para cambiar el comportamiento de las clases, y puede obtener aún más beneficios de ellos al usarlos con cualquier marco. Por ejemplo, si su marco de trabajo tiene métodos de acceso restringido (por ejemplo, están destinados solo al administrador), será fácil escribir el @admin métodos @admin , que prohibirá a los usuarios que no sean administradores acceder a los métodos correspondientes. Puede crear un decorador @owner que le permita modificar un objeto solo a su propietario. Así es como se verían los decoradores:

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

→ Fuente

Pregunta No. 12 (3). ¿Puede TypeScript usar funciones fuertemente tipadas como parámetros?

Considere el siguiente ejemplo:

 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); 

¿Es posible organizar el trabajo con una devolución de llamada escrita en el método de save ? Reescribe el código para demostrar esto.

En TypeScript, puede declarar un tipo de devolución de llamada y luego reescribir el 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) 

→ Fuente

Pregunta No. 13 (3). ¿Cómo hacer que las clases declaradas en un módulo sean accesibles fuera del módulo?

Las clases declaradas en un módulo están disponibles dentro de este módulo. En el exterior, no se puede acceder a ellos.

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

En el código anterior, se producirá un error al intentar inicializar la variable fordCar . Para hacer que una clase declarada en un módulo sea accesible fuera de este módulo, debe usar la palabra clave 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"); 

→ Fuente

Pregunta No. 14 (3). ¿TypeScript admite la sobrecarga de funciones?

TypeScript admite la sobrecarga de funciones, pero la implementación de este mecanismo es diferente de lo que se puede ver en otros lenguajes orientados a objetos. Es decir, en TS solo crean una función y un cierto número de anuncios. Cuando dicho código se compila en JavaScript, solo se ve una función específica. Este mecanismo funciona porque las funciones JS se pueden llamar pasándoles un 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());   } } 

→ Fuente

Pregunta No. 15 (4). ¿Qué tiene de malo el código que se te ha proporcionado?

Aquí está el código en cuestión:

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

Se recomienda que utilice parámetros opcionales en las devoluciones de llamada solo si comprende con absoluta precisión las consecuencias de tal paso. Este código tiene un significado muy específico: la devolución de llamada done se puede llamar con 1 o 2 argumentos. El autor del código probablemente tenía la intención de decirnos que la devolución de llamada puede no prestar atención al parámetro elapsedTime , pero para lograr esto, siempre puede crear una devolución de llamada que tome menos argumentos.

→ Fuente

Pregunta No. 16 (4). ¿Cómo sobrecargar el constructor de clases en TypeScript?

TypeScript le permite declarar muchas variantes de métodos, pero solo puede haber una implementación, y esta implementación debe tener una firma que sea compatible con todas las variantes de métodos sobrecargados. Para sobrecargar el constructor de la clase, puede usar varios enfoques:

• Puede usar el 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;   } } 

• Puede usar la configuración predeterminada:
  
  

   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;   } } 

• Puede usar sobrecargas adicionales como métodos de fábrica estáticos:
  
  

   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' }) 

• Puede usar el tipo de unión:
  
  

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

→ Fuente

Pregunta No. 17 (4). ¿Cuáles son las diferencias entre la interfaz y las palabras clave de tipo en TypeScript?

Aquí hay ejemplos del uso de estas palabras clave:

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

A diferencia de una declaración de interfaz, que siempre representa un tipo con nombre de un objeto, el uso de la palabra clave type permite especificar un alias para cualquier tipo de tipo, incluidos los tipos primitivos, los tipos de unión y los tipos de intersección.

Cuando se usa la palabra clave type lugar de la palabra clave interface , se pierden las siguientes posibilidades:

• Se puede usar una interfaz en una expresión de extends o implements , pero no se puede usar un alias para un tipo de objeto literal.
• Una interfaz puede tener varias declaraciones fusionadas, y cuando se usa la palabra clave type esta característica no está disponible.

→ Fuente

Pregunta No. 18 (5). Cuéntenos cuándo TypeScript usa la palabra clave declarar.

La palabra clave declare se usa en TypeScript para declarar variables, cuya fuente puede ser un archivo que no es un archivo TypeScript.

Por ejemplo, supongamos que tenemos una biblioteca llamada myLibrary . No tiene un archivo con declaraciones de tipo TypeScript, solo tiene el espacio de nombres myLibrary en el espacio de nombres global. Si desea usar esta biblioteca en su código TS, puede usar la siguiente construcción:

 declare var myLibrary; 

TypeScript asignará la variable myLibrary a any . El problema aquí es que en el momento del desarrollo no tendrá ninguna pista inteligente para esta biblioteca, aunque puede usarla en su código. En esta situación, puede usar otro enfoque que conduzca al mismo resultado. Estamos hablando de usar una variable de tipo any :

 var myLibrary: any; 

En ambos casos, al compilar el código TS en JavaScript, el resultado es el mismo, pero la opción de declare es mejor legible. El uso de esta palabra clave conduce a la creación de la llamada declaración externa de una variable (declaración ambiental).

Pregunta No. 19 (5). ¿Qué son las declaraciones de variables externas en TypeScript y cuándo deben usarse?

Una declaración externa de una variable (declaración ambiental) es un mecanismo que le permite al compilador TypeScript saber que existe algún código fuente en algún lugar fuera del archivo actual. Los anuncios externos ayudan a integrar bibliotecas JavaScript de terceros en los programas de TS.

Estas declaraciones se hacen en el archivo de declaración de tipo con la extensión .d.ts. Las variables o módulos externos declaran así:

 declare module Module_Name { } 

Los archivos que contienen código externo deben incluirse en el archivo TS utilizándolos, de la siguiente manera:

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

→ Fuente

Pregunta No. 20 (5). ¿Puedo generar automáticamente creatividades TypeScript a partir de bibliotecas JS?

JavaScript no siempre contiene suficiente información que permita a TypeScript inferir tipos automáticamente. Por lo tanto, es casi imposible crear automáticamente declaraciones de tipo basadas en JavaScript. Sin embargo, puede intentar hacerlo utilizando las siguientes herramientas:

• Microsoft / dts-gen es la herramienta oficial utilizada por Microsoft como punto de partida para crear declaraciones de tipo.
• dtsmake es una herramienta de desarrollo prometedora para crear automáticamente declaraciones de tipo basadas en archivos JS. Depende del sistema de análisis de código Tern , que algunos editores usan para implementar el mecanismo de autocompletado al ingresar el código JS.

→ Fuente

Resumen

Esperamos que una discusión de las preguntas en este material lo ayude a conocer mejor TypeScript, quizás preste atención a lo que no prestó atención anteriormente y, si se está preparando para una entrevista, aumentará sus posibilidades de pasarlo con éxito.

Estimados lectores! ¿Qué preguntas le haría al entrevistador que solicita un trabajo que requiere conocimiento de TypeScript?


- ¿Y cuál es el descuento para este código promocional?
- Parece un 7%. Comprobaré si quieres ...
"Sí, lo compruebas". En mi opinión, ¡el descuento es un poco caro!
...
- Lo siento, estaba un poco equivocado sobre el descuento. 10% en todos los servidores virtuales.