¿Cuáles son las preguntas de la entrevista para puestos de front-end web?

Un resumen de las preguntas de la entrevista frontal. Hay básicamente cuatro categorías de preguntas, de la siguiente manera:

1. HTML

1. de Doctype? ¿Cómo distinguir entre modo estricto y modo mixto? ¿Cuál es su significado?

2. ¿Por qué HTML5 solo necesita escribir ?

3. ¿Cuáles son los elementos en línea? ¿Qué son los elementos a nivel de bloque? ¿Cuáles son los elementos vacíos?

4. Al importar estilos en una página, ¿cuál es la diferencia entre usar link e @import?

5. ¿Presenta tu comprensión del núcleo del navegador?

6. ¿Cuáles son los núcleos de navegador más comunes?

7. ¿Cuáles son las nuevas características de html5 y qué elementos se han eliminado? ¿Cómo solucionar los problemas de compatibilidad del navegador con las nuevas etiquetas HTML5? ¿Cómo diferenciar entre HTML y HTML5?

8. Describe brevemente tu comprensión de la semántica HTML.

9. ¿Cómo utilizar el almacenamiento sin conexión HTML5? ¿Puedes explicar el principio de funcionamiento?

10. ¿Cómo gestiona y carga el navegador los recursos de almacenamiento fuera de línea HTML5?

11. Describa la diferencia entre cookies, almacenamiento de sesión y almacenamiento local.

12. ¿Cuáles son las desventajas del iframe?

13. ¿Cuál es la función de la Etiqueta? ¿Cómo se utiliza? (Agregar para o paquete)

14. ¿Cómo desactivar la función de autocompletar en formato HTML5?

15. ¿Cómo realizar la comunicación entre varias pestañas en el navegador? (Alibaba)

16. ¿Cómo es compatible webSocket con navegadores de gama baja? (Alibaba)

17. ¿Cuáles son los usos de la API de visibilidad de página?

18. ¿Cómo implementar un área circular en la que se puede hacer clic en la página?

19. Logre dibujar una línea de 1 px de alto sin usar borde y mantenga el mismo efecto en el modo Quirksmode y CSSCompat de diferentes navegadores.

20. ¿Para qué se utiliza el código de verificación de la página web? ¿Para qué problemas de seguridad se utiliza?

21. ¿Cuál es la diferencia entre tite y h1, by strong, i y em?

2. CSS

1. ¿Presentar el modelo de caja CSS estándar? ¿En qué se diferencia del modelo de caja de las versiones inferiores de IE?

2. ¿Qué son los selectores CSS? ¿Qué propiedades se pueden heredar?

3. ¿Cómo calcular el algoritmo de prioridad CSS?

4. ¿Cuáles son las nuevas pseudoclases en CSS3?

5. ¿Cómo centrar un div? ¿Cómo centrar un elemento flotante? ¿Cómo centrar un div absolutamente posicionado?

6. ¿Cuáles son los valores de visualización? Explique su papel.

7. ¿Cuáles son los orígenes de posicionamiento relativo y absoluto de la posición?

8. ¿Cuáles son las nuevas características de CSS3?

9. Explique CSS3 Flexbox (modelo de diseño de caja flexible) y sus escenarios aplicables.

10. ¿Cuál es el principio de crear un triángulo usando CSS puro?

11. ¿Cómo diseñar un diseño de Word en pantalla completa?

3.

1. ¿Cuál es la razón del espacio en blanco invisible entre li y li? ¿Hay alguna solución?

2. ¿Cuáles son las compatibilidades de los navegadores más comunes? ¿La razón, cuáles son las soluciones y las técnicas de piratería más utilizadas?

3. Por qué inicializar estilos CSS.

4. ¿En qué se diferencia el método de cálculo del bloque contenedor absoluto del del flujo normal?

5. ¿Para qué se utiliza el valor del atributo de colapso del atributo de visibilidad en CSS? ¿Cuál será la diferencia en diferentes navegadores?

6. ¿Qué pasará cuando las características de posición, visualización, colapso de margen, desbordamiento y flotación se superpongan entre sí?

7. ¿Entiendes la especificación BFC (contexto de formato de bloque)?

8. ¿Cómo se calcula la prioridad de peso de CSS?

9. Explique por qué ocurre la flotación y cuándo es necesario eliminarla. Cómo borrar los flotadores

10. ¿Has utilizado consultas de medios para el diseño móvil?

11. ¿Utiliza preprocesador CSS? ¿Como ese?

12. ¿Cuáles son los métodos para optimizar y mejorar el rendimiento de CSS?

13. ¿Cómo analiza el navegador los selectores de CSS?

14. ¿Se deben utilizar números pares o impares de fuentes en las páginas web? ¿Por qué?

15. ¿En qué escenarios son adecuados el uso del margen y el relleno?

16. Cómo escribir el módulo de estilo abstracto, cuéntame la idea, ¿tienes alguna experiencia práctica? [Preguntas de la entrevista sobre viajes aéreos de Alibaba]

17. ¿La configuración del porcentaje vertical de un elemento es relativa a la altura del contenedor?

