PromptHub
Back to Errors
JavaScript Beginner 151 views

TypeError: X is not a function

The code tries to call a value as a function, but it's not a function.

Explanation

TypeError: X is not a function occurs when you try to call a value that isn't a function. This commonly happens when a variable that should hold a function is actually undefined, null, or a different type. For example, calling a variable that hasn't been assigned, importing a function incorrectly from an ES module, or trying to call a method that doesn't exist on an object. This is different from ReferenceError because the variable exists but its value isn't callable.

Common Causes

  • Variable is undefined or null
  • Wrong import/export syntax
  • Function not defined before use
  • Method doesn't exist on object
  • Incorrect ES module import

Solution

Verify the variable actually contains a function using typeof. Check import/export statements for correct syntax. Ensure the function is defined before it's called. For default exports, verify you're importing correctly. Check that the method exists on the object before calling it. Use optional chaining for method calls: obj.method?.(). For ES modules, ensure the named export matches what you're importing.

Code Example 

// Variable is not a function
let myFunc;
myFunc();  // TypeError: myFunc is not a function

// Fix: ensure it's defined
let myFunc = () => console.log('hello');
myFunc();

// Wrong import from ES module
import utils from './utils.js';  // imports default export
utils.helper();  // TypeError if helper is not a method on default

// Fix: use named import
import { helper } from './utils.js';
helper();

// Method doesn't exist on object
const obj = { name: 'John' };
obj.greet();  // TypeError: obj.greet is not a function

// Fix: define the method
const obj = {
    name: 'John',
    greet() { return `Hello, ${this.name}`; }
};

// Safe method call
obj.greet?.();  // undefined if greet doesn't exist

Error Information

Language

javascript

Difficulty

Beginner

Views

151

Related Errors

Frontend

React Key Warning

React warns that list items are missing unique "key" props for efficient rendering.
EADDRINUSE DevOps

Port Already in Use

The application cannot start because the required port is already occupied by another process.
Frontend

ChunkLoadError

A dynamically imported JavaScript chunk failed to load from the server.
Frontend

WebSocket Connection Failed

The WebSocket connection could not be established or was closed unexpectedly.
All tools