Preguntas frecuentes en entrevistas para juniors de JavaScript explicadas

Comprender los conceptos fundamentales de JavaScript es esencial para destacar en una entrevista para desarrollador junior. Este artículo cubre preguntas comunes en entrevistas, ofreciendo explicaciones y fragmentos de código que ilustran cada concepto.

1. ¿Cuál es la diferencia entre var, let y const?

var declara variables con alcance de función o global, mientras que let y const tienen alcance de bloque. Además, const impide reasignar la variable. Las variables declaradas con var pueden redeclararse en el mismo ámbito y se adjuntan al objeto global cuando son globales, pudiendo causar comportamientos inesperados. En contraste, let y const arrojan errores si se redeclaran en el mismo bloque y permanecen con alcance de bloque.

var globalVar = 'old';
if (true) {
  var globalVar = 'new'; // Redeclarada en el mismo ámbito
  let blockLet = 'bloque';
  const blockConst = 'constante';
}
console.log(globalVar); // 'new'

Fuentes:

• MDN: var
• MDN: let
• MDN: const

2. Explica el concepto de hoisting.

El hoisting es el comportamiento de JavaScript de mover declaraciones al inicio de su ámbito antes de ejecutar el código. Las declaraciones de funciones y variables usando var se elevan, mientras que let y const no se inicializan hasta ejecutar el código. Durante el hoisting, las declaraciones se mueven, pero las asignaciones permanecen en su lugar. Llamar una variable antes de asignarla devuelve undefined. Solo las declaraciones de funciones completas se elevan totalmente, mientras que las expresiones de funciones y funciones flecha se comportan como variables.

console.log(a); // undefined
var a = 5;

Fuente:

• MDN: Hoisting

3. ¿Qué son los closures?

Un closure ocurre cuando una función conserva acceso a su ámbito léxico incluso ejecutándose fuera de ese ámbito. Son comunes para privacidad de datos y funciones fábrica. Esta capacidad de recordar el ámbito circundante permite mantener variables privadas, facilitando patrones como funciones de ejecución única, memoización y currificación.

function crearContador() {
  let conteo = 0;
  return function () {
    conteo++;
    return conteo;
  };
}

const contador = crearContador();
console.log(contador()); // 1
console.log(contador()); // 2

Fuente:

• MDN: Closures

4. ¿Qué es el event bubbling?

El event bubbling es la propagación de eventos desde el elemento más profundo hacia arriba en el árbol del DOM. Puedes detener la propagación con event.stopPropagation(). Los eventos primero se disparan en el elemento más interno y luego "burbujean" hacia los ancestros salvo que se detenga. La fase contraria es la captura de eventos, que se dispara desde la raíz hacia abajo antes de la fase de bubbling.

<div id="externo">
  <button id="interno">Haz clic</button>
</div>

const externo = document.getElementById('externo');
const interno = document.getElementById('interno');

externo.addEventListener('click', () => console.log('Externo clickeado'));
interno.addEventListener('click', e => {
  console.log('Interno clickeado');
  // e.stopPropagation(); // Descomenta para detener la propagación
});

Fuente:

• MDN: Event Bubbling

5. ¿Cómo manejan código asincrónico las promesas y async/await?

Las promesas representan el resultado eventual de una operación asincrónica. async/await simplifica el código basado en promesas permitiendo escribir lógica asincrónica con un estilo síncrono. Las promesas tienen métodos como then y catch para encadenar acciones al completar o fallar tareas asincrónicas. Con funciones async, puedes manejar errores con try/catch, facilitando la lectura.

function obtenerDatos() {
  return new Promise(resolve => {
    setTimeout(() => resolve('Hecho'), 1000);
  });
}

async function ejecutar() {
  const resultado = await obtenerDatos();
  console.log(resultado); // 'Hecho'
}

ejecutar();

Fuentes:

• MDN: Promesas
• MDN: función async

6. ¿Cuáles son los tipos de datos primitivos en JavaScript?

JavaScript tiene siete tipos primitivos: string, number, bigint, boolean, undefined, symbol y null. Son inmutables, lo que significa que sus valores no pueden cambiar después de creados. Los tipos no primitivos como objetos y arreglos son mutables y se pasan por referencia.

const nombre = 'Ana';
const edad = 30;
const grande = 123n;
const activo = true;
let desconocido;
const id = Symbol('id');
const vacio = null;

Fuente:

• MDN: Tipos de datos

Referencias

• MDN Web Docs – Documentación completa de JavaScript.
• JavaScript.info – Tutoriales y explicaciones sobre conceptos fundamentales de JavaScript.