18. ¿Cuál es el principio del desplazamiento en pantalla completa? ¿Qué propiedades CSS se utilizan?

19. ¿Qué es el diseño responsivo? ¿Cuáles son los principios básicos del diseño responsivo? ¿Cómo ser compatible con versiones inferiores de IE?

20. Efecto de desplazamiento Parallax, ¿cómo crear diferentes animaciones para cada página? (Vuelva a la parte superior, deslícese hacia abajo para que aparezca nuevamente o para que aparezca solo una vez).

21 ¿Cuál es la diferencia entre dos puntos y dos puntos simples en ::antes y :después? ? Explique las funciones de estos dos pseudoelementos.

22. ¿Cómo modificar el fondo amarillo del formulario que se rellena automáticamente en Chrome tras recordar la contraseña?

23. ¿Qué entiendes por altura de línea?

24. Después de configurar el elemento para que flote, ¿cuál es el valor de visualización del elemento? (Automáticamente se convierte en display:block)

25. ¿Cómo hacer que Chrome admita texto de menos de 12 píxeles?

26. ¿Cómo hacer que las fuentes de la página sean más claras y delgadas usando CSS? (-webkit-font-smoothing: antialiased;)

27. Al atributo de estilo de fuente se le puede asignar el valor "oblicuo".

28. ¿Qué debo hacer si position:fixed; no es válida en Android?

29. Si necesitas escribir la animación manualmente, ¿cuál crees que es el intervalo de tiempo mínimo y por qué? (Alibaba)

30. ¿Cuándo mostrará display:inline-block un espacio? (Ctrip)

31. ¿Cómo lidiar con el problema del desbordamiento: no se puede desplazar suavemente al desplazarse?

32. Hay un div de altura adaptable con dos divs dentro, uno con una altura de 100 px, y espero que el otro llene la altura restante.

33. Explique estos formatos de imagen como png, jpg y gif y cuándo usarlos. ¿Alguna vez has aprendido sobre webp?

34. ¿Qué es el aislamiento de cookies? (O: Cómo no permitir que lleve cookies al solicitar recursos)

35. ¿Cuál es la diferencia entre escribir la etiqueta de estilo después y antes del cuerpo?

4. JavaScript

1. Introducir los tipos de datos básicos de JavaScript.

2. ¿Cuéntame sobre las especificaciones básicas para escribir JavaScript?

3. Prototipo de JavaScript, cadena de prototipos ¿Cuáles son sus características?

4. ¿Cuántos tipos de valores tiene JavaScript? (Montón: tipo de datos primitivo y pila: tipo de datos de referencia), ¿puedes dibujar su diagrama de memoria?

5. ¿Cómo implementa Javascript la herencia?

6. ¿Varias formas de crear objetos en Javascript?

7. ¿Cadena de alcance de Javascript?

8. Hable sobre la comprensión de este objeto.

9. ¿Qué hace eval?

10. ¿Qué es un objeto de ventana? ¿Qué es un objeto de documento?

11. ¿Cuál es la diferencia entre nulo e indefinido?

12. Escriba una función de escucha de eventos general (pregunta de prueba de computadora).

13. ["1", "2", "3"].map(parseInt) ¿Cuál es la respuesta?

14. En cuanto a los eventos, ¿cuál es la diferencia entre los mecanismos de eventos de IE y Firefox? ¿Cómo dejar de burbujear?

15. ¿Qué es el cierre y por qué deberíamos utilizarlo?

16. ¿Qué significa "usar estricto" en código JavaScript?

17. ¿Cómo determinar si un objeto pertenece a una determinada clase?

18. ¿Qué hace específicamente el nuevo operador?

19. ¿Ha implementado alguna función utilizando JavaScript nativo?

20. En Javascript, hay una función que nunca buscará el prototipo cuando busca objetos durante la ejecución.

21. ¿Conoces JSON?

22. [].forEach.call($$("*"),function(a){ a.style.outline="1px sólido #"+(~~(Math.random() *(1<<24))).toString(16) }) ¿Puedes explicar el significado de este código?

23. ¿Cuáles son los métodos de carga diferida de js?

24. ¿Qué es Ajax? ¿Cómo crear un Ajax?

25. ¿Cuál es la diferencia entre sincrónico y asincrónico?

26. ¿Cómo resolver problemas entre dominios?

27. ¿La codificación de recursos solicitada es inconsistente?

28. ¿Cómo hacer desarrollo modular?

29. ¿Cuáles son las diferencias entre las especificaciones AMD (Módulos/Definición asíncrona) y CMD (Módulo común

Definición)?

30. ¿Cuál es el principio básico de requireJS? (¿Cómo cargar dinámicamente? ¿Cómo evitar cargas múltiples? ¿Cómo almacenar en caché?)

31. Si te piden que diseñes e implementes un requireJS tú mismo, ¿qué harías?

32. ¿Cuéntame sobre tu comprensión de ECMAScript6?

33. ¿Cómo escribir clases en ECMAScript6? ¿Por qué aparece la clase?

34.

35. ¿Cuál es la diferencia entre document.write e internalHTML?

36. Operaciones DOM: ¿cómo agregar, eliminar, mover, copiar, crear y buscar nodos?

