JavaScript error: "is not a function"

Question

It looks like "$smth is not a function" is a very common problem with JavaScript, yet after looking through quite a few threads I still cannot understand what is causing it in my case.

I have a custom object, defined as:

function Scorm_API_12() {
var Initialized = false;

function LMSInitialize(param) {
    errorCode = "0";
    if (param == "") {
        if (!Initialized) {
            Initialized = true;
            errorCode = "0";
            return "true";
        } else {
            errorCode = "101";
        }
    } else {
        errorCode = "201";
    }
    return "false";
}

// some more functions, omitted.
}

var API = new Scorm_API_12();

Then in a different script I am trying to use this API in the following way:

var API = null;

function ScormProcessInitialize(){
    var result;

    API = getAPI();

    if (API == null){
        alert("ERROR - Could not establish a connection with the API.");
        return;
    }

    // and here the dreaded error pops up
    result = API.LMSInitialize("");

    // more code, omitted
    initialized = true;
}

The getAPI() stuff, looks like this:

var findAPITries = 0;

function findAPI(win)
{
   // Check to see if the window (win) contains the API
   // if the window (win) does not contain the API and
   // the window (win) has a parent window and the parent window
   // is not the same as the window (win)
   while ( (win.API == null) &&
           (win.parent != null) &&
           (win.parent != win) )
   {
      // increment the number of findAPITries
      findAPITries++;

      // Note: 7 is an arbitrary number, but should be more than sufficient
      if (findAPITries > 7)
      {
         alert("Error finding API -- too deeply nested.");
         return null;
      }

      // set the variable that represents the window being
      // being searched to be the parent of the current window
      // then search for the API again
      win = win.parent;
   }
   return win.API;
}

function getAPI()
{
   // start by looking for the API in the current window
   var theAPI = findAPI(window);

   // if the API is null (could not be found in the current window)
   // and the current window has an opener window
   if ( (theAPI == null) &&
        (window.opener != null) &&
        (typeof(window.opener) != "undefined") )
   {
      // try to find the API in the current window�s opener
      theAPI = findAPI(window.opener);
   }
   // if the API has not been found
   if (theAPI == null)
   {
      // Alert the user that the API Adapter could not be found
      alert("Unable to find an API adapter");
   }
   return theAPI;
}

Now, the API is probably found, because I do not get the "Unable to find..." message, the code proceeds to try to initialize it. But firebug tells me API.LMSInitialize is not a function, and if I try to debug it with alert(Object.getOwnPropertyNames(API));, it gives me a blank alert.

What am I missing?

What do you get when you just do a `console.log(API)` right after the `API = getAPI();`? — m90, Mar 22 '12 at 15:13
please can you let me know what you want to do after initilization.. — Kanak Vaghela, Jan 29 '14 at 10:01
I got that error because I had a circular dependency. Maybe this will help someone else. — SadSeven, Mar 04 '19 at 19:53
I got that error because I had a circular dependency. Created a `abc_2.js` file to fix it. — Manohar Reddy Poreddy, Jan 11 '23 at 15:45

Liam · Answer 1 · 2017-10-10T08:05:39.357

For more generic advice on debugging this kind of problem MDN have a good article TypeError: "x" is not a function:

It was attempted to call a value like a function, but the value is not actually a function. Some code expects you to provide a function, but that didn't happen.

Maybe there is a typo in the function name? Maybe the object you are calling the method on does not have this function? For example, JavaScript objects have no map function, but JavaScript Array object do.

Basically the object (all functions in js are also objects) does not exist where you think it does. This could be for numerous reasons including(not an extensive list):

Missing script library
Typo
The function is within a scope that you currently do not have access to, e.g.:

var x = function(){
   var y = function() {
      alert('fired y');
   }
};
    
//the global scope can't access y because it is closed over in x and not exposed
//y is not a function err triggered
x.y();

Your object/function does not have the function your calling:

var x = function(){
   var y = function() {
      alert('fired y');
   }
};
    
