JS - called method is not a function

Question

I have object:

var devark = {
    init: function() {
        var obj = this;
        obj.assignHandlers();
    },
    assignHandlers: function() {
        var obj = this;
        document.getElementById("menu-toggler").onclick = obj.documentFunctions[0];
    },
    documentFunctions: [
        function() {
            toggleClass(this, "opened");
        }
    ]
};

on window.load, I am calling the init method. That works fine but when it calls another object method assignHandlers, it throws an error:

[17:54:33.192] TypeError: obj.assignHandlers is not a function

Why is it?

Call it like window.onload = function() { devark.init(); };. Learn how the this keyword works. — Bergi
– Bergi, Commented Sep 12, 2013 at 13:03
@Bergi You rock !!!!! but what was the error for? What is the diff? — Talha Akbar
– Talha Akbar, Commented Sep 12, 2013 at 13:06
@tymeJV bcoz JSFiddle has called the object's method exactly as Bergi said. View the source. — Talha Akbar
– Talha Akbar, Commented Sep 12, 2013 at 13:07

plalx · Accepted Answer · 2013-09-12 13:12:26Z

2

Like @Bergi said, it's a this value issue that can be solved by doing:

window.onload = function () {
    devark.init();
};

The difference between both ways is the value of this within the init function. To determine the natural value of this, look at the left-side of the . in a method call, such as obj.someFn();. Here the value of this within someFn will be obj. However, when you do window.onload = devark.init;, you can imagine the handler will later be invoke like window.onload(). Which means the value of this within the onload function, which is really the init function will be window, not devark.

You can also use Function.prototype.bind to bind a specific this value to a function.

window.onload = devark.init.bind(devark);

answered Sep 12, 2013 at 13:12

plalx

43.8k7 gold badges77 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

plalx Over a year ago

@MuhammadTalhaAkbar, I added an alternative way of achieving the same thing.

Talha Akbar Over a year ago

Yeah I have seen it ;)

Collectives™ on Stack Overflow

JS - called method is not a function

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related