Maison >interface Web >tutoriel HTML >FAQ sur les entretiens préliminaires
Présente des questions courantes lors des entretiens avec des ingénieurs front-end. Certaines d'entre elles n'ont pas de réponse. Vous pouvez réfléchir à ces questions pendant votre temps libre
1. Quels navigateurs sont couramment utilisés pour les tests ? Quels sont les noyaux (Layout Engine) ?
(Q1) Navigateurs : IE, Chrome, FireFox, Safari, Opera. (Q2) Noyau : Trident, Gecko, Presto, Webkit.2. Dites-moi la différence entre les éléments en ligne et les éléments de niveau bloc ? Utilisation de la compatibilité des éléments de bloc en ligne ? (Sous IE8)
(Q1) Éléments en ligne : seront disposés dans la direction horizontale et ne peuvent pas contenir d'éléments au niveau du bloc. La définition de la largeur n'est pas valide, la hauteur n'est pas valide (la hauteur de la ligne peut être définie). , les marges haut et bas ne sont pas valides, les remplissages haut et bas ne sont pas valides. Éléments de niveau bloc : chacun occupe une ligne et est disposé verticalement. Commence sur une nouvelle ligne et se termine par un saut de ligne. (Q2) Compatibilité : display:inline-block;*display:inline;*zoom:1;3. Quels sont les moyens d'effacer les flotteurs ? Quelle est la meilleure façon ?
(Q1) (1) Le div parent définit la hauteur. (2) Ajoutez une balise div vide clear:both à la fin. (3) Le div parent définit des pseudo-classes : after et zoom. (4) Le div parent définit overflow:hidden. (5) Le div parent définit overflow:auto. (6) Le div parent est également flottant et doit définir la largeur. (7) Le div parent définit display:table. (8) Ajoutez la balise br clear:both à la fin. (Q2) La meilleure méthode est la troisième méthode, qui est utilisée par de nombreux sites Web.4. Quels sont les attributs couramment utilisés du dimensionnement des boîtes ? Quelles sont les fonctions de chacun ?
(Q1)box-sizing : content-box|border-box|inherit;(Q2)content-box : La largeur et la hauteur sont appliquées à la zone de contenu de l'élément respectivement. Dessine le remplissage et les bordures de l'élément en dehors de la largeur et de la hauteur (effet par défaut de l'élément). border-box : Tous les remplissages et bordures spécifiés par l'élément seront dessinés dans la largeur et la hauteur définies. La largeur et la hauteur du contenu sont obtenues en soustrayant respectivement la bordure et le remplissage de la largeur et de la hauteur définies.5. Quel est le rôle de Doctype ? Quelle est la différence entre le mode standards et le mode compatibilité ?
(Q1) 1a309583e26acea4f04ca31122d8c535 indique à l'analyseur du navigateur quelle norme de document utiliser pour analyser ce document. Un DOCTYPE inexistant ou mal formaté entraînera le rendu du document en mode compatibilité. (Q2) Le formatage et le mode de fonctionnement JS en mode standard fonctionnent selon les normes les plus élevées prises en charge par le navigateur. En mode de compatibilité, les pages sont affichées de manière vaguement rétrocompatible, simulant le comportement des anciens navigateurs pour empêcher le site de fonctionner.6. Pourquoi avez-vous seulement besoin d'écrire fef50554eca1a427827adaa329da8122
HTML5 n'est pas basé sur SGML, il n'est donc pas nécessaire de référencer la DTD, mais un doctype est nécessaire pour réguler le comportement du navigateur (laisser les navigateurs fonctionner comme ils le devraient). HTML4.01 est basé sur SGML, vous devez donc référencer la DTD pour indiquer au navigateur le type de document utilisé par le document.7. Lors de l'importation de styles dans la page, quelle est la différence entre l'utilisation de link et @import ?
(1) le lien est une balise XHTML En plus de charger CSS, il peut également être utilisé pour définir RSS, définir les attributs de connexion rel, etc.; ne doit être utilisé que pour charger du CSS ; (2) Lorsque la page est chargée, le lien sera chargé en même temps, et le CSS référencé par @import attendra que la page soit chargée avant de se charger ; (3) L'import est CSS2.1 proposé, il ne peut être reconnu que dans IE5 ou supérieur, et le lien est une balise XHTML, il n'y a donc pas de problème de compatibilité.8. Veuillez présenter votre compréhension du noyau du navigateur ?
Il est principalement divisé en deux parties : le moteur de rendu (layout Engineer ou Rendering Engine) et le moteur js. Moteur de rendu : responsable de l'obtention du contenu de la page Web (HTML, XML, images, etc.), de l'organisation des informations (comme l'ajout de CSS, etc.) et du calcul de la méthode d'affichage du Web page, puis l'envoyer vers le moniteur ou l'imprimante. Différents noyaux de navigateur auront différentes interprétations grammaticales des pages Web, donc les effets de rendu seront également différents. Tous les navigateurs Web, clients de messagerie et autres applications qui modifient et affichent du contenu Web nécessitent le noyau. Moteur JS : analyse et exécute du javascript pour obtenir des effets dynamiques sur les pages Web. Au début, il n'y avait pas de distinction claire entre le moteur de rendu et le moteur JS. Plus tard, le moteur JS est devenu de plus en plus indépendant, et le noyau avait tendance à se référer uniquement au moteur de rendu.9. Quelles sont les nouveautés du html5 ? Comment gérer les problèmes de compatibilité des navigateurs avec les nouvelles balises HTML5 ? Comment différencier HTML et HTML5 ?
(Q1)HTML5 n'est plus un sous-ensemble de SGML, il s'agit principalement de l'ajout d'images, de localisation, de stockage, de multitâche et d'autres fonctions. (1) Toile de peinture ; (2) Éléments vidéo et audio pour la lecture multimédia (3) Stockage local hors ligne, stockage local des données à long terme, données du navigateur ; ne seront pas perdues après la fermeture ; (4) les données de sessionStorage seront automatiquement supprimées après la fermeture du navigateur (5) Éléments de contenu avec une meilleure sémantique, tels que l'article, le pied de page, l'en-tête ; , nav, section;(6) Contrôles de formulaire, calendrier, date, heure, email, url, recherche;(7) Webworker nouvelles technologies, websocket, Géolocalisation;(Q2)IE8/IE7/IE6 prend en charge les balises générées par la méthode document.createElement,Vous pouvez utiliser cette fonctionnalité pour que ces navigateurs prennent en charge les nouvelles balises HTML5.
Une fois que le navigateur a pris en charge les nouvelles balises, vous devez ajouter le style par défaut des balises.
Bien sûr, vous pouvez également utiliser directement des frameworks matures, tels que html5shim,
6fc79538f41ba7309e847292db36ab30
32e61bffab02d0270fa5334285b6797e
10. Décrivez brièvement votre compréhension de la sémantique HTML ?
Faites la bonne chose avec les bonnes balises.
La sémantique HTML structure le contenu de la page et rend la structure plus claire, ce qui facilite son analyse par les navigateurs et les moteurs de recherche
Il est affiché dans un format de document même sans style CSS Et. est facile à lire ;
Les robots des moteurs de recherche s'appuient également sur des balises HTML pour déterminer le contexte et le poids de chaque mot-clé, ce qui est bénéfique pour le référencement ;
Rendre le site Web plus facile pour les personnes qui lisent le code source Divisez le site Web en sections pour le rendre plus facile à lire, à maintenir et à comprendre.
JavaScript
1. Présentation des types de données de base de js
Indéfini, Null, Boolean , Number, String
2. Quels sont les objets intégrés dans js ?
Objets de classe d'encapsulation de données : objet, tableau, booléen, nombre et chaîne
Autres objets : fonction, arguments, mathématiques, date, RegExp, erreur
3. Compréhension de cet objet
cela pointe toujours vers l'appelant direct de la fonction (pas l'appelant indirect
S'il y a un nouveau mot-clé, cela pointe vers) ; new. L'objet ;
Dans l'événement, this pointe vers l'objet qui a déclenché l'événement. Spécialement, this dans attachEvent dans IE pointe toujours vers l'objet global Window.
4. Que fait l'évaluation ?
Sa fonction est d'analyser la chaîne correspondante dans le code JS et de l'exécuter
Vous devez éviter d'utiliser eval, qui est dangereux et très consommateur de performances (deux fois, une fois analysé dans js, exécutée une fois).
Lors de la conversion d'une chaîne JSON en objet JSON, vous pouvez utiliser eval, var obj =eval('(' str ')').
5. Comment ajouter, supprimer, déplacer, copier, créer et trouver des nœuds dans DOM
// 创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个具体的元素 createTextNode() //创建一个文本节点 // 添加、移除、替换、插入 appendChild() removeChild() replaceChild() insertBefore() //在已有的子节点前插入一个新的子节点 // 查找 getElementsByTagName() //通过标签名称 getElementsByName() //通过元素的Name属性的值(IE容错能力较强,会得到一个数组,其中包括id等于name值的) getElementById() //通过元素Id,唯一性
6. et indéfini ?
null est un objet qui représente "aucun" et vaut 0 lorsqu'il est converti en une valeur numérique ; undefined est une valeur primitive qui représente "aucun" et vaut NaN lorsqu'il est converti en valeur numérique.
indéfini :
(1) Lorsque la variable est déclarée mais qu'aucune valeur ne lui est attribuée, elle est égale à indéfinie.
(2) Lors de l'appel de la fonction, le paramètre qui doit être fourni n'est pas fourni et le paramètre est égal à indéfini.
(3) L'objet n'a aucun attribut attribué et la valeur de cet attribut n'est pas définie.
(4) Lorsque la fonction ne renvoie pas de valeur, elle renvoie undéfini par défaut.
null :
(1) En tant que paramètre d'une fonction, cela signifie que le paramètre de la fonction n'est pas un objet.
(2) sert de point final à la chaîne de prototypes d'objets.
7. Que fait exactement l'opérateur new ?
(1) Créer un objet vide, et la variable this fait référence à l'objet et hérite également de la fonction. prototype.
(2) Les propriétés et les méthodes sont ajoutées à l'objet référencé par ceci.
(3) L'objet nouvellement créé est référencé par this, et ceci est renvoyé implicitement à la fin.
8. Connaissez-vous JSON ?
JSON (JavaScript Object Notation) est un format léger d'échange de données. Il est basé sur un sous-ensemble de JavaScript. Le format des données est simple, facile à lire et à écrire et consomme peu de bande passante.
Format : en utilisant des paires clé-valeur, par exemple : {'age':'12', 'name':'back'}
9. () Quelles sont les différences et les fonctions ?
La fonction apply() a deux paramètres : le premier paramètre est le contexte et le deuxième paramètre est un tableau de paramètres. Si le contexte est nul, l'objet global est utilisé à la place.
Par exemple : function.apply(this,[1,2,3]);
Le premier paramètre de call() est le contexte, suivi de la séquence de paramètres transmise par le exemple.
Par exemple : function.call(this,1,2,3);
10 Comment obtenir l'UA ?
function whatBrowser() { document.Browser.Name.value=navigator.appName; document.Browser.Version.value=navigator.appVersion; document.Browser.Code.value=navigator.appCodeName; document.Browser.Agent.value=navigator.userAgent; }
Autres
1. Que savez-vous des codes de statut HTTP ?
100 Continuer. Généralement, lors de l'envoi d'une demande de publication, le serveur renverra ces informations après l'envoi de l'en-tête http pour indiquer la confirmation, puis enverra des informations de paramètres spécifiques
200 OK Normal. Retourner les informations
201 Créé La demande a réussi et le serveur a créé une nouvelle ressource
202 Accepté Le serveur a accepté la demande mais ne l'a pas encore traitée
301 Déplacé définitivement La page Web demandée a été définitivement déplacée vers un nouvel emplacement.
302 Trouvé Redirection temporaire.
303 Voir Autre redirection temporaire et utilisez toujours GET pour demander un nouvel URI.
304 Non modifié La page web demandée n'a pas été modifiée depuis la dernière requête.
400 Bad Request Le serveur ne peut pas comprendre le format de la requête et le client ne doit pas essayer de lancer à nouveau une requête en utilisant le même contenu.
401 Non autorisé La demande n'est pas autorisée.
403 L'accès interdit est interdit.
404 Not Found La ressource correspondant à l'URI est introuvable.
500 Erreur de serveur interne L'erreur côté serveur la plus courante.
503 Service indisponible Le serveur est temporairement incapable de traiter la demande (peut être dû à une surcharge ou à une maintenance).
2. De quelles méthodes d'optimisation des performances disposez-vous ?
(1) Réduire le nombre de requêtes http : CSS Sprites, JS, compression du code source CSS, contrôle approprié de la taille de l'image Gzip de la page Web, hébergement CDN, cache de données, serveur d'images ;
(2) Les données JS du modèle frontal réduisent le gaspillage de bande passante causé par les balises HTML. Le front-end utilise des variables pour enregistrer les résultats des requêtes ajax. Chaque fois que des variables locales sont utilisées, il n'est pas nécessaire de demander, ce qui réduit. le nombre de requêtes
( 3) Utilisez innerHTML au lieu des opérations DOM pour réduire le nombre d'opérations DOM et optimiser les performances javascript.
(4) Lorsqu'il y a de nombreux styles à définir, définissez className au lieu d'utiliser directement le style.
(5) Utilisez moins de variables globales et mettez en cache les résultats de la recherche de nœuds DOM. Réduisez les opérations de lecture d’E/S.
(6) Évitez d'utiliser l'expression CSS (expression css), également connue sous le nom de propriétés dynamiques (propriétés dynamiques).
(7) Préchargement de l'image, mettre la feuille de style en haut et le script en bas avec timestamp.
3. Que sont la dégradation gracieuse et l'amélioration progressive ?
Dégradation gracieuse : le site Web fonctionne correctement dans tous les navigateurs modernes. Si l'utilisateur utilise un navigateur plus ancien, le code vérifie qu'il fonctionne correctement.
En raison du problème unique de présentation du modèle de boîte d'IE, les pratiques de piratage pour différentes versions d'IE ont été gracieusement dégradées, ajoutant des candidats pour les navigateurs qui ne peuvent pas prendre en charge les fonctions, afin qu'ils puissent fonctionner d'une manière ou d'une autre sur les navigateurs plus anciens. dégrade l’expérience mais ne l’invalide pas complètement.
Amélioration progressive : en partant des fonctions de base prises en charge par tous les navigateurs, en ajoutant progressivement les fonctions qui ne sont prises en charge que par les nouveaux navigateurs, en ajoutant des styles et des fonctions supplémentaires à la page qui ne nuisent pas au navigateur de base. Ils sont automatiquement rendus et fonctionnels lorsqu'ils sont pris en charge par le navigateur.
4. Quelles opérations courantes peuvent provoquer des fuites de mémoire ?
Une fuite de mémoire est tout objet qui persiste après que vous ne le possédez plus ou n'en avez plus besoin.
Le ramasse-miettes analyse périodiquement les objets et compte le nombre d'autres objets qui ont des références à chaque objet. Si un objet a 0 référence (aucun autre objet n'y fait référence) ou si la seule référence à l'objet est circulaire, alors la mémoire de l'objet peut être récupérée.
Si le premier paramètre de setTimeout utilise une chaîne au lieu d'une fonction, cela provoquera une fuite de mémoire.
Fermetures, logs de console, boucles (une boucle se produit lorsque deux objets se référencent et se retiennent).
5. La différence entre les threads et les processus
Un programme a au moins un processus, et un processus a au moins un thread.
L'échelle de division des threads est plus petite que celle des processus, ce qui rend les programmes multithread hautement simultanés.
De plus, le processus dispose d'une unité de mémoire indépendante pendant l'exécution et plusieurs threads partagent la mémoire, améliorant ainsi considérablement l'efficacité d'exécution du programme.
Les threads sont toujours différents des processus lors de l'exécution. Chaque thread indépendant possède un point d'entrée pour l'exécution du programme, une séquence d'exécution séquentielle et un point de sortie pour le programme. Cependant, les threads ne peuvent pas s'exécuter indépendamment et doivent exister dans le programme d'application, et le programme d'application fournit un contrôle d'exécution de plusieurs threads.
D'un point de vue logique, la signification du multi-threading est que dans une application, plusieurs parties d'exécution peuvent être exécutées en même temps. Cependant, le système d'exploitation ne considère pas plusieurs threads comme plusieurs applications indépendantes pour mettre en œuvre la planification et la gestion des processus et l'allocation des ressources. C'est la différence importante entre les processus et les threads.
HTML
1. Quel est le rôle de Doctype ? Comment distinguer le mode strict du mode mixte ? Que signifient-ils ?
HTML5 Pourquoi avez-vous seulement besoin d'écrire fef50554eca1a427827adaa329da8122 ?
Quels sont les éléments en ligne ? Que sont les éléments de niveau bloc ? Quels sont les éléments vides ?
Quelle est la différence entre l'utilisation de link et @import lors de l'importation de styles sur une page ?
Présentez votre compréhension du noyau du navigateur ?
Quels sont les noyaux courants des navigateurs ?
Quelles sont les nouvelles fonctionnalités de html5 et quels éléments ont été supprimés ? Comment gérer les problèmes de compatibilité des navigateurs avec les nouvelles balises HTML5 ? Comment différencier HTML et HTML5 ?
Décrivez brièvement votre compréhension de la sémantique HTML ?
Comment utiliser le stockage hors ligne HTML5 ? Pouvez-vous expliquer le principe de fonctionnement ?
Comment le navigateur gère-t-il et charge-t-il les ressources de stockage hors ligne HTML5 ?
Veuillez décrire la différence entre les cookies, sessionStorage et localStorage ?
Quels sont les inconvénients de l'iframe ?
Quelle est la fonction du Label ? Comment est-il utilisé ? (Ajouter pour ou package)
Comment désactiver la fonction de saisie semi-automatique dans le formulaire HTML5 ?
Comment réaliser la communication entre plusieurs onglets dans le navigateur ? (Ali)
Comment webSocket est-il compatible avec les navigateurs bas de gamme ? (Alibaba)
Quelles sont les utilisations de l'API Page Visibility ?
Comment mettre en place une zone cliquable circulaire sur la page ?
Réalisez le dessin d'une ligne haute de 1 px sans utiliser de bordure, ce qui peut conserver le même effet en mode Quirksmode et CSSCompat de différents navigateurs.
À quoi sert le code de vérification de page Web ? Quels problèmes de sécurité est-il utilisé pour résoudre ?
Quelle est la différence entre tite et h1, b et strong, i et em ?
CSS
Introduire le modèle de boîte CSS standard ? En quoi est-il différent du modèle boîte des versions inférieures d’IE ?
Que sont les sélecteurs CSS ? Quelles propriétés peuvent être héritées ?
Comment est calculé l'algorithme de priorité CSS ?
Quelles sont les nouvelles pseudo-classes en CSS3 ?
Comment centrer un div ? Comment centrer un élément flottant ? Comment centrer un div en position absolue ?
Quelles sont les valeurs d'affichage ? Expliquez leur rôle.
Quelles sont les origines de positionnement relatives et absolues de la position ?
Quelles sont les nouvelles fonctionnalités de CSS3 ?
Veuillez expliquer la Flexbox (modèle de disposition de boîte flexible) de CSS3 et ses scénarios applicables ?
Quel est le principe de la création d'un triangle en utilisant du CSS pur ?
Comment concevoir une mise en page de mots en plein écran ?
Problèmes de compatibilité courants ?
Quelle est la raison de l'espace blanc invisible entre li et li ? Y a-t-il une solution ?
Quelle est la compatibilité des navigateurs couramment rencontrés ? La raison, quelles sont les solutions et les techniques de hack couramment utilisées ?
Pourquoi initialiser les styles CSS.
En quoi la méthode de calcul du bloc contenant absolu est-elle différente de celle du débit normal ?
À quoi sert la valeur de l'attribut de réduction de l'attribut de visibilité en CSS ? Quelle sera la différence selon les différents navigateurs ?
Que se passe-t-il lorsque les caractéristiques de position, d'affichage, de réduction de marge, de débordement et de flottement se superposent ?
Compréhension de la spécification BFC (contexte de formatage de bloc) ?
Comment la priorité de poids CSS est-elle calculée ?
Veuillez expliquer pourquoi le flottement se produit et quand il doit être éliminé ? Comment effacer les flottants
Avez-vous déjà utilisé des requêtes multimédias pour la mise en page mobile ?
Utiliser le préprocesseur CSS ? Comme celui-là ?
Quelles sont les méthodes pour optimiser et améliorer les performances du CSS ?
Comment le navigateur analyse-t-il les sélecteurs CSS ?
Dois-je utiliser un nombre pair ou impair de polices sur les pages Web ? Pourquoi?
Pour quels scénarios margin et padding sont-ils adaptés ?
Comment rédiger le module de style abstrait ? Dites-moi vos idées Avez-vous une expérience pratique ? [Question d'entretien avec Alibaba Air Travel] Le réglage en pourcentage vertical d'un élément est-il par rapport à la hauteur du conteneur ?
Quel est le principe du défilement plein écran ? Quelles propriétés CSS sont utilisées ?
Qu'est-ce que le design réactif ? Quels sont les principes de base du responsive design ? Comment être compatible avec les versions inférieures d’IE ?
Effet de défilement parallaxe, comment créer des animations différentes pour chaque page ? (Revenir en haut, faire glisser vers le bas pour le faire apparaître à nouveau, ou pour le faire apparaître une seule fois ?) Quelle est la différence entre les deux points et les deux points simples dans
::avant et :après ? Expliquez les fonctions de ces deux pseudo-éléments.
Comment modifier le fond jaune du formulaire rempli automatiquement une fois que Chrome a mémorisé le mot de passe ?
Qu'entendez-vous par hauteur de ligne ?
Après avoir défini l'élément sur float, quelle est la valeur d'affichage de l'élément ? (Il devient automatiquement display:block)
Comment rendre le texte de prise en charge de Chrome inférieur à 12 px ?
Comment rendre les polices de la page plus claires et plus fines en utilisant CSS ? (-webkit-font-smoothing : antialiased ;)
L'attribut font-style peut se voir attribuer la valeur "oblique". Que signifie oblique ?
position : corrigé ; n'est pas valide sur Android. Comment y remédier ?
Si vous devez écrire une animation manuellement, quel est, selon vous, l'intervalle de temps minimum et pourquoi ? (Alibaba)
display:inline-block Quand l'écart sera-t-il affiché ? (Ctrip)
débordement : Comment gérer le problème de ne pas pouvoir défiler en douceur lors du défilement ?
Il y a un div adaptatif en hauteur avec deux divs à l'intérieur, un avec une hauteur de 100px, et j'espère que l'autre remplit la hauteur restante.
Expliquez ces formats d'image png, jpg et gif et quand les utiliser. Avez-vous déjà entendu parler de Webp ?
Qu'est-ce que l'isolation des cookies ? (Ou : Comment ne pas le laisser transporter de cookies lors d'une demande de ressources)
Quelle est la différence entre écrire la balise de style après le corps et avant le corps ?
JavaScript
Présente les types de données de base de JavaScript.
Parlez-moi des spécifications de base pour écrire du JavaScript ?
Prototype JavaScript, chaîne de prototypes ? Quelles sont les caractéristiques ?
Combien de types de valeurs JavaScript possède-t-il ? (Tas : type de données primitif et pile : type de données de référence), pouvez-vous dessiner leur diagramme de mémoire ?
Comment Javascript implémente-t-il l'héritage ?
De combien de manières Javascript peut-il créer des objets ?
Domaine de la chaîne de portée Javascript ?
Parlez de la compréhension de cet objet.
Que fait eval ?
Qu'est-ce qu'un objet fenêtre ? Qu'est-ce qu'un objet document ?
Quelle est la différence entre null et indéfini ?
Écrire une fonction d'écoute d'événement générale (question de test informatique).
[«1», «2», «3»].map(parseInt) Quelle est la réponse ?
Concernant les événements, quelle est la différence entre les mécanismes événementiels d'IE et de Firefox ? Comment arrêter de bouillonner ?
Qu'est-ce que la fermeture et pourquoi devrions-nous l'utiliser ?
Que signifie « utiliser strict » dans le code JavaScript ? Quelle est la différence entre l'utiliser ?
Comment déterminer si un objet appartient à une certaine classe ?
Que fait exactement le nouvel opérateur ?
Une fonction a-t-elle été implémentée à l'aide de JavaScript natif ?
En Javascript, il existe une fonction qui ne recherchera jamais le prototype lors de la recherche d'objets lors de l'exécution. Quelle est cette fonction ?
Connaissez-vous JSON ?
[].forEach.call($$("*"),function(a){ a.style.outline="1px solid #" (~~(Math.random()*(1< <24))).toString(16) }) Pouvez-vous expliquer ce que signifie ce code ?
Quels sont les moyens de retarder le chargement de js ?
Qu'est-ce qu'Ajax ? Comment créer un Ajax ?
Quelle est la différence entre synchrone et asynchrone ?
Comment résoudre les problèmes inter-domaines ?
Que faire si l'encodage de la page et l'encodage des ressources demandées sont incohérents ?
Comment faire du développement modulaire ?
Quelles sont les différences entre les spécifications AMD (Modules/Asynchronous-Definition) et CMD (Common Module Definition) ?
Quel est le principe de base de requireJS ? (Comment charger dynamiquement ? Comment éviter les chargements multiples ? Comment mettre en cache ?)
Laissez-vous concevoir et implémenter vous-même un requireJS. Que feriez-vous ?
Parlez de votre compréhension d'ECMAScript6 ?
Comment écrire des classes dans ECMAScript6 ? Pourquoi la classe apparaît-elle ?
Quelles sont les méthodes de chargement asynchrone ?
Quelle est la différence entre document.write et innerHTML ?
Opérations DOM - comment ajouter, supprimer, déplacer, copier, créer et rechercher des nœuds ?
.call( ) et quelle est la signification et la différence de .apply() ?
Quelles sont les méthodes natives des tableaux et des objets ?
Comment implémenter une classe en JS. Comment instancier cette classe
Promotion de la portée et de la déclaration des variables en JavaScript ?
Comment écrire du Javascript haute performance ?
Quelles opérations provoqueront des fuites de mémoire ?
Avez-vous vu le code source de JQuery ? Pouvez-vous donner un bref aperçu de son principe de mise en œuvre ?
À quel objet ce retour de la méthode init de jQuery.fn fait-il référence ? Pourquoi rendre ça ?
Comment convertir un tableau en chaîne json dans jquery puis inversement ?
Quel est le principe d’implémentation de la copie d’attribut (extend) de jQuery et comment implémenter la copie profonde ?
Quelle est la différence entre jquery.extend et jquery.fn.extend ?
Comment la file d'attente de jQuery est-elle implémentée ? Où peut-on utiliser les files d'attente ?
Parlez des différences entre bind(), live(), délégué() et on() dans Jquery ?
JQuery peut lier plusieurs événements à un objet en même temps. Comment est-ce implémenté ?
Connaissez-vous les événements personnalisés. Que signifie la fonction fire dans jQuery et quand l'utiliser ?
Comment jQuery se combine-t-il avec le sélecteur Sizzle ? (jQuery.fn.find() dans Sizzle)
Méthode d'optimisation des performances jQuery ?
Quelle est la différence entre Jquery et jQuery UI ?
Avez-vous vu le code source de JQuery ? Pouvez-vous brièvement parler de son principe de mise en œuvre ?
Comment convertir un tableau en chaîne json dans jquery puis inversement ?
Quelle est la différence entre jQuery et Zepto ? Quels sont leurs scénarios d’utilisation respectifs ?
Méthode d'optimisation pour jQuery ?
Comment résoudre le problème du clic dans Zepto ?
Comment personnaliser les composants jQueryUI ?
Exigence : implémenter un site Web qui n'actualise pas la page entière pendant les opérations de page et peut répondre correctement lorsque le navigateur avance ou recule. Donnez votre plan de mise en œuvre technique ?
Comment déterminer si le script actuel s'exécute dans l'environnement du navigateur ou du nœud ? (Alibaba)
Quelle est la zone tactile minimale sur le terminal mobile ?
Animation slideUp de jQuery, si l'élément cible est piloté par des événements externes, lorsque la souris déclenche des événements d'éléments externes rapidement et en continu, l'animation sera exécutée à plusieurs reprises avec du décalage, comment y faire face
Remplacer le script Quelle est la différence entre placer la balise en bas de la page avant la fermeture du corps et après sa fermeture ? Comment le navigateur les analysera-t-il ?
Il y a un retard dans l'événement de clic sur le terminal mobile. Combien de temps dure-t-il et pourquoi ? Comment résoudre ce retard ? (Le clic a un délai de 300 ms. Afin d'implémenter la conception d'événement de double-clic de Safari, le navigateur doit savoir si vous souhaitez double-cliquer.)
Connaître divers frameworks JS (Angular, Backbone, Ember, React , Meteor, Knockout...) ? Pouvez-vous me dire leurs avantages et inconvénients respectifs ?
Quels objets natifs JS Underscore étend-il et quelles méthodes de fonction utiles fournit-il ?
Expliquer le levage de la portée et de la déclaration des variables en JavaScript ?
Quelles opérations provoqueront des fuites de mémoire ?
JQuery peut lier plusieurs événements à un objet en même temps. Comment est-ce implémenté ?
Quels sont les scénarios applicables pour Node.js ?
(Si vous savez utiliser node) Connaissez-vous route, middleware, cluster, nodemon, pm2, rendu côté serveur ?
Expliquez l'implémentation MVC de Backbone ?
Qu'est-ce que le « routage front-end » ? Quand est-il approprié d'utiliser le « routage front-end » ?
Le faites-vous ? savez-vous ce qu'est le webkit ? Savoir utiliser un navigateur Existe-t-il différents outils pour déboguer et déboguer du code
Comment tester le code front-end Connaissez-vous le BDD, le TDD, le test unitaire ? tester votre projet front-end (mocha, sinon, jasmin, qUnit...) ?
A quoi sert le template front-end (Moustache, underscore, handlebars) et comment l'utiliser ?
Décrire brièvement l'utilisation de base du guidon ?
Décrivez brièvement le processus de traitement de base du modèle de Handlerbars. Comment est-il compilé ? Comment est-il mis en cache ?
Utiliser js pour implémenter des séparateurs de milliers ? (Source : travailleurs migrants front-end, astuce : remplacement régulier)
Quels sont les moyens de détecter la version du navigateur ?
Nous lions deux événements de clic à un dom en même temps, l'un utilisant la capture et l'autre utilisant le bouillonnement. Pouvez-vous me dire combien de fois l'événement sera exécuté et si le bouillonnement ou la capture sera exécuté en premier
Autres questions
Quel est le processus de travail original de l'entreprise et comment collaborez-vous avec d'autres personnes ? Comment saluez-vous la coopération départementale ?
Quel est le problème technique le plus difficile que vous ayez rencontré ? Comment l'avez-vous résolu ?
Design Pattern Savez-vous ce que sont singleton, factory, stratégie et decrator ?
Quelles sont les bibliothèques couramment utilisées ? Outils de développement front-end couramment utilisés ? Quelles applications ou composants avez-vous développés ?
Comment reconstruire la page ?
Énumérez les fonctionnalités qui différencient IE des autres navigateurs ?
Quel livre dit que 99 % des sites Web doivent être refactorisés ?
Qu'est-ce que la dégradation gracieuse et l'amélioration progressive ?
Comprenez-vous le cryptage à clé publique et le cryptage à clé privée.
Quels sont les moyens utilisés par les applications WEB pour transmettre activement les données du serveur vers le client ?
Vous avez votre propre opinion sur les avantages et les inconvénients de Node ?
Quelles méthodes d'optimisation des performances front-end avez-vous utilisées ?
Quels sont les codes de statut http ? Que veulent-ils dire ?
Que se passe-t-il dans le processus depuis la saisie de l'URL jusqu'à la fin du chargement et de l'affichage d'une page ? (Plus le processus est détaillé, mieux c'est)
Les utilisateurs de certaines régions ont signalé que le site Web est très bloqué. Quelles sont les raisons possibles et les solutions ?
Que se passe-t-il pendant tout le processus, depuis l'ouverture de l'application jusqu'à l'actualisation du contenu ? Si cela semble lent, comment localiser le problème et comment le résoudre
En plus du front-end, connaissez-vous d'autres technologies? Quelle est votre plus grande compétence ?
Quel est l'éditeur et l'environnement de développement que vous utilisez à l'aise ?
Comment comprenez-vous le poste d’ingénieur interface front-end ? Quelles sont ses perspectives ?
Que pensez-vous de la Web App, de l'application hybride, de l'application native ?
Comprenez-vous le développement front-end mobile ? (Quelle est la principale différence avec le développement web front-end ?)
Que pensez-vous des heures supplémentaires ?
Comment gérez-vous habituellement vos projets ?
Parlez-nous de certaines des choses les plus populaires récemment ? Quels sites Web visitez-vous souvent ?
Comment concevoir une architecture de concurrence soudaine à grande échelle ?
Parlez-nous de certaines des choses les plus populaires récemment ? Quels sites Web visitez-vous souvent ?
Connaissez-vous les outils open source bower, npm, yeoman, Grunt, gulp, et quels sont les champs nécessaires que possède package.json dans un package npm ? (nom, numéro de version, dépendances)
La structure du code de chaque module doit être relativement simple, et la relation entre chaque module doit également être très claire. À mesure que le nombre de fonctions et d'itérations augmente, vous allez savoir comment. maintenir cet état ?
Git connaît-il les branchements, les différences, les fusions ?
Comment concevoir une architecture de concurrence soudaine à grande échelle ?
Lorsque l'équipe manque de main-d'œuvre et doit faire des heures supplémentaires après avoir écrit le code fonctionnel, effectuerez-vous des tests de code front-end ?
Parlez-nous de certaines des choses les plus populaires récemment ? Quels sites Web visitez-vous habituellement ?
Savez-vous ce qu'est le SEO et comment l'optimiser ? Connaissez-vous la signification des différentes méta données ?
Comment améliorer l'expérience utilisateur sur le terminal mobile (Android ios) ?
Une brève description Parlez-nous du processus de développement de projet d'application mobile que vous avez réalisé ?
Quel est votre rôle dans l’équipe actuelle et quel rôle important jouez-vous ?
Pour vous, qu'est-ce qu'un développeur Full Stack ?
Présentez l’une de vos œuvres dont vous êtes la plus fière ?
Avez-vous votre propre blog technologique ? Quelles technologies utilisez-vous ?
Que pensez-vous de la sécurité frontale ?
Comprenez-vous les attaques par injection Web ? Laissez-moi vous expliquer les principes. Dans quelle mesure comprenez-vous les deux attaques les plus courantes (XSS et CSRF) ?
Quels problèmes techniques impressionnants ont été rencontrés dans le projet ? Quels étaient les problèmes spécifiques et comment ont-ils été résolus ? .
Qu’apprenez-vous récemment ?
Quels sont vos points forts ? Quels sont les inconvénients ?
Comment manager une équipe front-end ?
Qu'avez-vous appris récemment ? Pouvez-vous parler de vos projets pour les 3 ou 5 prochaines années ?