48 Questions et réponses sur les entretiens avec AngularJS (Liste 2021)

48 top angularjs interview questions

Liste des questions d'entrevue AngularJS les plus fréquemment posées avec des réponses détaillées pour les novices et les professionnels expérimentés:

AngularJS est l'un des frameworks de développement Web les plus récents au monde.

Dans presque chaque entretien, vous devrez lutter contre une concurrence féroce, afin de réussir et d'obtenir l'emploi de vos rêves. Par conséquent, vous devez vous préparer bien à l'avance.

Pour vous accompagner dans ce voyage, nous avons dressé une liste des questions d'entretien AngularJS les plus fréquemment posées ainsi que les réponses attendues par votre enquêteur au moment de l'entretien.

Lisez notre série de tutoriels AngularJS pour plus de connaissances sur le concept. Outil rapporteur pour tester AngularJS applications a été expliqué dans notre tutoriel précédent.

Questions d'entretiens AngularJS les plus fréquemment posées

Vous trouverez ci-dessous une liste des principales questions et réponses d'entretien sur AngularJS pour aider tout le monde à terminer une interview avec succès.

Explorons!!

Q # 1) Que comprenez-vous par AngularJS?

Répondre: AngularJS est un framework JavaScript utilisé pour créer des applications Web riches et extensibles.

Il fonctionne sur JavaScript et HTML simples, vous n'avez donc besoin d'aucune autre dépendance pour le faire fonctionner. AngularJS est parfait pour les applications à page unique (SPA). Il est essentiellement utilisé pour lier des objets JavaScript avec des éléments d'interface utilisateur HTML.

Q # 2) Définissez les fonctionnalités d'AngularJS.

Réponse: Les fonctionnalités comprennent:

• Le modèle (vue)
• La portée (modèle)
• Le contrôleur (contrôleur)
• Prestations de service
• Filtres
• Directives

Q # 3) Définissez la liaison de données.

Répondre: La liaison de données est une harmonisation automatique des données entre la vue et les composants du modèle.

Q # 4) Distinguer les expressions AngularJS et JavaScript.

Réponse: Il existe plusieurs différences entre les expressions AngularJS et JavaScript:

• Nous pouvons écrire des expressions AngularJS en HTML, mais nous ne pouvons pas écrire d'expressions JavaScript en HTML.
• Nous ne pouvons pas utiliser d'itérations conditionnelles, de boucles et d'exceptions dans AngularJS, mais nous pouvons utiliser toutes ces propriétés conditionnelles dans des expressions JavaScript.
• Les filtres sont pris en charge dans AngularJS alors que les filtres ne sont pas pris en charge dans JavaScript.

Q # 5) Écrivez toutes les étapes pour configurer un n Application angulaire (intégrée à l'application).

Réponse: Pour configurer une application angulaire, nous devons suivre certaines étapes comme indiqué ci-dessous:

