GUIA DE PREGUNTAS PARA ENTREVISTAS DE TRABAJO

GUIA DE PREGUNTAS PARA ENTREVISTAS DE TRABAJO

Este repositorio contiene preguntas de entrevistas a programadores front-end, que pueden ser usadas para revisar a candidatos potenciales. Bajo ningún concepto se recomienda usar todas las preguntas aquí expuestas con el mismo candidato (eso llevaría horas). Escoger algunos elementos de esta lista debería ayudarle a revisar las habilidades que requiere.

Nota: Tenga en mente que muchas de estas preguntas son abiertas y pueden llevar a interesantes discusiones que le pueden decir más sobre las capacidades de la persona que una simple respuesta.

Índice

  1. Preguntas generales
  2. Preguntas específicas de HTML
  3. Preguntas específicas de CSS
  4. Preguntas específicas de JavaScript
  5. Preguntas sobre pruebas de código
  6. Preguntas sobre rendimiento
  7. Preguntas sobre conectividad
  8. Preguntas de código
  9. Preguntas divertidas

Contribuyendo

  1. Contribuyentes
  2. Cómo contribuir
  3. Licencia

Preguntas generales:

  • ¿Qué has aprendido en esta semana?
  • ¿Qué es lo que te interesa de la programación?
  • ¿Podría describir algún problema técnico que haya resuelto recientemente?
  • ¿Cuáles son las consideraciones del área de interfaces, rendimiento, posicionamiento, mantenimiento o seguridad que toma en cuenta al desarrollar sitios o aplicaciones web?
  • Hable acerca de su ambiente de desarrollo preferido.
  • ¿Qué sistemas de control de versiones ha usado?
  • ¿Puede describir el proceso que sigue cuando crea una página web?
  • Si tuviera cinco hojas de estilo distintas, ¿cómo las integraría a su página web?
  • ¿Puede describir la diferencia entre “Progressive Enhancement” y “Graceful Degradation”?
  • ¿Cómo optimizaría los recursos de un sitio web?
  • ¿Cuántos recursos se pueden descargar simultáneamente de un mismo dominio?
  • ¿Cuáles son las excepciones?
  • Mencione tres formas para disminuir el tiempo de carga de una página (tiempo real o percibido).
  • Si se ha unido a un proyecto y los desarrolladores usan tabs y usted usa espacios, ¿qué hace?
  • Describa como elaboraría una página con una galería sencilla.
  • Si pudiera elegir una tecnología para dominar este año, ¿cuál sería?
  • Explique la importancia de estándares y los grupos que los definen.
  • ¿Sabe que es el Flash Of Unstyled Content?, ¿cómo lo evita?
  • Explique qué son las Aplicaciones de internet enriquecidas y accesibles y los lectores de pantalla, además de cómo hacer una página web accesible
  • Explique las ventajas y desventajas de usar animaciones en CSS contrario a usar animaciones hechas con JavaScript.
  • ¿Qué significa CORS y a qué problema está relacionado?

Preguntas específicas de HTML:

  • ¿Qué función cumple el doctype y cuántos tipos puede nombrar?
  • ¿Cuál es la diferencia entre el modo convencional y el “quirks mode”?
  • ¿Cuál es la diferencia entre HTML y XHTML?
  • ¿Hay algún problema al servir las páginas usando: application/xhtml+xml?
  • ¿Cómo presentaría una página con contenido en varios lenguajes?
  • ¿Qué consideraciones se deben tener cuando se diseñan/desarrollan sitios multi-lenguajes?
  • ¿Para qué son buenos los atributos data-?
  • ¿Puede usar sintaxis de XHTML en HTML5?
  • ¿Cómo usa XML en HTML5?
  • Si consideramos HTML5 como una plataforma web abierta, ¿cuáles son los componentes que constituyen HTML5?
  • Describa la diferencia entre cookies, sessionStorage y localStorage.
  • Describa la diferencia entre <script>, <script async> y <script defer>.
  • Generalmente, ¿por qué es una buena idea agregar la etiqueta <link> dentro de la etiqueta <head> y la etiqueta <script> justo antes de cerrar la etiqueta <body>. ¿Conoces algún caso excepcional?
  • ¿Qué es el renderizado progresivo?
  • ¿Haz usado algún motor para creado de plantillas HTML?

