Re-initialize a javascript function object by variable

Question

This one is something that is fairly easy to do in PHP and I find my self in a situation where it would come in handy, but I do not believe the PHP trick will work.

Basically I want to use a variable passed from a function within an object to then reinitialize that object using the child (defined by the variable).

var View = function(){
    var fn = this;

    fn.load = function(name){
        return new name();
    }
}
var view = View.load('titleView');

This is a very early work on it, so forgive the fact that it looks so strange (still need to tinker more with the concept). But overall it should roughly show the concept.

Is there a way to basically recreate the current functions instance with a new function? To do this in the aspect I am thinking of I will need to use a variable rather then pass the new object. Is this possible? I am sure in some form it has to be. Any ideas/pointers? Google has been failing me since I am not sure of the right keywords for this.

EDIT: should also show the idea behind the "titleView" class

var titleView = function(){}

titleView.prototype = new View;

Just a note: Feel free to completely rip apart the code I have so far if it feels more natural to change the thought process behind it. Still a very early concept (or old and I am just blind). — Jordan Ramstad
– Jordan Ramstad, Commented Jul 5, 2014 at 5:28
So in the end view should be a new instance of titleView? — Ja͢ck
– Ja͢ck, Commented Jul 5, 2014 at 5:34
basically for titleView it will use prototype to inherit the other functions within view as well so titleView.prototype = new View;. PHP uses $ specifically for variables but javascript does not, making me thing this approach is "wrong" or "misguided". — Jordan Ramstad
– Jordan Ramstad, Commented Jul 5, 2014 at 5:37
if you want to do inheritance here is a blog post by one of the S.O. members. Maybe that will help you in determining what you will need to do. — Patrick Evans
– Patrick Evans, Commented Jul 5, 2014 at 5:42
More like dynamic inheritance I guess, with a variable I can easily adjust it on the fly, then reinitialize the "view". The reason I use a function rather then a normal object is to be able to use prototype to create new objects that have the same "base" functions but with a few extra/modified ones. But thank you for the link, I will read it over ^^. — Jordan Ramstad
– Jordan Ramstad, Commented Jul 5, 2014 at 5:45

David Atchley · Accepted Answer · 2014-07-05 05:44:47Z

I think the easiest way to do this is via some kind of factory that can produce the types of views you are wanting. Something like this:

var View = (function() {
    var registry = {};

    return {
        register: function(type, fn) {
            if (typeof registry[type] === 'undefined') {
                registry[type] = fn;
                return true;
            }
            return false;
        },

        load: function(type) {
            return new registry[type]();
        }
    };
})();

var titleView = function() {
    this.name = 'titleView';
};
var subTitleView = function() {
    this.name = 'subTitleView';
}

View.register('titleView', titleView);
View.register('subTitleView', subTitleView);

var view = View.load('titleView');
console.log("Created view type: " + view.name);

view = View.load('subTitleView');
console.log("Created view type: " + view.name);

This would give the following (allowing you to recreate view variable on the fly):

// Created view type: titleView
// Created view type: subTitleView

If you try to do it the way your example is going, you'll have to use subclasses like so:

function Base() {
    this.name = "Base";
    this.load = function(fn) {
        fn.apply(this);
    }
}
function Other() {
    Base.apply(this, arguments);
    this.name = "Other";
}

var view = new Base();
console.log(view);

view.load(Other);
console.log(view);

// => Base { name: "Base", load: function }
// => Base { name: "Other", load: function }

However, with this method, after calling view.load(Other), your view will still retain whatever properties/methods it had prior to calling load (which may not be what you want).

Perfect! nice explanation too. This allows the load function to be dynamic without any problems.

fuzzybear · Accepted Answer · 2014-07-05 05:46:09Z

0

think this is what ur asking

var View = function(){
  this.load = function(name){
  return  name;
  }
}
var myView = new View;
var v = myView.load('titleView');
alert(v);

edited Jul 5, 2014 at 5:46

answered Jul 5, 2014 at 5:30

fuzzybear

2,4253 gold badges27 silver badges48 bronze badges

5 Comments

Patrick Evans Over a year ago

you will still get a "string is not a function" error

Patrick Evans Over a year ago

your fiddle/and edited code are just returning back the string

fuzzybear Over a year ago

pass in obj get out obj, your example passed in str

Patrick Evans Over a year ago

My example? this isnt my question... i am just letting you know the mistakes in your code, if you show passing in a string whoever sees this answer will think they should be able to pass a string. Also note even if you pass an object your current code will still just be returning it back, i think you want return new name; Not that it matters as OP wants inheritance and this does not do any type of inheritance

fuzzybear Over a year ago

that's kinda beyond my scope friend, but i dig the question, will watch this one ....

Collectives™ on Stack Overflow

Re-initialize a javascript function object by variable

2 Answers 2

1 Comment

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related