• angular.module sera créé dans un premier temps.
• Un contrôleur sera affecté au module.
• Le module sera lié au modèle HTML (c.-à-d. UI ou View) avec une application angulaire (ng-app).
• Le modèle HTML sera lié au contrôleur (c'est-à-dire JS) avec une directive ng-controller.

Q # 6) Quels sont les modules angulaires?

Répondre: Les modules angulaires définissent collectivement une application angulaire où l'on peut écrire le code angulaire. Les modules contiennent les différentes parties d'une application angulaire. Un module est créé par la fonction angular.module en angular.

Q # 7) Quelles sont les portées de directive dans AngularJS?

Répondre: Trois portées de directive sont disponibles dans AngularJS.

Elles sont:

• Portée parent: Quelle que soit la modification que vous apportez à votre directive qui provient de la portée parente, se reflétera également dans la portée parente, et c'est également une portée par défaut.
• Portée enfant: Il s'agit d'une étendue imbriquée qui hérite d'une propriété de la portée parent. De plus, si des propriétés et une fonction de l'étendue ne sont pas liées à la directive d'étendue parente, une nouvelle directive d'étendue enfant est créée.
• Portée isolée: Il est réutilisable et est utilisé lorsque nous construisons une directive autonome. Il n'est utilisé que pour un usage privé et interne, ce qui signifie qu'il ne contient aucune propriété de la portée parent.

Q # 8) Comment pouvons-nous partager les données entre les contrôleurs dans AngularJS?

Répondre: Premièrement, nous devons créer un service. Le service est utilisé pour partager les données entre les contrôleurs dans AngularJS d'une manière très lucide, simple et rapide. Nous utilisons les événements, $ parent, le prochain frère et le contrôleur en utilisant un $ rootScope.

Q # 9) Quel est le cycle de digestion dans AngularJs?

Répondre: Cela fait partie du processus de liaison de données dans AngularJS. Il compare les anciennes et les nouvelles versions de la valeur du modèle de portée dans chaque cycle de résumé.

Le cycle de digestion est déclenché automatiquement. Nous pouvons également améliorer la convivialité en utilisant $ apply () si nous voulons déclencher le cycle de digest manuellement.

Q # 10) Expliquez les différences entre la liaison unidirectionnelle et la liaison bidirectionnelle.

Répondre: La liaison unidirectionnelle est utilisée pour lier les données du modèle à afficher sans mettre à jour le modèle HTML ou afficher automatiquement.

Ainsi, afin de mettre à jour le modèle HTML, nous devons écrire un code personnalisé qui mettra à jour la vue à chaque fois qu'une donnée est liée d'un modèle à l'autre.

Alors que la liaison bidirectionnelle est utilisée pour lier les données du modèle à la vue et vice versa (c'est-à-dire de la vue au modèle) en mettant à jour automatiquement le modèle HTML sans écrire de code personnalisé.

Q # 11) Différence entre sessionStorage, cookies et localStorage.

Réponse: Les différences sont les suivantes:

• SessionStorage - Les données sont stockées pour une session particulière. Les données seront perdues chaque fois que l'onglet du navigateur sera fermé ou après une session particulière. La taille maximale stockée peut aller jusqu'à 5 Mo.
• Stockage local - Les données sont stockées sans date d'expiration. Les données ne peuvent être effacées que par JavaScript ou en effaçant le cache du navigateur. La limite de stockage est supérieure à la sessionStorage et au cookie.
• Biscuits - Il stocke les données qui doivent être renvoyées au serveur avec certaines requêtes. L’expiration du cookie varie en fonction du type et de la durée définis du côté serveur ou du côté client. La taille maximale stockée peut être inférieure à 4 Ko.

Q # 12) Quel est le rôle de $ routeProvider dans AngularJS?

Répondre: C'est le $ routeProvider qui aide à naviguer entre les différentes pages / liens sans charger séparément la page / le lien chaque fois qu'un utilisateur clique sur un lien.

La méthode ngRoute config () est utilisée pour configurer la routeProvider.

Q # 13) Quelle est la différence entre $ scope et scope?

Répondre: Dans AngularJS, $ scope est utilisé pour réaliser l'injection de dépendances et scope est utilisé pour la liaison entre View (c'est-à-dire HTML) et Controller (c'est-à-dire JS).

Q # 14) Comment les préfixes AngularJS $ et $$ sont-ils utilisés?

Répondre: La variable $$ dans AngularJS est utilisée comme variable privée, car elle est utilisée pour éviter une collision accidentelle de code avec le code utilisateur.

Alors que $ prefix peut être utilisé pour désigner des fonctionnalités angulaires de base (comme une variable, un paramètre, une propriété ou une méthode).

Q # 15) Où pouvons-nous implémenter la manipulation DOM dans AngularJS?

Répondre: La manipulation du DOM est dans les directives et à part cela, elle ne devrait pas exister dans les services du contrôleur ou ailleurs.

Q # 16) Comment pouvons-nous montrer qu'une variable d'étendue ne doit avoir qu'une liaison unique?

Répondre: Pour afficher une liaison unique, nous devons utiliser ' :: »Devant la lunette.

Q # 17) Qu'est-ce que SPA (Single Page Application) dans AngularJS?

Répondre: Il s'agit d'une application Web qui charge une seule page HTML et met à jour la page de manière dynamique lorsque l'utilisateur se connecte à l'application.

En utilisant AJAX et HTML, une application Web fluide et réactive peut être créée par SPA sans recharges de page invariantes. Grâce à cela, nous pouvons créer une interface utilisateur réactive sans scintillement de page.

Q # 18) Combien de types de liaisons de données existe-t-il dans AngularJS?

Répondre: AngularJS prend en charge la liaison unidirectionnelle et bidirectionnelle.

Dans un sens, si nous modifions le modèle de données, il n'y aura pas de changement dynamique que vous verrez dans la vue, mais dans les deux sens, il y aura un changement dynamique chaque fois qu'un changement sera effectué dans le modèle de données.

Q # 19) Quelles sont les directives contraignantes dans AngularJs?

Réponse: Les directives contraignantes comprennent:

• ng-bind
• ng-bind-html
• ng-bind-template
• de non contraignable
• ng-modèle

Q # 20) Expliquez les directives ng-bind et ng-bind-html.

Répondre:

ng-bind : Il s'agit d'une directive qui remplace le contenu de l'élément HTML par la valeur de la variable ou de l'expression affectée.

Le contenu de l'élément HTML changera en changeant la valeur de la variable ou de l'expression.

C'est comme ({{expression}}) et la syntaxe pour cela est,

ng-bind-html : C'est une directive qui lie le contenu à l'élément HTML (vue) de manière sécurisée. $ sanitize service est utilisé pour nettoyer le contenu à lier dans un élément HTML. Pour ce faire, «angular-sanitize.js» doit être inclus dans notre application.

application pour espionner un téléphone Android

Syntaxe pour écrire ceci,

Q # 21) Expliquez ng-bind-template et ng-non-bindable.

Répondre:

ng-bind-template : Il remplace le contenu textuel de l'élément par interpolation du modèle. Il peut contenir plusieurs balisages doubles bouclés.

Non contraignable : Il spécifie AngularJS de ne pas compiler le contenu de cet élément HTML et de ses nœuds enfants.

Q # 22) Expliquez la directive ng-model dans AngularJs.

Répondre: Cela peut être un saut avec le contrôle de formulaire d'entrée HTML personnalisé (comme input, textarea et select) vers les données de l'application. Il fournit un comportement de validation de formulaire avec une liaison bidirectionnelle.

Q # 23) Définissez la méthode Factory dans AngularJS.

Répondre: C'est assez similaire au service, les usines implémentent un modèle de module dans lequel nous utilisons une méthode d'usine pour générer un objet qui est utilisé pour construire des modèles.

Dans une fabrique, un objet méthode est renvoyé à la fin en créant un nouvel objet et en ajoutant des fonctions en tant que propriétés.

Syntaxe :

Q # 24) Qu'est-ce que la directive ng-repeat dans AngularJS?

Répondre: Il rend ou itère sur une collection d'éléments et crée des éléments DOM. Il surveille régulièrement la source des données pour restituer un modèle en réponse à un changement.

Syntaxe:

Q # 25) Qu'est-ce qu'un contrôleur dans AngularJS?

Répondre: Un contrôleur est une fonction JavaScript liée à la portée spécifiée. Angular instancie le nouvel objet contrôleur et injecte la nouvelle portée en tant que dépendance.

Un contrôleur peut être utilisé pour configurer l'état initial de l'objet de portée et pour ajouter un comportement à l'objet. Un contrôleur ne peut pas être utilisé pour partager du code ou un état entre les contrôleurs, mais à la place de ce service angulaire peut être utilisé.

Q # 26) Que sont les filtres dans AngularJS?

Répondre: Le travail principal des filtres est de modifier les données, afin qu'elles puissent être fusionnées dans une expression ou une directive en utilisant un caractère de tube (il est utilisé pour appliquer des filtres dans un symbole angulaire d'un tube qui est (|) ou c'est le symbole).

Un filtre met en forme la valeur d'une expression pour un affichage à l'utilisateur. Ils peuvent être utilisés dans des modèles de vue, des contrôleurs ou des services, et nous pouvons également créer facilement notre propre filtre. Un filtre est un module fourni par AngularJS. Il y a neuf composants d'un filtre qui sont fournis par celui-ci.

Exemples: devise, date, filtre, JSON, limitTo, etc.

Q # 27) Qu'est-ce que la directive ng-App dans AngularJS?

Répondre: Il est utilisé pour définir l'application AngularJs. Il désigne l'élément racine de l'application et il est conservé près de la balise ou.

Nous pouvons définir n'importe quel nombre de directives ng-app dans le document HTML, mais une seule application AngularJS peut être amorcée automatiquement (amorçage automatique) et les autres applications doivent être amorcées manuellement.

Exemple:

Q # 28) Qu'est-ce que ng-switch dans AngularJS?

Répondre: Il est utilisé pour échanger conditionnellement la structure du DOM sur un modèle basé sur une expression basée sur la portée.

Cette directive vous permet d'afficher ou de masquer l'élément HTML en fonction de l'expression.

Q # 29) À quoi sert un événement de double-clic dans AngularJs?

Répondre: Il vous permet de spécifier le comportement personnalisé lors d'un événement de double clic de la souris sur une page Web. Nous pouvons l'utiliser (ng-dblclick) comme attribut de l'élément HTML comme,

Q # 30) Que sont les directives ng-include et ng-click dans AngularJs?

Répondre:

ng-include aide à inclure différents fichiers sur la page principale. La directive ng-include inclut du HTML à partir d'un fichier externe.

Le contenu inclus sera inclus en tant que nœuds enfants de l'élément spécifié. La valeur de l'attribut ng-include peut également être une expression, renvoyant un nom de fichier.

Par défaut, le fichier inclus doit se trouver sur le même domaine que le document.

ng-click peut être utilisé dans des scénarios comme lorsque vous cliquez sur un bouton ou lorsque vous souhaitez effectuer une opération. Il indique à AngularJS ce qu'il faut faire lorsqu'un élément HTML est cliqué.

Exemple:

Le code ci-dessus augmentera la variable de comptage de un chaque fois que vous cliquerez sur le bouton.

Q # 31) Qu'est-ce qu'un transfert d'état de représentation (REST) ​​dans AngularJs?

Répondre: REST est un style d'API qui fonctionne sur la requête HTTP.

L'URL demandée identifie les données à exploiter et la méthode HTTP identifie l'opération à effectuer. REST est un style d'API plutôt qu'une spécification formelle, et il y a beaucoup de débats et de désaccords sur ce qui est et n'est pas RESTful, qui est un terme utilisé pour indiquer une API qui suit le style REST.

AngularJS est flexible sur la façon dont les services Web RESTful sont consommés.

Q # 32) Que sont les API globales AngularJs?

Répondre: C'est une combinaison de fonction JavaScript globale qui est utilisée pour effectuer des tâches telles que la comparaison d'objets, l'itération d'objets et la conversion de données.

Il existe quelques fonctions API courantes telles que:

• angulaire. minuscule: Il convertit une chaîne en chaîne minuscule.
• angulaire. majuscule: Il convertit une chaîne en chaîne majuscule.
• angulaire. isString: Il retournera true si la référence actuelle est une chaîne.
• angulaire. isNumber: Il retournera vrai si la référence actuelle est un nombre.

Q # 33) Qu'est-ce qu'une méthode fournisseur dans AngularJs?

Répondre: Un fournisseur est un objet qui crée un objet de service en permettant de prendre plus de contrôle.

La méthode $ get () est utilisée dans le fournisseur qui renvoie l'objet de service. Le nom du service et la fonction de fabrique sont les arguments qui sont passés à la méthode du fournisseur. AngularJS utilise $ provide pour enregistrer de nouveaux fournisseurs.

Syntaxe:

Q # 34) Qu'est-ce que la gestion des événements?

Répondre: La gestion des événements dans AngularJs est très utile lorsque vous souhaitez créer des applications AngularJs avancées.

Nous devons gérer les événements DOM tels que les clics de souris, les mouvements, les pressions sur le clavier, les événements de changement, etc. AngularJs a des directives d'écoute comme ng-click, ng-dbl-click, ng-mousedown, ng-keydown, ng-keyup etc.

Q # 35) Qu'est-ce que AngularJs DOM?

Répondre: AngularJs ont des directives qui sont utilisées pour encapsuler les données d'application AngularJs dans un attribut désactivé des éléments HTML.

Exemple: La directive ng-disabled encapsule les données d'application dans les attributs désactivés de l'élément HTML DOM.

Q # 36) Quels sont les attributs qui peuvent être utilisés lors de la création de nouvelles directives AngularJs?

Répondre: Plusieurs attributs peuvent être utilisés lors de la création d'une nouvelle directive.

Ils incluent:

1. Modèle: Il décrit un modèle en ligne sous forme de chaîne.
2. URL du modèle: Cet attribut spécifie que le compilateur HTML AngularJs remplace la directive personnalisée à l'intérieur d'un modèle par le contenu HTML situé dans un fichier séparé.
3. Remplacer: Il remplace l'élément actuel si la condition est vraie si false ajoute cette directive à l'élément courant.
4. Transclure: Il vous permet de déplacer les enfants d'origine d'une directive vers un emplacement à l'intérieur du nouveau modèle.
5. Portée: Cela crée une nouvelle portée pour cette directive plutôt que d'hériter de la portée parente.
6. Manette: Il crée un contrôleur qui publie une API pour communiquer à travers les directives.
7. Exiger: Il faut qu'une autre directive soit présente pour faire fonctionner efficacement la directive actuelle.
8. Lien: Il modifie les instances d'élément DOM, ajoute des écouteurs d'événements et configure la liaison de données.
9. Compiler: Il modifie le modèle DOM pour les fonctionnalités sur les copies d'une directive, comme lorsqu'il est utilisé dans d'autres directives. Votre fonction de compilation peut également renvoyer des fonctions de lien pour modifier les instances d'élément résultantes.

Q # 37) Les contrôleurs imbriqués sont-ils possibles ou non dans AngularJs?

Répondre: Oui, c'est possible car les contrôleurs imbriqués sont bien définis de manière classifiée lors de l'utilisation d'une vue.

Q 38) AngularJS est-il bien adapté à tous les navigateurs?

Linux fonctionnera-t-il plus vite que Windows

Répondre: Oui, il est compatible avec tous les navigateurs tels que Safari, Chrome, Mozilla, Opera, IE, etc. ainsi qu'avec les navigateurs mobiles.

Q 39) Définissez les services dans AngularJS.