Preguntas específicas de CSS:

  • ¿Cuál es la diferencia entre clases e identificadores en CSS?
  • ¿Cuál es la diferencia entre normalizar y anular el CSS?, ¿cuál usarías y por qué?
  • Describa qué son los “floats” y su funcionamiento.
  • Describa el z-index y como se decide el contexto de apilado de elementos.
  • Describa el contexto de formato de bloques (BFC) y como funciona.
  • ¿Cuáles son las técnicas para usar la propiedad clear y cuál funciona para cuál contexto?
  • Explique ¿qué son los sprites en CSS y cómo los implementarías en una página?
  • ¿Cuál es su técnica favorita para reemplazar imágenes y cuando usa cada una?
  • ¿Cómo intentaría resolver problemas de estilo para navegadores específicos?
  • ¿Cuál es su enfoque al desarrollar páginas que dan soporte a navegadores con capacidades limitadas?
  • ¿Qué técnicas o procesos usas?
  • ¿Cuáles son las distintas formas para esconder contenido, pero mantenerlo disponible únicamente para lectores de pantalla?
  • ¿Ha usado algún sistema para cuadrículas (grids) y cuál prefiere?
  • ¿Ha usado o implementado “media queries” o reglas específicas para dispositivos móviles?
  • ¿Está familiarizado con aplicar estilos a SVGs?
  • ¿Cómo optimiza sus páginas para la impresión?
  • ¿Cuáles son algunos de los “trucos” para escribir CSS eficiente?
  • Menciona las ventajas y desventajas de usar preprocesadores de CSS
  • Menciona lo que te agrada y desagrada de los preprocesadores que usas.
  • ¿Cómo implementaría un diseño que usa fuentes que no son web-safe?
  • ¿Puede explicar cómo determina un navegador qué elementos coinciden con un selector de CSS?
  • Describa los pseudo-elementos y discuta sus usos.
  • ¿Puede explicar cómo entiende el box model (modelo de cajas) y como podría hacer que un navegador renderize su esquema usando diferentes modelos de cajas?
  • ¿Qué sucede al usar * {box-sizing: border-box;}. ¿Qué desventajas supone su uso?
  • Por favor enliste todos los valores para la propiedad display que pueda recordar
  • ¿Cuál es la diferencia entre inline y inline-block?
  • ¿Cuál es la diferencia entre las posiciones relative, fixed, absolute y static para un elemento dado?
  • La C en CSS significa cascading (en cascada). ¿Cómo se determina la prioridad al asignar los estilos? ¿Cómo podemos aprovechar ese sistema?
  • ¿Cuáles frameworks de CSS has usado en desarrollo y producción? ¿Cómo los mejoraría?
  • ¿Qué sabe sobre CSS Flexbox y cuáles son sus ventajas?
  • ¿En que difiere el diseño responsivo del diseño adaptativo?
  • ¿Has trabajado con tecnología retina?, ¿qué técnicas usaste?
  • ¿Hay alguna razón por la cual preferirías usar translate() en vez de el posicionamiento absoluto? ¿Alguna razón para hacer lo contrario?

Preguntas específicas de JavaScript:

  • Explique “event delegation”.
  • Explique cómo funciona this en JavaScript.
  • Explique cómo funciona la herencia de prototipos (prototypal inheritance) en JavaScript.
  • ¿Qué opina de AMD en comparación con CommonJS?
  • Explique por qué function foo(){ }(); no funciona como un IIFE.
  • ¿Qué se necesita cambiar para que funcione como una IIFE?
  • ¿Cuál es la diferencia entre variables null, undefined y undeclared?
  • ¿Cómo comprobarías que una variable refiere a alguno de esos valores?
  • ¿Qué es un “closure” y cuando, o por qué usaría uno?
  • ¿Puede hablar de un uso típico para una función anónima?
  • ¿Cómo organiza su código, patrón módulo, herencia clásica?
  • ¿Cuál es la diferencia entre objetos huésped (host objects) y objetos nativos?
  • ¿Cuál es la diferencia entre: function Person(){}, var person = Person() y var person = new Person()?
  • ¿Cuál es la diferencia entre .call y .apply?
  • ¿Puede explicar el uso de Function.prototype.bind?
  • ¿Cuándo usarías document.write()?
  • ¿Cuál es la diferencia entre detección de capacidades, inferencia de capacidades y usar la cadena del user agent?.
  • Explique AJAX con tanto detalle como pueda.
  • Explique cómo funciona JSONP (y cómo no es AJAX realmente)
  • ¿Ha utilizado alguna vez templates en JavaScript?
    • De ser así, ¿qué bibliotecas ha usado?
  • ¿Puede explicar en qué consiste el “hoisting”?
  • ¿Puede hablar sobre “event bubbling”?
  • ¿Cuál es la diferencia entre un “atributo” y una “propiedad”?
  • ¿Por qué es una mala idea extender objetos nativos de JavaScript?
  • ¿Cuál es la diferencia entre el evento “document load” y el evento “document ready"?
  • ¿Cuál es la diferencia entre == y ===?
  • Explique la política de mismo origen (same-origin policy) y sus repercusiones en JavaScript.
  • Haga que este código funcione:
