El resumen de las preguntas de la entrevista de React incluye principalmente conocimientos básicos, componentes de React, React Redux y enrutamiento de React .
conocimiento básico
1. Distinga entre DOM real y DOM virtual
| DOM real | DOM virtual |
|---|---|
| Las actualizaciones son lentas. | Actualice más rápido. |
| Puede actualizar HTML directamente. | No se puede actualizar HTML directamente. |
| Si se actualiza el elemento, se crea un nuevo DOM. | Si el elemento está actualizado, actualice JSX. |
| La manipulación de DOM es cara. | La manipulación de DOM es muy simple. |
| Consume más memoria. | Muy poco consumo de memoria. |
2. ¿Qué es React?
- React es una biblioteca de JavaScript de front-end desarrollada por Facebook en 2011.
- Sigue un enfoque basado en componentes y ayuda a crear componentes de IU reutilizables.
- Se utiliza para desarrollar una interfaz de usuario móvil y web compleja e interactiva.
- Aunque solo fue de código abierto en 2015, existe una gran comunidad de apoyo.
3. ¿Cuáles son las características de React?
Las principales funciones de React son las siguientes:
1) Utiliza DOM virtual en lugar de DOM real.
2) Se puede renderizar en el lado del servidor .
3) Sigue el flujo de datos unidireccional o el enlace de datos.
4. Enumere algunas de las principales ventajas de React.
Algunas de las principales ventajas de React son:
1) Mejora el rendimiento de la aplicación
2) Se puede usar fácilmente en el lado del cliente y del servidor
3) El código es muy legible debido a JSX
4) React es fácil de integrar con otros frameworks como Meteor, Angular
5) Usando Reaccionar, es muy fácil escribir casos de prueba de IU
5. ¿Cuáles son las limitaciones de React?
Las limitaciones de React son las siguientes:
1) React es solo una biblioteca, no un marco completo
2) Su biblioteca es muy grande y lleva tiempo comprenderla
3) Puede ser difícil de entender para los programadores novatos
4) La codificación se vuelve complicada porque usa plantillas en línea y JSX
6. ¿Qué es JSX?
JSX es la abreviatura de JavaScript XML. Es un archivo utilizado por React, que utiliza el poder expresivo de JavaScript y una sintaxis de plantilla similar a HTML. Esto hace que los archivos HTML sean muy fáciles de entender. Este archivo hace que la aplicación sea muy confiable y puede mejorar su rendimiento. Aquí hay un ejemplo de JSX:
render(){
return(
<div>
<h1> Hello World from Edureka!!</h1>
</div>
);
}
7. ¿Conoce Virtual DOM? Explique cómo funciona.
Virtual DOM es un objeto JavaScript ligero que originalmente era una copia del DOM real. Es un árbol de nodos, que trata los elementos, sus atributos y contenido como objetos y sus atributos. La función de renderizado de React crea un árbol de nodos a partir de los componentes de React. Luego actualiza el árbol en respuesta a los cambios en el modelo de datos causados por diversas acciones realizadas por el usuario o el sistema.
Hay tres pasos simples en el proceso de trabajo de Virtual DOM.
1) Siempre que cambien los datos subyacentes, la interfaz de usuario completa se volverá a representar en la descripción del DOM virtual.
2) Luego calcule la diferencia entre la representación DOM anterior y la nueva representación.
3) Una vez completado el cálculo, el DOM real solo se actualizará con el contenido modificado real.
8. ¿Por qué el navegador no puede leer JSX?
El navegador solo puede procesar objetos JavaScript, pero no puede leer JSX en objetos JavaScript normales. Entonces, para que el navegador pueda leer JSX, primero, debe usar un convertidor JSX como Babel para convertir el archivo JSX en un objeto JavaScript y luego pasarlo al navegador.
9. Comparado con ES5, ¿en qué se diferencia la sintaxis ES6 de React?
La siguiente sintaxis es la diferencia entre ES5 y ES6:
1） requiere 与 importación
// ES5
var React = require('react');
// ES6
import React from 'react';
2) Exportaciones y exportaciones
// ES5
module.exports = Component;
// ES6
export default Component;
3） componente 和 función
// ES5
var MyComponent = React.createClass({
render: function() {
return
<h3>Hello Edureka!</h3>;
}
});
// ES6
class MyComponent extends React.Component {
render() {
return
<h3>Hello Edureka!</h3>;
}
}
4） apoyos
// ES5
var App = React.createClass({
propTypes: { name: React.PropTypes.string },
render: function() {
return
<h3>Hello, {this.props.name}!</h3>;
}
});
// ES6
class App extends React.Component {
render() {
return
<h3>Hello, {this.props.name}!</h3>;
}
}
5） estado
// ES5
var App = React.createClass({
getInitialState: function() {
return { name: 'world' };
},
render: function() {
return
<h3>Hello, {this.state.name}!</h3>;
}
});
// ES6
class App extends React.Component {
constructor() {
super();
this.state = { name: 'world' };
}
render() {
return
<h3>Hello, {this.state.name}!</h3>;
}
}
10. ¿En qué se diferencia React de Angular?
| tema | Reaccionar | Angular |
|---|---|---|
| Arquitectura | Ver solo en MVC | MVC completo |
| Representación | Se puede renderizar en el lado del servidor. | Representación del cliente |
| JUICIO | Usar DOM virtual | Usar DOM real |
| El enlace de datos | Enlace de datos unidireccional | Enlace de datos bidireccional |
| depuración | Depurar en tiempo de compilación | Depuración en tiempo de ejecución |
| Autor |
Todo el contenido del resumen de la pregunta de la entrevista de React se ha organizado en un documento PDF. Si lo necesita, puede hacer clic aquí para obtenerlo de forma gratuita . También incluye el documento de preguntas de la entrevista CSS de front-end, el documento de preguntas de la entrevista JavaScript, Vue el documento de preguntas de la entrevista y el documento de preguntas de la entrevista de Dachang , ¡todos disponibles de forma gratuita!
Reaccionar componentes
1. Entiende la frase "En React, todo es un componente".
2. Explique el propósito de render () en React.
3. ¿Cómo integrar dos o más componentes en un componente?
4. ¿Qué es Props?
5. ¿Cuál es el estado en React? ¿Cómo se usa?
6. Distinguir entre estado y accesorios
7. ¿Cómo actualizar el estado del componente?
8. ¿Cuáles son las funciones de flecha en React? ¿cómo utilizar?
9. Distinguir entre componentes con estado y sin estado.
10. ¿Cuáles son las etapas del ciclo de vida del componente React?
11. Explique en detalle los métodos del ciclo de vida de los componentes de React.
12. ¿Qué son los eventos en React?
13. ¿Cómo crear un evento en React?
14. ¿Qué son los eventos sintéticos en React?
15. ¿Qué sabes sobre las referencias de React?
16. Enumere algunas situaciones en las que se deben utilizar las referencias.
17. ¿Cómo modularizar el código en React?
18. Cómo crear un formulario en React
19. ¿Cuánto sabe sobre componentes controlados y no controlados?
20. ¿Qué es un componente de orden superior (HOC)?
21. ¿Qué puedes hacer con HOC?
22. ¿Qué es un componente puro?
23. ¿Cuál es la importancia de las claves en React?
Reaccionar Redux
1. ¿Cuáles son los principales problemas del marco MVC?
2. Explicar Flux
3. ¿Qué es Redux?
4. ¿Cuáles son los tres principios que sigue Redux?
5. ¿Cuál es su comprensión de la "fuente única de la verdad"?
6. Enumere los componentes de Redux.
7. ¿Cómo fluyen los datos a través de Redux?
8. ¿Cómo definir Action en Redux?
9. Explique el papel del reductor.
10. ¿Cuál es el significado de Store en Redux?
11. ¿Cuál es la diferencia entre Redux y Flux?
12. ¿Cuáles son las ventajas de Redux?
Reaccionar enrutamiento
1. ¿Qué es el enrutamiento de React?
2. ¿Por qué se usa la palabra clave switch en React Router v4?
3. ¿Por qué necesita el enrutamiento en React?
4. Enumere las ventajas de React Router.
5. ¿En qué se diferencia React Router del enrutamiento normal?
Si lo necesita, puede hacer clic aquí para obtenerlo de forma gratuita , incluido el documento de preguntas de la entrevista de CSS de front-end, el documento de preguntas de la entrevista de JavaScript, el documento de preguntas de la entrevista de Vue y el documento de preguntas de la entrevista de Dachang , ¡todos disponibles de forma gratuita!