Répondre: Les services AngularJS sont les objets ou fonctions singleton qui sont utilisés pour effectuer des tâches définies. Il englobe certaines idées d'entreprise et ces objectifs peuvent être appelés contrôleurs, directive, filtres, etc.

Q 40) Expliquez les avantages d'AngularJS.

Réponse: Les avantages comprennent:

• Il prend en charge la forme MVC.
• Organisez deux méthodes de liaison de données à l'aide d'AngularJS.
• Il prend en charge la communication client-serveur mutuelle.
• Il prend en charge les simulations.

Q # 41) Différence entre les services et l'usine.

Répondre: Les usines sont des fonctions qui renvoient l'objet, tandis que les services sont des fonctions de constructeur de l'objet qui sont utilisées par un nouveau mot-clé.

Syntaxe:

Usine - module.factory (`nom_usine`, fonction);

Un service - module.service (`serviceName`, fonction);

Q # 42) Si l'usine et le service sont équivalents, quand dois-je les utiliser?

Répondre: Le fournisseur d'usine est préféré à l'aide d'un objet, tandis qu'un fournisseur de services utilise de préférence avec la classe.

Q # 43) Différence entre AngularJS et React.JS.

Répondre: AngularJS est un framework JS basé sur le langage TypeScript publié en octobre 2010 par Google. C'est un framework entièrement gratuit et open source qui est utilisé dans les projets SPA (c'est-à-dire les projets d'application à page unique).

