CODEWITHSUNDEEP
javascriptbackbone.js
Araknid
Araknid

Reputation: 476

How to use call function of javascript with object as one of the arguments?

I am trying to use Javascript's classic .call method. I have a function definition which accepts object as parameter.

When I try to invoke this function using .call(), I need to provide the context 'this' and the object param. I am not able to do so. Can someone help ?

Here is the code: 

//options is the object param
 var setupSomething = function(options) {
    //function definition goes here
}

This function is a member function of class MyView.

I have another class GuestView from which I need to invoke this function by providing GuestView's context(this).

Here is the code:

MyView.prototype.setupSomething.call(this, options);

The problem is when the parser hits the definition of setupSomething, the context this which should belong to GuestView is not the one. Instead, it is the context of MyView. Any suggestions what I am doing wrong.

More code: 

//This is instantiation of GuestView
var guestView = new GuestView({model: model});
guestView.render();

 //This is declaration of GuestView where guestView.render() hits after            invocation  
var GuestView = Backbone.View.extend( {
    initialize: function() {
        //setting of default variables, methods etc goes here
    },

    render: function() {
        var options = {key1: value1, key2: value2}
        this.someMemberFunc1();
        this.someMemberFunc2();
        MyView.prototype.setupSomething(this, options);//MyView is declared and defined in some other file, that's why it's prototype is used here. 
    }
})    
`

Upvotes: 2

Views: 139

Answers (1)

Sidd
Sidd

Reputation: 1397

Passing objects and anything else (functions, arrays, what have you) is not the problem. My guess is that you are calling setupSomething from a context which doesn't have access to the this variable. The following methods would both work:

Using call:

function myView(){} 
myView.prototype.setupSomething = function(options){
  console.log(options.greeting + ' ' + this.name);
};
function guestView(name){
  this.name = name;
}
guestView.prototype.setupSomething = function(options){
  myView.prototype.setupSomething.call(this, options);
}
var guest = new guestView('Yogita');
guest.setupSomething({greeting:"hello"}); // "hello Yogita"

Using bind:

function myView(){}
myView.prototype.setupSomething = function(options){
  console.log(options.greeting + ' ' + this.name);
};
function guestView(name){
  this.name = name;
  this.setupSomething =  myView.prototype.setupSomething.bind(this); 
}
var guest = new guestView('Yogita');
guest.setupSomething({greeting : "namaste"}); // "namaste Yogita"

The second option allows you to create the same function on the guestView constructor and be able to call it directly with a guestView-created this. Note that it needs to be defined inside the constructor function in order to have access to the this value it is bound to.

edit

I just saw your added code. I am not familiar with Backbone or how you are calling the render function (the problem would actually reside there), so possibly the above is not much use, but I'll leave it here.

Upvotes: 1

Related Questions