Aurelia Interview Questions & Answers
Aurelia Interview Questions And Answers
Aurelia Tutorial
Aurelia Jobs
All Interview Questions-
Question 1. In Aurelia, What Does System.js Contains?
Answer :
The scripts/system.js is a modern JavaScript module loader. Since Aurelia itself is written as modules, it encourages to create code in a modular fashion. To use modules in ES 2016, we need a loader for understanding modular code. That is the purpose of SystemJS. It locates modules, understands their dependencies and ensures that everything is properly loaded at runtime.
-
Question 2. Explain The Purpose Of Constructor() In Aurelia?
Answer :
Constructor method is used for initializing object created with a class. This method is called first. If we don't specify this method, the default constructor will be used.
For example
export class App
{
constructor()
{
this.counter = 1;
}
}here we are initializing teh counter property to 1 inside the constructor. Later we can use this in the view and display the value as 1 like
${counter}
HTML Interview Questions
-
Question 3. Explain System.import('aureliabootstrapper'); In Aurelia
Answer :
The SystemJS module loader provided the SystemJS object. Its has a method import which tells the loader to load/import a module aureliabootstrapper which resides in the aureliacore.min.js. Using this module, Aurelia load the framework, configure and run the application.
-
Question 4. What Does <body Aureliaapp="src/main"> Signifies?
Answer :
On the body tag, there's an aureliaapp attribute targeting to src/main. This tells Aurelia's bootstrapper to load the app viewmodel and it's view and also the host HTML element where the application will be rendered.
HTML Tutorial
-
Question 5. Identity The Features Of Aurelia?
Answer :
Aurelia is highly modular and designed to be customized easily.We can add or remove any tools that the framework offers and can also add any other tools that aren't part of the framework. e.g we can easily integrate with jQuery, React , Google MapAPI etc. in Aurelia Each Aurelia library is released with its own d.ts files. They have official TypeScript beginner kits and production quality starter kits
Java Persistence API Interview Questions
-
Question 6. What Is The Significance Of Index.html In Aurelia?
Answer :
index.html is deafult page of the app like in most of the HTML based apps. It is a place where scripts and stylesheets are loaded.It looks as under
<!DOCTYPE html>
<html>
<head>
<title>Aurelia</title>
</head>
<body aurelia‐app="src/main">
<script src="scripts/system.js"></script>
<script src="scripts/config‐typescript.js"></script>
<script src="scripts/aurelia‐core.min.js"></script>
<script>
System.import('aurelia‐bootstrapper');
</script>
</body>
</html>We can also configure the programming language selection.Let's adjust our programming language. The default is pointing to TypeScript.
<script src="scripts/config‐typescript.js"></script>
However, we will choose ESNext. So we need to change that to <script src="scripts/config‐esnext.js"></script>
So our index.html will now look like
<!DOCTYPE html>
<html>
<head>
<title>Aurelia</title>
</head>
<body aurelia‐app="src/main">
<script src="scripts/system.js"></script>
<script src="scripts/config‐esnext.js"></script>
<script src="scripts/aurelia‐core.min.js"></script>
<script>
System.import('aurelia‐bootstrapper');
</script>
</body>
</html> -
Answer :
Aurelia is a modern, open source client side JavaScript framework for web and mobile application development. It emphasis on simple conventions and ES6/ES7 support. It is written using ECMAScript 2016. Using Aurelia, we can build applications using modules, classes, decorators etc.
Microsoft Entity Framework Tutorial
Microsoft Entity Framework Interview Questions
-
Question 8. What Are The Features Of Aurelia?
Answer :
Aurelia Features :
- Components : Component are building blocks of Aurelia framework. It is composed of HTML view and JavaScript view-model pairs.
- Web Standards : This is one of the cleanest modern frameworks, completely focused on web standards without unnecessary abstractions.
- Extensible : The framework offers an easy way to integrate with the other needed tools.
- Commercial Support : Aurelia offers commercial and enterprise support. It is official product of Durandal Inc.
- License : Aurelia is open sourced and licensed under MIT licence.
-
Question 9. What Are The Aurelia Advantages And Limitations?
Answer :
Aurelia Advantages :
- Aurelia is very clean. If you follow the frameworks conventions, you can focus on your app without the framework getting on your way.
- It is also easily extensible. You can add or remove any tools that the framework offers and you can also add any other tools that aren't part of the framework.
- Aurelia is very easy to work with. It is directed towards developers experience. This will save you lots of time and headaches on the road.
- The framework itself is directed towards web standards so you will always stay up to date with modern concepts.
- Aurelia don't have the largest community out there, but it is very agile, knowledgeable and willing to help in the short notice.
Aurelia Limitations :
There is no any true limitations. Framework is powerfull and easy to work with. Someone could think that smaller community might couse some problems on the road, but we didn't have those kind of issues.
Java Interview Questions
-
Question 10. Explain Component Life Cycle Of Aurelia?
Answer :
Aurelia use component lifecycle methods to allow us manipulating component lificycle.
- constructor() − Constructor method is used for initializing object created with a class. This method is called first. If you don't specify this method, the default constructor will be used.
- created(owningView, myView) − This is called once the view and view-model are created and connected to controller. This method takes two arguments. The first one is the view where the component is declared (owningView). The second one component view (myView).
- bind(bindingContext, overrideContext) − At this point of time the binding has started. The first argument represents binding context of the component. The second one is overrideContext. This argument is used for adding additional contextual properties.
- attached() − Attached method is invoked once the component is attached to the DOM.
- detached() − This method is opposite to attached. It is invoked when component is removed from the DOM.
- unbind() &minu; The last lifecycle method is unbind. It is called when the component is unbound.
The lifecycle methods are useful when you want to have higher control over your component. You can use them when you need to trigger some functionalities at certain point of component lifecycle.
Java Tutorial
-
Question 11. Explain The Components Of Aurelia?
Answer :
Components are main building blocks of Aurelia framework.
Simple Component :
Each component contains view-model which is written in JavaScript and view, written in HTML. You can see our view-model definition below. This is an ES6 example but you can also use TypeScript.
app.js
export class MyComponent
{
header = "This is Header";
content = "This is content";
}We can bind our values to the view as shown in example below. ${header} syntax will bind the defined header value from MyComponent. The same concept is applied for content.
app.html
${header}
${content}
Javascript Objects Interview Questions
-
Question 12. How To Create Custom Elements In Aurelia?
Answer :
Aurelia offers a way to add components dynamically. You can reuse single component on different pars of your app without need for including HTML multiple times.
Step 1 - Create custom component
Let's create new components directory inside src folder.
C:UsersusernameDesktopaureliaAppsrc>mkdir components
Inside this directory we will create custom-component.html. This component will be inserted later on our HTML page.
custom-component.html
This is some text from dynamic component...
Step 2 - Create main component
We will create simple component in app.js. It will be used to render header and footer text on screen.
app.js
export class MyComponent
{
header = "This is Header";
content = "This is content";
}Step 3 - Add custom component
Inside our app.html file, we need to require the custom-component.html to be able to insert it dynamically. Once we do that, we can add new element custom-component.
app.html
${header}
${content}
HTML Interview Questions
-
Question 13. Explain About Standard Plugins?
Answer :
Standard Plugins : If you are using default configuration, standard set of plugins will be available.
defaultBindingLanguage() − This plugin that offers an easy way to connect view-model with view. You already saw one way data-binding syntax (${someValue}). Even though you could use some other binding language, it is recommended practice to use default binding language.
defaultResources() − Default resourses gives us some primitive constructs like if, repeat, compose etc. You can even build these constructs on your own, but since they are so commonly used, Aurelia already created it inside this library.
Router() − Most of the applications use some kind of routing. That is why Router is a part of the standard plugins. You can check more about routing in one of our next chapters.
History() − History plugin is usually used together with router.
eventAggregator() − This plugin is used for cross component communication. It handles publishing and subscribing to messages or channels inside your app.
Javascript Objects Tutorial
-
Question 14. Explain About Official Plugins?
Answer :
Official Plugins : These plugins aren't part of the default configuration but are frequently used.
- fetch() − Fetch plugin is used for handling HTTP requests. You can use some other AJAX library if you want.
- animatorCSS() − This plugin offers a way of handling CSS animations.
- animator-velocity() − Instead of CSS animations you can use Velocity animation library. This plugins enables to use Velocity inside Aurelia apps.
- dialog() − Dialog plugin offers highly customizable modal window.
- i18n() − This is the plugin for internalization and localization.
- ui-virtualization() − Virtualization is useful library for handling large performance heavy UI tasks.
- validation() − Use this plugin when you need to validate your data.
-
Question 15. How Do We Install Plugins?
Answer :
Installing Plugins : If, for example, we want to use animator-css and animator-velocity, we need to install it first.
C:UsersusernameDesktopaureliaApp>jspm install aurelia-animator-css
C:UsersusernameDesktopaureliaApp>jspm install aurelia-animator-velocity
In our last chapter we showed you how to use manual configuration. We can add our plugins in main.js file.
main.js
export function configure(aurelia)
{
aurelia.use
.defaultBindingLanguage()
.defaultResources()
.developmentLogging()
.router()
.history()
.eventAggregator()
.plugin('aurelia-animatorCSS')
.plugin('aurelia-animator-velocity')
aurelia.start().then(() => aurelia.setRoot());
}
Javascript Advanced Interview Questions
-
Question 16. Explain About Binding System In Aurelai?
Answer :
Aurelia has its own data-binding system.
Simple Binding :
You already saw simple binding in some of our previous chapters. ${...} syntax is used to link veiw-model and view.
app.js
export class App
{
constructor()
{
this.myData = 'Welcome to Aurelia app!';
}
}
app.html${myData}
Two way Binding : The beauty of Aurelia is in its simplicity. The two-way data binding is automatically set when we bind to input fields.
app.js
export class App
{
constructor()
{
this.myData = 'Enter some text!';
}
}app.html
${myData}
Now we have our view-model and view linked. Whenever we enter some text inside input field, the view will be updated.
Javascript Advanced Tutorial
-
Question 17. What Are The Binding Behaviour In Aurelia?
Answer :
Binding behavior as a filter that can change binding data and display it in different format.
Throttle : This behavior is used to set how often should some binding update. We can use throttle to slow down rate of updating input view-model. Consider the example from our last chapter. The default rate is 200 ms. We can change that to 2 sec by adding & throttle:2000 to our input.
app.js
export class App
{
constructor()
{
this.myData = 'Enter some text!';
}
}app.html
${myData}
Debounce : debounce is almost the same as throttle. The difference is that debounce will update binding after user stopped typing. Example below will update binding if user stops typing for two seconds.
app.js
export class App
{constructor()
{
this.myData = 'Enter some text!';
}
}app.html
${myData}
oneTime : oneTime is the most efficient behavior performance wise. You should always use it when you know that data should be bound only once.
app.js
export class App
{
constructor()
{
this.myData = 'Enter some text!';
}
}app.html
${myData}
Java collections framework Interview Questions
-
Question 18. How To Convert Date In Aurelia?
Answer :
Convert Date : When we want to convert default date value to some specific format, we can use momentJS library. This is small library used for manipulating dates.
C:UsersusernameDesktopaureliaApp>jspm install moment
Let's create new file converters.js. We will use this file to add converter specific code. Use the following command or create the file manually.
C:UsersusernameDesktopaureliaApp>touch converters.js
converter.js : Inside this file we will import moment library and set DateFormatValueConverter to return only month, day and year values without additional data. Important thing to note is that Aurelia can recognize any class that ends with ValueConverter. This is why our class name is DateFormatValueConverter. This class will be registered as dateFormat and we can later use it inside view.
converters.js
import moment from 'moment';
export class DateFormatValueConverter{
toView(value){
return moment(value).format('M/D/YYYY');}
}In app.js we will just use current date. This will be our view-model.
app.jsexport class App
{
constructor(){
this.currentDate = new Date();
}
}You already saw require in custom-elements chapter. The pipe symbol | is used to apply the converter. We are only using dateFormat since this is how Aurelia is registering DateFormatValueConverter.
app.html
${currentDate | dateFormat}
Java Persistence API Interview Questions
-
Question 19. How To Convert Currency In Aurelia?
Answer :
Convert Currency :This is an example of currency formatting. You will notice that the concept is the same as in above example. First we need to install numeral library from command prompt.
C:UsersusernameDesktopaureliaApp>jspm install numeral
Converter will set currency format.
converters.js
import numeral from 'numeral';
export class CurrencyFormatValueConverter
{
toView(value)
{
return numeral(value).format('($0,0.00)');
}
}View-model will just generate random number. We will use this as currency value and update it every second.
app.js
export class App
{
constructor()
{
this.update();
setInterval(() => this.update(), 1000);
}
update()
{
this.myCurrency = Math.random() * 1000;
}
}Our view will show the randomly generated number transformed as a currency.
app.html
${myCurrency | currencyFormat}
Unittest Framework Tutorial
-
Question 20. Explain About Event Delegate?
Answer :
Even delegation is useful concept where event handler is attached to one top level element instead of multiple elements on the DOM. This will improve application memory efficiency and should be used whenever possible.
This is simple example of using event delegation with Aurelia framework. Our view will have a button with click.delegate event attached.
app.html
Once the button is clicked, myFunction() will be called.
app.js
export class App
{
myFunction()
{
console.log('The function is triggered...');
}
}
Unittest Framework Interview Questions
-
Question 21. Explain About Event Trigger?
Answer :
Event Trigger : There are some cases when you can't use delegation. Some JavaScript events doesn't support delegation, IOS supports it for some elements. To find out which events allows delegation you can search for a bubble property of any event here. In these cases you can use trigger() method.
The same functionality from example above can be created with click.trigger.
app.html
app.js
export class App
{
myFunction()
{
console.log('The function is triggered...');
}
}
- Home
- Jobs
Skills by Location
- Jobs By Companies
- Jobs By Locations
- Govt Jobs
State Govt Jobs
Bank Jobs
Defence Jobs
PSC
SSC Jobs
Railway Jobs
- Walkin Jobs
Latest walkins
Walkins by Skill
Walkins by location
Walkins by Company
- Assessments
- Tutorials
- Services
- Career Edge
All rights reserved © 2020 Wisdom IT Services India Pvt. Ltd