React.JS est une bibliothèque javascript développée par Facebook en mars 2013 pour créer une interface utilisateur. Les composants React peuvent être utilisés sur plusieurs pages mais pas en tant que SPA (c'est-à-dire une application à page unique).

Q # 44) Différence entre les directives ng-bind et ng-model.

Répondre: La directive ng-bind a des liaisons de données unidirectionnelles, les données ne circulent que d'un objet à l'interface utilisateur, et non l'inverse (c'est-à-dire $ scope >> view) et la directive ng-model a des liaisons de données bidirectionnelles, des flux de données entre l'interface utilisateur et l'objet et vice versa (ie $ scope >> voir et voir >> $ scope).

Q # 45) Quelle est la différence entre AJAX et AngularJS?

Répondre: AJAX signifie JavaScript asynchrone qui est utilisé pour envoyer et obtenir des réponses du serveur sans charger la page.

Tandis que AngularJS est un framework JavaScript basé sur un langage typographique suivant le modèle MVC.

Q # 46) Définissez ng-if, ng-show et ng-hide.

Répondre: La directive ng-if est utilisée comme une clause if qui supprime l'élément HTML si l'expression devient fausse.

Syntaxe

La directive ng-show est utilisée pour afficher l'élément HTML si l'expression devient vraie. Et si l'expression devient fausse, l'élément HTML sera masqué.