//z is not a function error (as above) triggered
x.z();

I'd like to add: naming a local variable the same thing as a function, so when you call `showOrderForm()` the type of `showOrderForm` is a boolean. — Noumenon, Aug 01 '17 at 13:45
seriously you gave a bit of lifesaver advice about the function as something is waiting for the function but it's getting the object or array that great advice! — Raj Gohil, Mar 30 '22 at 11:41

score 29 · Accepted Answer · answered Mar 22 '12 at 15:22

Your LMSInitialize function is declared inside Scorm_API_12 function. So it can be seen only in Scorm_API_12 function's scope.

If you want to use this function like API.LMSInitialize(""), declare Scorm_API_12 function like this:

function Scorm_API_12() {
var Initialized = false;

this.LMSInitialize = function(param) {
    errorCode = "0";
    if (param == "") {
        if (!Initialized) {
            Initialized = true;
            errorCode = "0";
            return "true";
        } else {
            errorCode = "101";
        }
    } else {
        errorCode = "201";
    }
    return "false";
}

// some more functions, omitted.
}

var API = new Scorm_API_12();

can I call this.LMSInitialize(parm) in other this.AfterLMSInitialize = function(){} ?? — dellos, May 05 '22 at 04:23

score 8 · Answer 3 · answered May 11 '19 at 10:20

I also hit this error. In my case the root cause was async related (during a codebase refactor): An asynchronous function that builds the object to which the "not a function" function belongs was not awaited, and the subsequent attempt to invoke the function throws the error, example below:

const car = carFactory.getCar();
car.drive() //throws TypeError: drive is not a function

The fix was:

const car = await carFactory.getCar();
car.drive()

Posting this incase it helps anyone else facing this error.

score 1 · Answer 4 · answered Mar 29 '21 at 03:40

In addition to the popular answers above, if you are using a services or helper functions file and doing an export on the functions that you will later import in your project.

Make sure that the function name you are importing matches the exact name of the function being exported from the services, helper, or utils file - and that the function actually exists in the right file! I got stuck on this error and was debugging for a few hours, getting nowhere until I found this out.

CodeToLife · Answer 5 · 2022-11-28T16:58:55.817

In my case after a ton of stackoverflowing I saw what a function thing would go with here... it was merely a silly typo , I forgot to put $ in start of the next line's instruction:

 function o_chir(id,nom) {
        _id_ochirish = id
        _nom= nom  
//here it threw that "Uncaught TypeError: nom is not a function"       
        ('#nom').val(s_)
        $('#o_chir').modal('show')
    }

and PHPStorm didnt give any warning

score 0 · Answer 6 · answered Aug 08 '22 at 15:29

0

Had the same issue on Next.js. On _app.tsx I forgot to wrap the Component with the AuthProvider where I had all the Authentication functions.

answered Aug 08 '22 at 15:29

klevisx

175
1
2
12

dustydojo · Answer 7 · 2022-08-03T12:44:22.477

-1

I received this error when I copied a class object incorrectly using JSON.parse and JSON.stringify() which removed the function like:

class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
  // Method
  calcArea() {
    return this.height * this.width;
  }
}

const square = new Rectangle(10, 10);

console.log('area of square: ', square.calcArea());

const squareCopy = JSON.parse(JSON.stringify(square));

// Will throw an exception since calcArea() is no longer function 
console.log('area of square copy: ', squareCopy.calcArea());

edited Aug 03 '22 at 12:44

answered Jan 14 '21 at 16:01

dustydojo

449
5
14

This isn't the [correct way to clone a class](https://stackoverflow.com/questions/41474986/how-to-clone-a-javascript-es6-class-instance) – Liam Aug 03 '22 at 08:45
@Liam I was trying to communicate that I had cloned a class the wrong way. I was not trying to say that this is the way you should clone a class. I'll update my answer to make that more clear. – dustydojo Aug 03 '22 at 12:43

JavaScript error: "is not a function"

7 Answers7

Linked