[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]
  • ¿Por qué reciben el nombre de sentencias ternarias? ¿Qué significa la palabra “ternaria”?
  • ¿Qué es "use strict";? ¿Cuáles son las ventajas y desventajas de usarlo?
  • Haga un ciclo for de 100 iteraciones que imprima “fizz” en los múltiplos de 3, “buzz” en los múltiplos de 5 y “fizzbuzz” en los múltiplos de 3 y 5
  • De manera general, ¿por qué es una buena idea no usar el “ámbito” (scope) global de un sitio web?
  • ¿Por qué usaría el evento load?, ¿usarlo representa alguna ventaja?, ¿conoce alternativas y el por qué usaría dichas alternativas?
  • Explique en qué consiste una aplicación de una sola página y como hacer una que bajo los términos del posicionamiento en los buscadores.
  • ¿Qué tanto sabes acerca de las promesas en javascript? ¿Conoce alternativas a ellas?
  • Mencione las ventajas y desventajas de usar promesas en vez de callbacks.
  • Menciona las ventajas y desventajas de escribir Javascript a través de otro lenguaje que compile y su resultado sea Javascript.
  • ¿Qué herramientas y técnicas usa para depurar código Javascript?
  • ¿Qué código utiliza para iterar sobre propiedades de un objeto y sobre arreglos?
  • Explique la diferencia entre objetos mutables y objetos inmutables.
  • Mencione un ejemplo de un objeto inmutable en javascript.
  • Mencione las ventajas y desventajas de la inmutabilidad.
  • ¿Cómo puede usar la inmutabilidad en su código?
  • Explique la diferencia entre funciones síncronas y asíncronas.
  • ¿Qué es el event loop?
  • ¿Cuál es la diferencia entre la pila de llamadas y la cola de tareas?

Preguntas sobre pruebas de código:

  • Menciona ventajas y desventajas de realizar pruebas en el código
  • ¿Qué herramientas usarías para probar la funcionalidad de tu código?
  • ¿Cuál es la diferencia entre una prueba unitaria y una prueba de funcionalidad?
  • ¿Cuál es el propósito de usar herramientas para verificar los estilos usados en el código?

Preguntas sobre rendimiento:

  • ¿Qué herramientas usarías para detectar un error en el rendimiento de tu código?
  • ¿De qué formas podrías mejorar el rendimiento del scrolling en tu sitio web?
  • Menciona las diferencias entre los términos layout, painting y compositing.

Preguntas sobre conectividad:

  • Tradicionalmente, ¿Por qué es mejor servir los recursos estáticos del sitio desde múltiples dominios?
  • Intenta explicar el proceso desde el momento en el cual ingresas una URL en el navegador hasta que termina de cargar la página en tu pantalla.
  • ¿Cuáles son las diferencias entre Long-polling, websockets y server-sent events?
  • Explique las siguientes cabeceras de respuesta y envío.
  • Expires, Date, Age y If-Modified-
  • Do Not Track
  • Cache-Control
  • Transfer-Encoding
  • Etag
  • X-Frame-Options
  • ¿Qué son las acciones HTTP? explique las acciones HTTP que conozca.

Preguntas de código:

Pregunta: ¿Cuál es el valor de foo?

var foo = 10 + '20';

Pregunta: ¿Cómo harías funcionar esto?

add(2, 5); // 7
add(2)(5); // 7

Pregunta: ¿Cuál es el resultado de la siguiente sentencia?

"i'm a lasagna hog".split("").reverse().join("");

Pregunta: ¿Cuál es el valor de window.foo?

( window.foo || ( window.foo = "bar" ) );

Pregunta: ¿Cuál es el resultado de los dos alerts?

var foo = "Hello";
(function() {
var bar = " World";
alert(foo + bar);
})();
alert(foo + bar);

Pregunta: ¿Cuál es el valor de foo.length?

var foo = [];
foo.push(1);
foo.push(2);

Pregunta: ¿Cuál es el valor de foo.x?

var foo = {n: 1};
var bar = foo;
foo.x = foo = {n: 2};

Pregunta: ¿Qué imprime el siguiente código?

console.log('one');
setTimeout(function() {
console.log('two');
}, 0);
console.log('three');

Preguntas divertidas:

  • ¿Qué es lo más genial que ha programado y qué es lo que más le enorgullece de ello?
  • ¿Cuáles son sus partes favoritas de las herramientas de desarrollo que usa?
  • ¿Tiene algún proyecto personal? ¿De qué tipo?
  • ¿Cuál es su funcionalidad favorita de Internet Explorer?
  • ¿Cómo te gusta tu café?

Contribuyentes

Este documento se creó en 2009 como una colaboración de @paul_irish @bentruyman @cowboy @ajpiano @SlexAxton @boazsender @miketaylr @vladikoff @gf3 @jon_neal @sambreed y @iansym.

Ha recibido contribuciones de 100 desarrolladores.