Syntaxe

La directive ng-hide est utilisée pour masquer l'élément HTML si l'expression devient fausse.

Syntaxe

Ng-show et ng-hide utilisent la méthode de propriété d'affichage.

Q # 47) Quelle est la différence entre ngRoute et ui-router?

Répondre: ngRoute est un module développé par l'équipe angularJS qui faisait partie du framework angularJS de base. Alors que ui-router a été développé par une communauté tierce pour surmonter les problèmes de ngRoute.

ngRoute est un routage basé sur l'emplacement ou l'URL, et ui-router est un routage basé sur l'état qui permet des vues imbriquées.

Q # 48) Comment définir, obtenir et effacer les cookies dans AngularJs?

Répondre: AngularJS a un module appelé ngCookies, donc avant d'injecter ngCookies angular-cookies.js doit être inclus dans l'application.

• Définir les cookies - La méthode Put est utilisée pour définir les cookies dans un format clé-valeur.

• Obtenez des cookies - La méthode Get est utilisée pour obtenir les cookies.

• Effacer les cookies - La méthode Remove est utilisée pour supprimer les cookies.

Conclusion

Je suis sûr que cet article vous aurait aidé à comprendre les bases et le niveau avancé d'AngularJS.

Cet ensemble de questions et réponses d'entretien sur AngularJS répertoriées ici vous permettra de réussir n'importe quelle interview AngularJS avec succès à un niveau plus récent et d'expérience. Telles sont les questions fréquemment posées lors des entretiens. C'est tout pour le moment.

Cet article vous aidera à craquer et à affronter toute interview liée à AngularJS !! J'espère que vous avez apprécié toute la gamme de tutoriels de cette série AngularJS !!

Tutoriel PREV

lecture recommandée

• Questions et réponses d'entrevue
• Questions et réponses d'entrevue de test ETL
• Quelques questions et réponses difficiles sur les tests manuels
• 25 meilleures questions et réponses d'entrevue de test Agile
• Questions d'entrevue Spock avec réponses (les plus populaires)
• Quelques questions d'entretien intéressantes sur les tests de logiciels
• Top 20+ Questions et réponses d'entrevue .NET
• Top 51 des questions et réponses d'entrevue Bootstrap