Javascript nested function "not a function"

Question

So, I have a javascript file I'm including in my page. Here's the gist of it:

var PageTransitions = (function() {

    function setCurrent(currentSet) {
        alert(currentSet);
    }

    function nextPage(options, direction, gotopage) {
        //some working code, not important
    }

})();

On the page, I'm using:

PageTransitions.nextPage(x, x, x);

That works fine. However, trying to use

PageTransitions.setCurrent(x);

gives me PageTransitions.setCurrent is not a function

Not sure why this is happening, pretty sure the syntax is correct. Unfortunately it's something for work, not allowed to share the actual page where it's occurring. Had our senior dev take a look, but they said it looked like it should be working. Any thoughts on why this would be happening?

I'm calling setCurrent after the javascript file gets called, also tried moving it after nextPage to be sure. nextPage still worked, setCurrent still not a function.

Also tried renaming setCurrent, and the variable it's being passed. Still no good.

There's something else that sets the variable's value. Neither function is accessible from outside the IIFE in the code you've shown. — JJJ
– JJJ, Commented Nov 16, 2016 at 18:52
You seem to be confusing a simple IIFE with the module pattern for which you'll need an object — Bergi
– Bergi, Commented Nov 16, 2016 at 18:56

adeneo · Accepted Answer · 2016-11-16 18:54:58Z

4

If you're going to chain, you'll need properties, not just functions defined inside another function, the simplest is an object literal

var PageTransitions = {
    setCurrent : function(currentSet) {
        alert(currentSet);
        return this;
    },
    nextPage : function(options, direction, gotopage) {
        //some working code, not important
        return this;
    }
}

PageTransitions.nextPage(x, x, x);

or if the IIFE has a purpose, returning an object literal

var PageTransitions = (function() {
    function setCurrent(currentSet) { ... }
    function nextPage(options, direction, gotopage) { ... }

    return {setCurrent, nextPage};
})();

edited Nov 16, 2016 at 18:54

answered Nov 16, 2016 at 18:52

adeneo

319k29 gold badges410 silver badges392 bronze badges

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

Comments

danguilherme · Accepted Answer · 2016-11-16 18:56:44Z

3

If PageTransitions.nextPage(x, x, x); is working, it's not due to the code you've sent.

You need to return the functions so PageTransitions has access to it:

var PageTransitions = (function() {

    function setCurrent(currentSet) {
        alert(currentSet);
    }

    function nextPage(options, direction, gotopage) {
        //some working code, not important
    }

    return {
        setCurrent: setCurrent,
        nextPage: nextPage
    };
})();

Now PageTransitions.setCurrent is defined.

answered Nov 16, 2016 at 18:56

danguilherme

6728 silver badges23 bronze badges

Comments

Scott Marcus · Accepted Answer · 2016-11-16 18:53:57Z

0

(function() {

    function setCurrent(currentSet) {
        alert(currentSet);
    }

    function nextPage(options, direction, gotopage) {
        //some working code, not important
    }

    var o = {};  // Dummy object

    // set properties to local functions
    o.setCurrent = setCurrent; 
    o.nextPage = nextPage;

    // Attach dummy to global namespace to make it available
    window.PageTransitions= o;

})();

// Now, you can access your functions via your namespace:
PageTransitions.setCurrent("test");
PageTransitions.nextPage();

answered Nov 16, 2016 at 18:53

Scott Marcus

66k6 gold badges54 silver badges81 bronze badges

5 Comments

Bergi Over a year ago

Why use the window.PageTransitions antipattern when var PageTransitions works just fine?

Scott Marcus Over a year ago

@Bergi I didn't say that var PageTransitions doesn't work. I think that my answer is more clear. Also, that var approach is susceptible to hoisting, where my solution isn't.

Scott Marcus Over a year ago

@Bergi Also, curious why you call my approach an anti-pattern when the var approach results in the same outcome. Both approaches can be adapted to avoid Global, however.

Bergi Over a year ago

The problem with window. is that it only works in browsers, no other environments. And assigning from inside the IIFE is harder to understand than the revealing module pattern. Btw, what's the problem with hoisting?

Scott Marcus Over a year ago

@Bergi I think that my example is simple enough to understand and is a variant of the revealing module pattern. The problem with hoisting here is that only the variable will be hoisted, not the assignment. If you were to attempt to use PageTransitions prior to the assignment, you would get an error.

Collectives™ on Stack Overflow

Javascript nested function "not a function"

3 Answers 3

Comments

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related