Top 100+ Backbone.js Interview Questions And Answers
Question 1. Explain What Is Backbone.Js?
Answer :
Backbone.Js is a JavaScript purchaser-facet (the front give up) framework, which allows to arrange your code and makes it less complicated to develop single page programs. It permits you to shape JavaScript code in an MVC (Model, View , Controller) fashion.
Model: It is part of your code that populates and retrieves the facts.
View: It is the HTML illustration of this version.
Controller: It allows you to keep your javascript application via a hashbang URl.
Question 2. What Are The Main Components Of Backbone.Js ?
Answer :
The fundamental component of Backbone.Js are:
Model
View
Collection
Router
Event class item
HTML Interview Questions
Question three. Explain What Is Backbone.Js Collections?
Answer :
An ordered set of fashions are represented via Backbone.Js collections. Any occasion in model will cause an occasion in series directly. For example, you can bind “change” event to be notified in a case when any version inside the collection has been changed.
Question 4. Explain What Is Backbone.Js Router Is Used For?
Answer :
When ever an software want to change their URL fragment in an effort to offer bookmarkable and shareable URLs for an Ajax heavy software, backbone.Js router is used.
HTML Tutorial
Question five. What Is Backbone Events?
Answer :
Backbone occasions is a module that may be jumbled together to any item, giving the item the ability to bind and trigger custom named occasions. Events aren't declared before they may be certain to any object . Events displays the state of the version.
Java Script Interview Questions
Question 6. What Are The Keypoints Of Backbone?
Answer :
It has hard dependency with underscore.Js to make it more functional and supporting a range of useful collection based operations With jQuery it has a tender dependency
When the version changes it may replace the HTML of your utility robotically
It makes use of client-facet rendering framework or Javascript templating to render html which keep away from you to embed HTML code interior JavaScript code.
For UI updates and DOM manipulations if gives a considerably smooth and stylish manner.
Question 7. Why You Have To Use Backbone ? Advantages?
Answer :
By the usage of JavaScript with the minimal set of statistics-structuring ( models & collections) and user interface (views & URLs) it allows you to increase an internet software
Backbone is excellent useful to increase MVC like net packages, single page net applications or complicated JavaScript web applications in an prepared and established way without JavaScript code blending with HTML
Provides key value binding and custom occasions
API with tons of functions
Robust occasion managing
API connetion over a RESTful JSON interface
Java Script Tutorial PHP Interview Questions
Question 8. What Are The Three Js Files That You Require To Setup A Working Environment For Backbone?
Answer :
you are required following three js files to setup a working surroundings for backbone
jQuery
Backbone
Underscore
In your software positioned those documents inside js folder and use it for your index.Html web page
Question 9. Explain When You Require Backbone.Js?
Answer :
Backbone.Js is needed in following condition:
When growing an internet utility that requires a number of JavaScript
It is required while you want to provide shape for your code, if your application desires to be scalable.
Backbone is useful when a web application has to work with jQuery to traverse the DOM or give animations.
AJAX Interview Questions
Question 10. Explain What Is View In Backbone.Js?
Answer :
Backbone view is a Javascript item that manages a selected DOM detail and descendants.
Views are not HTML
It is an outline of a version
The HTML code comes from templates
Works with any template device
PHP Tutorial
Question 11. Explain What Is Backbone.Js Models?
Answer :
Backbone.Js models are object and middle of backbone.Js. It incorporates an array of attributes and listens for occasions. To represent your data, Backbone offers a model object. For example, you have got a to do listing, you will have a model representing each item on that list.
MySQL Interview Questions
Question 12. Explain How You Can Use Backbone.Js For Multiple Page Web App?
Answer :
For multiple web page web app in backbone.Js there are masses of attention but here are which can be beneficial.
Serving the web page : In this, in which you need to have your web server direction everything to the server course the whole lot to serve the identical static web page. That way that the entirety in http://wisdomjobs.Com/* will serve /var/www/wisdomjobs.Com/index.Html. Once the static page is loaded, the JS on that web page will decide what to do given the url
Push State : You can nonetheless use backbone routing to do your routing, however don’t use hashbangs. This will allow you to navigate to URLs without virtually desiring a page refresh.
HTML Interview Questions
Question 13. Explain What Is Modelbinder In Backbone.Js ?
Answer :
To make synchronization procedure of perspectives and fashions collectively, ModelBinder class is used.
AJAX Tutorial
Question 14. What Is The Most Powerful Capabilities Of The Modelbinder ?
Answer :
The most effective abilties of ModelBinder class is that it permits you to outline scope when you create your bindings the use of jQuery.
If your views are simple, you may depend upon default scoping policies which are based totally off of the html “call” characteristic.
You can define scoping with jQuery selectors in case your views are complicated.
Question 15. Explain What Is Converter In Backbone.Js?
Answer :
A function is called whilst version’s attribute is copied to an html detail or when an html detail cost is copied right into a version’s attribute, this feature is referred as Converter in Backbone.Js
Java Servlets Interview Questions
Question 16. What Is Model.Attributes?
Answer :
The attributes assets is the inner hash containing the model’s country, typically a shape of the JSON object representing the model statistics on the server. It is usually a truthful serialization of a row from the database.
MySQL Tutorial
Question 17. What Is The Function Of Tojson?
Answer :
It returns a shallow reproduction of the version’s attribute for JSON stringification. This characteristic is used for persistence, serialization and for augmentation earlier than being despatched to the server. This does now not return a JSON string.
JMS(Java Message Service) Interview Questions
Question 18. Explain When You Can Use Unbinding Function In Backbone.Js?
Answer :
When you want to cast off the validation binding on the version or all fashions , getting rid of all occasions mounted on the collection, you may use Unbinding characteristic.
For instance : Backbone.Validation.Unbind(view) [ This will remove the validation binding]
Java Script Interview Questions
Question 19. What Are The Configuration Options Available?
Answer :
The configuration alternatives available are:
InitialCopyDirection
modelSetOptions
exchange Triggers
boundAttribute
suppressThrows
converter
Java Servlets Tutorial
Question 20. Mention What Are The Typical Problems You Might Face With The Backbone View Code?
Answer :
Application fashions don’t change very frequently
Application pages are frequently refreshed from scratch from the server
Between different view models aren't shared
JavaServer Faces (JSF) Interview Questions
Question 21. What Is The Function Of Escape?
Answer :
It gets the present day price of an attribute from the version but returns the HTML-escaped version of a model’s characteristic. It is helpful in preventing XSS attacks, in case you are interpolating records from the model into HTML.
Question 22. Explain What Is The Function Of Parse?
Answer :
When ever a model’s statistics is lower back by means of the server, in fetch and store , this records is referred to as parse. It is known as by means of Backbone whenever a set’s fashions are lower back by server, in fetch.
JavaServer Faces (JSF) Tutorial
Question 23. What Is Backbone.Sync Is Used For?
Answer :
When Backbone desires to shop or read a model to the server it calls out a feature called as Backbone.Sync.
Node.Js Interview Questions
Question 24. In Backbone View, What Is The Use Of Setelement?
Answer :
setElement function is used whilst Backbone view needs to be implemented to a one of a kind DOM detail.
PHP Interview Questions
Question 25. Explain What Is Model.Cid?
Answer :
Model.Cid works as a completely unique identifier. It is a unique property of models, the cid or client identification is routinely assigned to all fashions when they're first created. This property is useful when the version isn't always saved to the server, however needs to be seen inside the UI. It takes the from c1,c2….
Node.Js Tutorial
Question 26. What Is Backbone.Js? How Does It Help Developers?
Answer :
BackboneJs is a JavaScript framework which lets in the developers to make their life simpler by means of presenting the beneath capabilities:
Model:– Store information
Model can have listeners bound to them to discover adjustments to their values
Collection: Group of fashions
View: Represents UI
Routing: Manages how to expose appropriate view when request thru URL
CSS Interview Questions
Question 27. What Is Models In Backbone.Js?
Answer :
Models are used to represent data from your server. Model in BackboneJs consists of:
Interactive information
Business Logic
Conversions
Validations
Computed houses
Access manipulate
MyClass = Backbone.Model.Amplify(
initialize: feature()
alert("I will initialize the version while it's miles created. I am like constructor.");
);
var myObj = new MyClass();
AJAX Interview Questions
Question 28. How Can You Set Attributes Of A Model?
Answer :
You can set attributes of a model in approaches. Using constructor parameter or .Set().
See the under example:
var myObj = new MyClass( attrib1: "Thomas", attrib2: sixty seven);
//Or we can set afterwards, those operations are equivalent
var myObj = new MyClass();
myObj.Set( attrib1: "Thomas", attrib2: 67);
CSS Tutorial
Question 29. How Can You Get The Attribute Value Of A Model?
Answer :
You can get the cost of model characteristic via the use of .Get() technique.
See the example below:
//Set attributes
var obj = new MyClass( attrib1: "Attribute1", attrib2: 50);
//Get attributes
var attrib1 = obj.Get("call"); // "Attribute1"
var attrib2 = obj.Get("age"); // 50
Koa.Js Interview Questions
Question 30. Can You Have Default Values For Model? If Yes, How?
Answer :
Yes, we are able to set default values for the model attributes.
See the instance below:
MyClass = Backbone.Model.Extend(
defaults: //units default values
attrib1: 'Default Attribute1 Value',
attrib2: zero
,
initialize: feature()
alert("It is so smooth to set default values. Isn't it?");
);
Question 31. How Can You Write The Business Logic In Model?
Answer :
We can write the methods which incorporate the commercial enterprise common sense.
See the instance underneath:
Person = Backbone.Model.Make bigger(
defaults:
name: 'Fetus',
age: 0,
child: ''
,
initialize: function()
alert("This class has adop() technique which incorporates business logic to set new baby.");
,
adopt: characteristic( newChildsName )
this.Set( child: newChildsName );
);
var person = new Person( name: "Thomas", age: 67, infant: 'Ryan');
individual.Undertake('John Resig');
var infant = character.Get("child"); // 'John Resig'
Koa.Js Tutorial
Question 32. How Can You Track Any Change In Model Attribute Value?
Answer :
All attributes of a version may have listeners bound to them to discover adjustments to their values. In our initialize feature, we're going to bind a characteristic call everytime we alternate the price of our characteristic. In this situation, if the name of our “character” modifications, we can alert their new call. Syntax for attaching callback to change event of characteristic is that this.On(“trade”, feature(model));.
See the example underneath:
Person = Backbone.Model.Make bigger(
defaults:
call: 'Fetus',
age: 0
,
initialize: function()
alert("Below we are attaching callback to trade event of 'name' attribute");
this.On("exchange:name", function(version)
var name = model.Get("name"); // 'Stewie Griffin'
alert("Changed my call to " + name );
);
);
var person = new Person( name: "Thomas", age: 67);
person.Set(call: 'Stewie Griffin'); // This triggers a trade and will alert()
CodeIgniter Interview Questions
Question 33. How The Actions Performed On Model Is Translated To Restful Operations? Give An Example.?
Answer :
Models are used to symbolize information out of your server and actions you perform on them may be translated to RESTful operations. The id attribute of a version identifies a way to discover it at the database typically mapping to the surrogate key.
Suppose you have got a table Users with columns identification, call, email and you need to keep the model again on server while consumer clicks keep button. If the identity characteristic of the model is null, Backbone.Js will send a POST request to the urlRoot of the server. For this,
see the instance underneath:
var UserModel = Backbone.Model.Enlarge(
urlRoot: '/consumer', //RESTful API relative path
defaults:
name: '',
email: ''
);
var person = new UserModel();
// Notice that we haven't set an `identification`. In case of replace operation, we want to bypass 'identity' as properly.
Var userDetails =
name: 'Thomas',
e-mail: 'youemailid@domain.Com'
;
// Because we've not set a `id` the server will name
// POST /person with a payload of call:'Thomas', e mail: 'youremailid@domain.Com'
// The server ought to keep the facts and return a reaction containing the new `id`
consumer.Keep(userDetails,
success: characteristic (person)
alert(user.ToJSON());
)
MySQL Interview Questions
Question 34. How Backbone Decides If It Should Use Post/get/ Request To The Server? What Are The Methods Backbone Has Reserved For These Operations?
Answer :
If we instantiate a model with an identity, Backbone.Js will robotically carry out a GET request to the urlRoot + ‘/identity’ the usage of fetch() technique. (conforming to RESTful conventions)
If the identification attribute of the version is null, Backbone.Js will send a POST request to the urlRoot of the server using store() approach.
If the id attribute of the model isn't always null, Backbone.Js will send a PUT request rather than a POST request the use of keep() technique.
If a version has an identification we know that it exists on the server, so if we desire to get rid of it from the server we can call ruin() technique. Ruin will hearth off a DELETE /user/identification (conforming to RESTful conventions).
See the instance under for a lot of these above operations:
// Here we've got set only the `identity` of the model so it'll name fetch() technique.
Var consumer = new Usermodel(identification: 1);
// The fetch below will perform GET /user/1
// The server ought to go back the identity, name and electronic mail from the database
user.Fetch(
success: feature (consumer)
alert(consumer.ToJSON());
)
// Here we've got set all the attributes, in conjunction with identification,
// of the version so it'll call shop() technique with PUT
var person = new Usermodel(
identification: 1,
call: 'Thomas',
e-mail: 'myemailid@domain.Com'
);
// Let's trade the call and update the server
// Because there's `identification` present, Backbone.Js will hearth
// PUT /user/1 with a payload of `call: 'Davis', electronic mail: 'myemailid@domain.Com'`
consumer.Save(call: 'Davis',
fulfillment: feature (model)
alert(person.ToJSON());
);
// Here we've got set all the residences of model.
Var consumer = new Usermodel(
id: 1,
name: 'Thomas',
electronic mail: 'thomasalwyndavis@gmail.Com'
);
// Because there is `identity` gift, Backbone.Js will fire
// DELETE /person/1
person.Destroy(
achievement: function ()
alert('Destroyed');
);
Question 35. What Are The Tips/hints/practice, With Respect To Model, You Follow?
Answer :
Below are a few practices you should comply with at the same time as running with Backbone fashions:
Get all of the Current Attributes
obj.Attributes offers an instantaneous connection with the attributes and also you have to be cautious whilst playing with it. Best exercise would advocate which you use .Set() to edit attributes of a version to take advantage of spine listeners.
Var character = new Person( call: "Thomas", age: 67);
var attributes = character.ToJSON(); // name: "Thomas", age: 67
/* This certainly returns a replica of the modern attributes. */
var attributes = person.Attributes;
Validate Data Before You Set or Save It
Always put in force validate() technique in order that Backbone validates the input earlier than setting any attribute fee. It guarantees that invalid records isn't stored to your server.
Person = Backbone.Model.Expand(
// If you come a string from the validate function,Backbone will throw an mistakes
validate: function( attributes )
if( attributes.Age < zero && attributes.Call != "Dr Manhatten" )
go back "You cannot be poor years old";
,
initialize: feature()
//Bind callback for mistakes event
this.Bind("errors", characteristic(version, blunders)
// We have acquired an error, log it, alert it or forget about it <img alt=":)" class="wp-smiley" src="http://synvistech.Com/blogs/wp-includes/images/smilies/simple-smile.Png" style="height: 1em; max-height: 1em;" />
alert( errors );
);
);
var person = new Person;
character.Set( call: "Mary Poppins", age: -1 );
// Will cause an alert outputting the error
var individual = new Person;
man or woman.Set( name: "Dr Manhatten", age: -1 );
Question 36. What Is View In Backbone.Js?
Answer :
Reflect what your programs’ facts models appear like.
Used to concentrate to activities and react accordingly.
Java Servlets Interview Questions
Question 37. How Do You Define View In Backbone.Js?
Answer :
You can outline perspectives in Backbone.Js just like Backbone models. See example underneath:
SearchView = Backbone.View.Enlarge(
initialize: feature()
alert("WOW! SearchView has been defined.");
);
// The initialize feature is continually known as when instantiating a Backbone View.
// Consider it the constructor of the class.
Var search_view = new SearchView();
//You can specify el belongings for the view in any other case it will create empty div and assign it
<div id="search_container"></div>
var search_view = new SearchView( el: $("#search_container") );
Question 38. What Is “el” Property Of Backbone.Js View?
Answer :
The “el” assets references the DOM item created inside the browser. Every Backbone.Js view has an “el” belongings, and if it is not defined, Backbone.Js will assemble its personal, that is an empty div detail.
Question 39. How Can You Use Underscore Templates In Backbone.Js Views?
Answer :
First, create an underscore template
Create div for el belongings of the view
Compile the template the use of underscore
Load the compiled HTML into Backbone “el”
See the under example:
<script type="text/template" id="search_template">
<label>Search</label>
<input type="text" id="search_input" />
<input type="button" id="search_button" value="Search" />
</script>
<div id="search_container"></div>
<script type="text/javascript">
SearchView = Backbone.View.Extend(
initialize: function()
this.Render();
,
render: function()
// Compile the template the use of underscore
var template = _.Template( $("#search_template").Html(), );
// Load the compiled HTML into the Backbone "el"
this.$el.Html( template );
);
var search_view = new SearchView( el: $("#search_container") );
</script>
Question forty. How Can You Attach Listeners To Events In A View?
Answer :
Use the “occasions” characteristic of Backbone.View. Remember that event listeners can handiest be attached to baby elements of the “el” belongings.
See instance below:
SearchView = Backbone.View.Enlarge(
initialize: function()
this.Render();
,
render: function()
var template = _.Template( $("#search_template").Html(), );
this.$el.Html( template );
,
//Attach listener to click occasion of the search button
occasions:
"click input[type=button]": "doSearch"
,
doSearch: function( event )
// Button clicked, you may access the element that changed into clicked with event.CurrentTarget
alert( "Search for " + $("#search_input").Val() );
);
JMS(Java Message Service) Interview Questions
Question forty one. How Can You Use Template Variables?
Answer :
You can get admission to template variables with <%= %>.
<script type="text/template" id="search_template">
<label><%= search_label %></label>
<input type="text" id="search_input" />
<input type="button" id="search_button" value="Search" />
</script>
<div id="search_container"></div>
<script type="text/javascript">
SearchView = Backbone.View.Increase(
initialize: characteristic()
this.Render();
,
render: function()
//Pass variables in the usage of Underscore.Js Template
var variables = search_label: "My Search" ;
// Compile the template the usage of underscore
var template = _.Template( $("#search_template").Html(), variables );
// Load the compiled HTML into the Backbone "el"
this.$el.Html( template );
,
activities:
"click on input[type=button]": "doSearch"
,
doSearch: feature( occasion )
// Button clicked, you could get admission to the detail that became clicked with event.CurrentTarget
alert( "Search for " + $("#search_input").Val() );
);
var search_view = new SearchView( el: $("#search_container") );
</script>
Question forty two. What Is Router In Backbone.Js?
Answer :
Backbone routers are used for routing your programs URLs when the use of hash tags(#). In the traditional MVC sense, they don’t necessarily fit the semantics and when you have read “What is a view?” it's going to complicated in this point. Though a Backbone “router” remains very useful for any software/characteristic that desires URL routing/history abilties.
Defined routers have to always comprise as a minimum one course and a function to map the unique direction to.
Routes interpret anything after “#” tag within the URL. All links to your software should goal “#/movement” or “#movement”. (Appending a ahead cut back after the hashtag looks a bit nicer, e.G. Http://wisdomjobs.Com/#/person/assist).
<script>
var AppRouter = Backbone.Router.Expand(
routes:
"*movements": "defaultRoute" // suits http://wisdomjobs.Com/#anything-right here
);
// Initiate the router
var app_router = new AppRouter;
app_router.On('course:defaultRoute', feature(moves)
alert(movements);
)
// Start Backbone records a necessary step for bookmarkable URL's
Backbone.History.Start();
</script>
JavaServer Faces (JSF) Interview Questions
Question 43. What Is Dynamic Routing?
Answer :
In case of Dynamic Routing, you may use variables within the route. For example, you would possibly want to retrieve a publish with a variable id with a friendly URL string. You can specify variable call within the course as :variablename in dynamic routing.
<script>
var AppRouter = Backbone.Router.Increase(
routes:
"posts/:identity": "getPost",
"*moves": "defaultRoute" // Backbone will try to in shape the path above first
);
// Instantiate the router
var app_router = new AppRouter;
app_router.On('course:getPost', function (id)
// Note the variable within the course definition being exceeded in right here
alert( "Get publish range " + identification );
);
app_router.On('path:defaultRoute', function (movements)
alert( movements );
);
// Start Backbone history a necessary step for bookmarkable URL's
Backbone.History.Begin();
</script>
Question 44. What Are “:params” And “*splats” In Dynamic Routing?
Answer :
Backbone uses two types of variables whilst implementing routes:
“:params” fit any URL additives between slashes. You can specify unmarried fragment using “.Params”
“*splats” in shape any number of URL fragments after the query.
Note that due to the nature of a “*splat”, it's going to continually be the closing variable in your URL because it will fit any and all additives.
“*splats” or “:params” in path definitions are passed as arguments (in respective order) to the associated feature.
A course described as “/:course/:movement” will bypass 2 variables (“direction” and “action”) to the callback feature.
Question forty five. What Is Collection In Backbone.Js?
Answer :
Backbone collections are simply an ordered set of fashions.
Typically, your series will most effective use one kind of model however models themselves aren't restrained to a type of series.
Var Song = Backbone.Model.Expand(
initialize: function()
console.Log("Music is the solution");
);
var Album = Backbone.Collection.Increase(
model: Song
);
Question 46. Can You Give An Example Of How To Build A Collection?
Answer :
var Song = Backbone.Model.Amplify(
defaults:
call: "Not unique",
artist: "Not distinct"
,
initialize: characteristic()
console.Log("Music is the solution");
);
var Album = Backbone.Collection.Make bigger(
version: Song
);
var song1 = new Song( call: "How Bizarre", artist: "OMC" );
var song2 = new Song( name: "Sexual Healing", artist: "Marvin Gaye" );
var song3 = new Song( call: "Talk It Over In Bed", artist: "OMC" );
var myAlbum = new Album([ song1, song2, song3]);
console.Log( myAlbum.Fashions ); // [song1, song2, song3]
