p_a tema 5

¿cuál es una de las principales ventajas del desarrollo basado en componentes?. Mayor consumo de memoria. Divide y vencerás: abordar IU complejas mediante componentes pequeños. Elimina la necesidad de usar JavaScript. Obliga a usar un solo componente por aplicación.

¿Qué librería JavaScript se utiliza en los apuntes para desarrollar la capa de interfaz de usuario basada en componentes?. Angular. Vue.js. React. Svelte.

¿Qué sintaxis se utiliza en React para escribir el markup (HTML) dentro de los componentes?. HTML puro. JSX. TypeScript. XML estricto.

¿Cómo se declara una variable de estado en un componente funcional de React?. let [value, setValue] = useState(0);. const [value, setValue] = useState(0);. var value = useState(0);. this.state = { value: 0 };.

¿Qué efecto tiene llamar a la función setValue (la segunda devuelta por useState)?. Solo cambia el valor de la variable, sin afectar a la interfaz. Provoca que el componente se vuelva a renderizar (ejecutar la función de nuevo). Borra el estado del componente. No hace nada si el valor es el mismo.

¿Cómo se llaman las funciones que empiezan con use en React (como useState)?. Utilidades. Hooks. Componentes de orden superior. Render props.

¿Cuál es una regla importante sobre el uso de Hooks en React?. Pueden usarse dentro de bucles y condicionales libremente. Solo se pueden usar en componentes de clase. Deben usarse al comienzo de la función del componente, fuera de condicionales y bucles. No pueden llamar a otros Hooks.

¿Qué herramienta se recomienda en los apuntes para crear y desarrollar aplicaciones React?. Webpack. Create React App. Vite. Parcel.

¿Qué extensión deben tener los ficheros que contienen expresiones JSX según las convenciones del curso?. .js. .jsx. .tsx. .html.

¿Qué comando se usa para ejecutar la aplicación en modo desarrollo con Vite?. npm start. npm run build. npm run dev. vite serve.

¿Qué propiedad especial se debe usar en React para ayudar a identificar los elementos de una lista y optimizar su renderizado?. id. index. key. ref.

¿Cuál es la razón principal por la que se recomienda tratar los objetos de estado como inmutables en React?. Para evitar el uso de setState. Para permitir mecanismos de optimización que comparan referencias (shallow comparison). Porque es obligatorio según la sintaxis JSX. Para que el componente nunca se renderice de nuevo.

En el ejemplo del gestor de TODOs, ¿cómo se añade un nuevo TODO de forma inmutable?. todos.push(nuevoTodo); setTodos(todos);. todos.unshift(nuevoTodo); setTodos(todos);. setTodos([nuevoTodo, ...todos]);. setTodos(todos.concat(nuevoTodo));.

¿Por qué el atributo HTML se debe escribir como className en JSX en lugar de class?. Solo por convención de estilo. Porque class es una palabra reservada en JavaScript. Porque React lo exige para diferenciar de componentes. No es necesario, ambos funcionan.

¿Qué es el Virtual DOM en React?. Una copia exacta del DOM real que se guarda en disco. Una representación en memoria del DOM que React usa para calcular diferencias y actualizar eficientemente el DOM real. Un plugin del navegador. Un tipo especial de base de datos.

¿Qué ocurre si se hace clic en un TODO en el ejemplo del gestor de TODOs y se usa inmutabilidad?. Se actualiza todo el DOM desde la raíz. React solo modifica el atributo className del elemento li correspondiente en el DOM real. No ocurre ningún cambio visible. Se recarga toda la página.

¿Qué significa "shallow comparison" en el contexto de optimización de React?. Comparar cada elemento de un array uno por uno. Comparar las referencias de objetos en lugar de contenido. Comparar solo las propiedades de primer nivel de un objeto. Ambas b) y c) son correctas.

¿Qué extensión de Vite se usa para construir la versión de producción de la aplicación?. npm run prod. npm run build. npm run deploy. vite build.

¿Cuál es el propósito de la propiedad ref en React, según el ejemplo de AddTodo?. Almacenar el estado del input. Obtener una referencia directa al nodo DOM del elemento. Definir una clave única. Vincular un evento al elemento.

¿Qué ventaja adicional (no relacionada con rendimiento) se menciona sobre la inmutabilidad?. Facilita la implementación de funcionalidad de deshacer/rehacer (undo/redo). Reduce el tamaño del código. Permite usar bucles for en lugar de map. Elimina la necesidad de usar setState.

¿Qué nombre deben tener los componentes definidos por el desarrollador en React?. Todo en minúsculas. Deben empezar con mayúscula. Deben empezar con use. No hay restricción.

¿Qué expresión se usa en el componente Todos.jsx para generar múltiples elementos Todo a partir del array todos?. todos.forEach(todo => <Todo ...>). todos.map(todo => <Todo key={todo.id} todo={todo}/>). for (let todo of todos) { <Todo ...> }. todos.reduce(...).