Backbone js Interview Questions

Backbone js Interview Questions

Top Backbone js interview questions and Answers for freshers and experienced.

Below are the list of top 18 Backbone js interview questions. Here You can read interview questions on Backbone js.

Download Backbone js Interview Questions PDF

Backbone js Interview Questions

The “id” property on a model is automatically assigned based on the “id” set in the model’s attributes hash.

Ideally, this is the ID that you receive from the rest API for the resource that you are querying. On the other hand, “cid” is an ID temporarily assigned to each model and is useful until an actual ID is determined for the object. For example, a model pushed to a collection that has not yet been persisted can be addressed using “cid”, until it is saved in the database and an actual ID is generated for it.

When a model’s attribute is copied to an HTML element or when an HTML element’s value is copied into a model’s attribute, a function is called, this function is known as a converter in Backbone Js.

Also, Read  Best 25 React js Interview questions

The main native components of BackboneJs are:-

  • Model
  • View
  • Collection
  • Router
  • Event class object

Below image shows the Architecture of Backbone.js

Architecture of Backbone

Backbone Router is used for routing client-side applications and connects them to actions and events using URLs. Backbone.Router is used to create a Router with Backbone.

In Backbone.js models attributes stored in a hash.

  • InitialCopyDirection
  • modelSetOptions
  • change Triggers
  • boundAttribute
  • suppressThrows
  • converter

The Backbone.js router is used to change the URL fragment or hashes of an application to create bookmarkable and shareable URLs.

A collection is a set of models which binds events when the model has been modified in the collection. The collection contains a list of models that can be processed in the loop and supports sorting and filtering. When creating a collection, we can define what type of model that collection is going to have along with the instance of properties. Any event triggered on a model, which will also trigger on the collection in the model.

In Backbone.js, the collection is used to represent ordered set of models. Any event in model triggers an event in collection directly. For example, you can bind “change” event to be notified in a case when any model in the collection has been modified.

Backbone.sync is a function that is Backbone js call every time it attempts to read or save a model to the server.By default, it uses jQuery.ajax to make a RESTful JSON request and returns a jqXHR

Example Code

Backbone.sync = function(method, model) {
  alert(method + ": " + JSON.stringify(model));
  model.set('id', 1);
};

var author= new Backbone.Model({
  author: "Sharad",
  website: "https://www.onlineinterviewquestions.com"
});

author.save();

author.save({author: "Teddy"});

In order to access a models data from a view in backbone.js you have to initialize your Model :

var author= Backbone.Model.extend({
      initialize: function(){
        console.log('intailized');
      },
      defaults:{
          names:['Bob','Sim','Dart']
      }
    })
var person_view = Backbone.View.extend({
    initialize: function() {
        this.model = new author();
    },
    output: function(){
        console.log(this.model.get('names'))
    }
});

ModelBinder is a class in Backbone.js to bind backbone model attributes to:

  • Read-only html elements such as <span>, <div> etc.
  • Html element attributes such as enabled, displayed, style etc.
  • Editable form elements such as <input>, <textarea> etc. This type of binding is bidirectional between the HTML elements and the Model’s attributes.

Backbone’s Js only hard dependency is Underscore.js ( >= 1.8.3). For RESTful persistence and DOM manipulation with Backbone. View, include jQuery ( >= 1.11.0), and json2.js for older Internet Explorer support. (Mimics of the Underscore and jQuery APIs, such as Lodash and Zepto, will also tend to work, with varying degrees of compatibility.)

ModelBinder class is used to make synchronization process of views and models together.