37. ¿Cuáles son los significados y diferencias entre .call() y .apply()?

38. ¿Cuáles son los métodos nativos de matrices y objetos?

39. Cómo implementar una clase en JS.

¿Cómo crear una instancia de esta clase

40. Promoción de declaración de variables y alcance en JavaScript?

41. ¿Cómo escribir Javascript de alto rendimiento?

42. ¿Qué operaciones provocarán pérdidas de memoria?

43. ¿Has visto el código fuente de JQuery? ¿Puede darnos una breve descripción de su principio de implementación?

44. ¿A qué objeto se refiere esto devuelto por el método init de jQuery.fn? ¿Por qué devolver esto?

45. ¿Cómo convertir una matriz en una cadena json en jquery y luego volver a convertirla?

46. ¿Cuál es el principio de implementación de la copia del atributo de jQuery (extender) y cómo implementar la copia profunda?

47. ¿Cuál es la diferencia entre jquery.extend y jquery.fn.extend?

48. ¿Cómo se implementa la cola de jQuery? ¿Dónde se pueden utilizar las colas?

49. ¿Hablar sobre las diferencias entre bind(), live(), chose() y on() en Jquery?

50. Un objeto JQuery puede vincular múltiples eventos al mismo tiempo.

51. ¿Conoces eventos personalizados? ¿Qué significa la función fuego en jQuery y cuándo usarla?

52. ¿A través de qué método se combina jQuery con el selector Sizzle? (jQuery.fn.find() ingresa a Sizzle)

53. ¿Cuáles son los métodos de optimización para el rendimiento de jQuery?

54. ¿Cuál es la diferencia entre Jquery y jQuery UI?

55. ¿Has visto el código fuente de JQuery? ¿Puedes hablar brevemente sobre su principio de implementación?

56. ¿Cómo convertir una matriz en una cadena json en jquery y luego volver a convertirla?

57. ¿Cuál es la diferencia entre jQuery y Zepto? ¿Cuáles son sus respectivos escenarios de uso?

58. ¿Métodos de optimización para jQuery?

59. ¿Cómo resolver el problema del punto de acceso de Zepto?

60. ¿Cómo personalizar los componentes de jQueryUI?

61. Requisito: implementar un sitio web que no actualice toda la página durante las operaciones de la página y que pueda responder correctamente cuando el navegador avanza o hacia atrás. ¿Dar su plan de implementación técnica?

62. ¿Cómo determinar si el script actual se está ejecutando en el entorno del navegador o del nodo? (Alibaba)

63. ¿Cuál es el área táctil mínima en el terminal móvil?

64. Animación slideUp de jQuery. Si el elemento de destino es impulsado por eventos externos, cuando el mouse activa eventos de elementos externos de manera rápida y continua, la animación se ejecutará repetidamente con retraso, ¿cómo lidiar con esto?

65. ¿Cuál es la diferencia entre colocar la etiqueta Script en la parte inferior de la página antes de cerrar el cuerpo y después de cerrarlo? ¿Cómo los analizará el navegador?

66. Hay un retraso en los eventos de clic en el terminal móvil ¿Cuánto dura y por qué? ¿Cómo solucionar este retraso? (El clic tiene un retraso de 300 ms. Para implementar el diseño de evento de doble clic de Safari, el navegador necesita saber si desea hacer doble clic.

)

67. ¿Conoces los distintos frameworks JS (Angular, Backbone, Ember, React, Meteor, Knockout...)? ¿Puedes contarme sus respectivas ventajas y desventajas?

>68, ¿Qué objetos nativos JS extiende Underscore y qué métodos de funciones útiles proporciona?

69. ¿Explicar el alcance y la promoción de declaración de variables en JavaScript?

70. ¿Qué operaciones provocarán pérdidas de memoria?

71. Un objeto JQuery puede vincular múltiples eventos al mismo tiempo.

72. ¿Cuáles son los escenarios aplicables para Node.js?

(Si sabe cómo usar node) ¿Conoce ruta, middleware, cluster, nodemon, pm2, renderizado del lado del servidor?

73.

74. ¿Qué es el "enrutamiento frontal"? ¿Cuándo es apropiado utilizar el "enrutamiento frontal"? p>75. ¿Sabes qué es webkit? ¿Sabes cómo utilizar varias herramientas del navegador para depurar y depurar código?

76. Prueba unitaria ¿Sabes cómo probar tu proyecto front-end (mocha, sinon, jasmin, qUnit...)?

77. ¿Y cómo usarlo?

78. Describe brevemente el uso básico del manillar.

79. Describe brevemente el flujo de procesamiento básico de las plantillas de Handlerbars. ¿Cómo se almacena en caché?

80. ¿Utiliza js para implementar mil separadores? (Fuente: trabajadores migrantes front-end, consejo: regular + reemplazo)

¿Cuáles son las formas de detectar versiones del navegador?

81. Vinculamos dos eventos de clic a un DOM al mismo tiempo, uno usando captura y otro usando burbujeo. ¿Puede decirnos cuántas veces se ejecutará el evento y si se realizará burbujeo o captura? ejecutado primero

p>