glimmertea
glimmertea

Reputation: 209

Why does Backbone JS .extend() always return an empty function?

I'm new to backbone js and am having difficulty at a seemingly trivial aspect.

Whenever I call Backbone.Collection.extend, Backbone.Model.extend or Backbone.View.extend, what returns is an empty function rather than an object with inherited properties.

Examples:

var view = Backbone.View.extend({
});

console.log("View:");
console.log(view);

Console.log shows:

View:
function()

And nothing happens if you click on "function()", it's just an empty function with no properties.

Everywhere that I attempt to extend Backbone objects, I get the same problem. As I've explored the issue, I tried this:

var collection = Backbone.Collection.extend({
    add: function() {
        console.log("Add gets called");
        return {};
    }
});

console.log("Collection:");
console.log(collection);
console.log(collection.add());

Console shows:

Collection:
function()
TypeError: collection.add is not a function

I don't think there is anything unusual about my requirejs setup, so I'm hoping someone with more experience using underscore and backbone's extend() can tell me why they would sometimes return empty functions.

Any suggestions as to areas I might look into to solve this would be welcomed. Being new to the libraries involved, I'm kind of scratching my head about how to solve this so I can move on with my app.

Upvotes: 0

Views: 374

Answers (1)

Rida BENHAMMANE
Rida BENHAMMANE

Reputation: 4129

extend Backbone.Collection.extend(properties, [classProperties])

To create a Collection class of your own, extend Backbone.Collection, providing instance properties, as well as optional classProperties to be attached directly to the collection's constructor function.

So in your case view is a Collection class, try to instantiate it with the new keyword :

var view = Backbone.View.extend({
});

console.log("View:");
console.log(new view()); // Here

Upvotes: 1

Related Questions