Cuestionario: React para Desarrolladores Front-End

Pregunta 1 de 20

¿Para qué se usa el hook `useEffect`?

Solo para animar componentes al renderizarse

Para conectar el componente con Redux

Para ejecutar efectos secundarios como llamadas a API, suscripciones o manipulación directa del DOM

Para memoizar resultados de funciones costosas

Pregunta 2 de 20

¿Cuál es el propósito del hook `useState` en React?

Controlar la navegación entre páginas de la aplicación

Obtener datos de una API externa al cargar el componente

Compartir estado entre todos los componentes de la aplicación automáticamente

Añadir estado local reactivo a un componente funcional, re-renderizando cuando cambia

Pregunta 3 de 20

¿Qué es el "prop drilling" y por qué es considerado un problema?

El proceso de destruturar props en el parámetro de una función

Una técnica de optimización para mejorar el rendimiento del Virtual DOM

El patrón de pasar props a través de múltiples niveles de componentes intermedios que no los necesitan

Un error al pasar props con tipos incorrectos entre componentes

Pregunta 4 de 20

Al retornar la función de cleanup en `useEffect`, ¿cuándo se ejecuta?

Cuando el componente se desmonta O antes de ejecutar el efecto de nuevo por cambio de dependencias

Inmediatamente después de que el efecto se ejecuta, en el mismo ciclo

Solo cuando el componente es desmontado del árbol DOM

Solo si el efecto lanzó un error en la ejecución anterior

Pregunta 5 de 20

¿Qué es React.memo?

Una herramienta de debugging para ver el historial de renders

Un hook para memorizar valores en el state

Un HOC que evita re-renders de un componente funcional cuando sus props no cambian

Una función para guardar datos en localStorage automáticamente

Pregunta 6 de 20

¿Qué biblioteca es muy popular para gestión de estado global en aplicaciones React grandes?

Webpack

Redux (Redux Toolkit)

Prettier

Axios

Pregunta 7 de 20

¿Qué diferencia existe entre los conceptos de renderizado SSR y CSR en aplicaciones React?

CSR es más seguro porque el código no sale del servidor

CSR y SSR son técnicas de compresión de CSS, no de renderizado

SSR genera el HTML en el servidor mejorando SEO y primera carga; CSR lo genera en el navegador del cliente

SSR es exclusivo de frameworks como Angular, no es compatible con React

Pregunta 8 de 20

¿Cuál es la forma correcta de renderizar una lista de elementos en React?

{items.map(item => <Item key={item.id} data={item} />)}

items.forEach(item => render(<Item data={item} />))

Pregunta 9 de 20

¿Cuál es la diferencia entre `useMemo` y `useCallback`?

`useMemo` es para estado y `useCallback` para efectos secundarios

`useCallback` solo funciona con componentes de clase

Son idénticos, solo cambia el nombre por convenio

`useMemo` memoiza un valor computado; `useCallback` memoiza una función para evitar recrearla en cada render

Pregunta 10 de 20

¿Qué es el Virtual DOM en React y cuál es su principal ventaja?

El DOM que se usa exclusivamente durante el desarrollo

Una representación ligera en memoria del DOM real que React usa para minimizar las actualizaciones costosas al DOM real

Una copia de seguridad del DOM que se restaura en caso de error

Un DOM que solo existe en el servidor y se envía al cliente ya renderizado

Pregunta 11 de 20

¿Qué es el prop `key` en React y por qué es importante en listas?

Una contraseña para proteger las props de acceso externo

El índice de posición obligatorio de cada elemento de un array

Un identificador único que React usa para rastrear y actualizar eficientemente los elementos de una lista

Es una prop opcional decorativa para nombrar componentes en el DevTools

Pregunta 12 de 20

En React, ¿qué es un componente "controlado" (Controlled Component)?

Un componente cuyo valor de formulario es controlado por el estado de React, no por el DOM

Un componente que hereda su comportamiento de un componente padre obligatoriamente

Un componente que solo puede recibir props pero no tiene estado propio

Un componente que se renderiza exclusivamente en el servidor

Pregunta 13 de 20

¿Qué es un Custom Hook en React?

Una modificación no oficial de los hooks nativos de React

Una función que comienza con "use" y encapsula lógica reutilizable que puede llamar a otros hooks

Un plugin de terceros para extender las funcionalidades de React

Un componente especial que solo puede tener estado y no retorna JSX

Pregunta 14 de 20

¿Cuál es la forma correcta de actualizar un array en el estado de React?

setItems([...items, nuevoItem]);

items.push(nuevoItem); setItems(items);

items.add(nuevoItem);

setState.push(items, nuevoItem);

Pregunta 15 de 20

¿Qué es el "lifting state up" (elevar el estado) en React?

Importar el estado de otro archivo usando un módulo ES6

Mover el estado de un componente a localStorage para hacerlo persistente

Elevar el estado al componente padre común cuando varios hijos necesitan compartirlo

Usar Redux para reemplazar el estado local de todos los componentes

Pregunta 16 de 20

¿Cuándo se dispara el efecto en `useEffect(() => { ... }, [])` (array de dependencias vacío)?

Nunca, el array vacío lo desactiva

Solo cuando el componente recibe nuevas props

En cada re-renderizado del componente

Solo una vez, después del primer renderizado del componente

Pregunta 17 de 20

¿Qué hace el hook `useContext`?

Persiste el estado del componente entre recargas de página

Permite a un componente funcional consumir el valor de un Context sin usar Consumer

Conecta el componente con una base de datos externa en tiempo real

Crea un nuevo contexto global de la aplicación

Pregunta 18 de 20

¿Cuál es el propósito del archivo `package.json` en un proyecto React?

Definir las dependencias, scripts y metadatos del proyecto de Node.js/React

Guardar las respuestas de las APIs cacheadas por el navegador

Contener la configuración de Webpack para el bundling de la aplicación

Almacenar el estado global de la aplicación en formato JSON

Pregunta 19 de 20

¿Qué problema resuelve React Router?

Gestionar el estado global entre todos los componentes

Realizar peticiones HTTP a APIs REST de forma eficiente

Gestionar la navegación entre vistas en una SPA sin recargar la página

Proteger las rutas del servidor de acceso no autorizado

Pregunta 20 de 20

¿Qué es JSX en React?

Un framework CSS exclusivo para componentes de React

Una extensión de sintaxis que permite escribir HTML-like dentro de JavaScript, que Babel compila a llamadas React.createElement()

Un nuevo lenguaje de programación creado por Meta para reemplazar JavaScript

Un archivo de configuración de React para definir las rutas

Completa tus datos para el ranking

Tu nombre o alias *

Correo electrónico

Quiero recibir tips de programación, nuevos tests y contenido exclusivo