AngularJS Developer Interview Preparation Guide
Elevate your AngularJS Developer interview readiness with our detailed compilation of 125 questions. These questions are specifically selected to challenge and enhance your knowledge in AngularJS Developer. Perfect for all proficiency levels, they are key to your interview success. Dont miss out on our free PDF download, containing all 125 questions to help you succeed in your AngularJS Developer interview. Its an invaluable tool for reinforcing your knowledge and building confidence.125 AngularJS Developer Questions and Answers:
1 :: Tell me what is AngularJS?
AngularJS is a framework to build large scale and high performance web application while keeping them as easy-to-maintain. Following are the features of AngularJS framework.
☛ AngularJS is a powerful JavaScript based development framework to create RICH Internet Application (RIA).
☛ AngularJS provides developers options to write client side application (using JavaScript) in a clean MVC (Model View Controller) way.
☛ Application written in AngularJS is cross-browser compliant. AngularJS automatically handles JavaScript code suitable for each browser.
☛ AngularJS is open source, completely free, and used by thousands of developers around the world. It is licensed under the Apache License version 2.0.
☛ AngularJS is a powerful JavaScript based development framework to create RICH Internet Application (RIA).
☛ AngularJS provides developers options to write client side application (using JavaScript) in a clean MVC (Model View Controller) way.
☛ Application written in AngularJS is cross-browser compliant. AngularJS automatically handles JavaScript code suitable for each browser.
☛ AngularJS is open source, completely free, and used by thousands of developers around the world. It is licensed under the Apache License version 2.0.
2 :: Explain deep linking in AngularJS?
Deep linking allows you to encode the state of application in the URL so that it can be bookmarked. The application can then be restored from the URL to the same state.
3 :: What is ng-app directive?
ng-app directive defines and links an AngularJS application to HTML. It also indicate the start of the application.
4 :: What is ng-repeat directive?
ng-repeat directive repeats html elements for each item in a collection.
5 :: What is orderby filter?
orderby filter orders the array based on provided criteria.
In below example, to order subjects by marks, we've used orderBy marks.
Subject:
<ul>
<li ng-repeat = "subject in student.subjects | orderBy:'marks'">
{{ subject.name + ', marks:' + subject.marks }}
</li>
</ul>
In below example, to order subjects by marks, we've used orderBy marks.
Subject:
<ul>
<li ng-repeat = "subject in student.subjects | orderBy:'marks'">
{{ subject.name + ', marks:' + subject.marks }}
</li>
</ul>
6 :: Tell me how angular.module works?
angular.module is used to create AngularJS modules along with its dependent modules. Consider the following example:
var mainApp = angular.module("mainApp", []);
Here we've declared an application mainApp module using angular.module function. We've passed an empty array to it. This array generally contains dependent modules declared earlier.
var mainApp = angular.module("mainApp", []);
Here we've declared an application mainApp module using angular.module function. We've passed an empty array to it. This array generally contains dependent modules declared earlier.
7 :: Explain me what is factory method?
Using factory method, we first define a factory and then assign method to it.
var mainApp = angular.module("mainApp", []);
mainApp.factory('MathService', function() {
var factory = {};
factory.multiply = function(a, b) {
return a * b
}
return factory;
});
var mainApp = angular.module("mainApp", []);
mainApp.factory('MathService', function() {
var factory = {};
factory.multiply = function(a, b) {
return a * b
}
return factory;
});
8 :: Explain on which types of component can we create a custom directive?
AngularJS provides support to create custom directives for following type of elements.
☛ Element directives − Directive activates when a matching element is encountered.
☛ Attribute − Directive activates when a matching attribute is encountered.
☛ CSS − Directive activates when a matching css style is encountered.
☛ Comment − Directive activates when a matching comment is encountered.
☛ Element directives − Directive activates when a matching element is encountered.
☛ Attribute − Directive activates when a matching attribute is encountered.
☛ CSS − Directive activates when a matching css style is encountered.
☛ Comment − Directive activates when a matching comment is encountered.
9 :: Tell me how does interpolation, e.g. “{{ someModel }}”, actually work?
It relies on $interpolation, a service which is called by the compiler. It evaluates text and markup which may contain AngularJS expressions. For every interpolated expression, a “watch()” is set. $interpolation returns a function, which has a single argument, “context”. By calling that function and providing a scope as context, the expressions are “$parse()”d against that scope.
10 :: Tell me what should be the maximum number of concurrent “watches”? Bonus: How would you keep an eye on that number?
TL;DR Summary: To reduce memory consumption and improve performance it is a good idea to limit the number of watches on a page to 2,000. A utility called ng-stats can help track your watch count and digest cycles.
Jank happens when your application cannot keep up with the screen refresh rate. To achieve 60 frames-per-second, you only have about 16 milliseconds for your code to execute. It is crucial that the scope digest cycles are as short as possible for your application to be responsive and smooth. Memory use and digest cycle performance are directly affected by the number of active watches. Therefore, it is best to keep the number of watches below 2,000. The open-source utility ng-stats gives developers insight into the number of watches Angular is managing, as well as the frequency and duration of digest cycles over time.
Caution: Be wary of relying on a “single magic metric” as the golden rule to follow. You must take the context of your application into account. The number of watches is simply a basic health signal. If you have many thousands of watches, or worse, if you see that number continue to grow as you interact with your page. Those are strong indications that you should look under the hood and review your code.
This question is valuable as it gives insight into how the candidate debugs runtime issues while creating a discussion about performance and optimization.
Jank happens when your application cannot keep up with the screen refresh rate. To achieve 60 frames-per-second, you only have about 16 milliseconds for your code to execute. It is crucial that the scope digest cycles are as short as possible for your application to be responsive and smooth. Memory use and digest cycle performance are directly affected by the number of active watches. Therefore, it is best to keep the number of watches below 2,000. The open-source utility ng-stats gives developers insight into the number of watches Angular is managing, as well as the frequency and duration of digest cycles over time.
Caution: Be wary of relying on a “single magic metric” as the golden rule to follow. You must take the context of your application into account. The number of watches is simply a basic health signal. If you have many thousands of watches, or worse, if you see that number continue to grow as you interact with your page. Those are strong indications that you should look under the hood and review your code.
This question is valuable as it gives insight into how the candidate debugs runtime issues while creating a discussion about performance and optimization.