Solución: TypeError — X is not a function en JavaScript

Paso 1 — Comprueba qué es realmente esa variable:

console.log(typeof miVariable); // Si no es "function", ese es el problema
console.log(miVariable);        // Ver el valor exacto

Caso más común — llamar a un método que no existe en ese tipo:

// ❌ .map() no existe en objetos
const datos = { a: 1, b: 2 };
datos.map(x => x);  // TypeError: datos.map is not a function
// ✅ Convierte a array primero
Object.values(datos).map(x => x);
// ❌ .toUpperCase() solo existe en strings
const num = 42;
num.toUpperCase(); // TypeError
// ✅ Convierte antes
String(num).toUpperCase();

Caso — importación incorrecta de función:

// Si el módulo exporta un objeto con la función:
// módulo.js → export default { miFuncion: () => {} }
// ❌ Importas el objeto pero lo llamas directamente
import miFuncion from './modulo';
miFuncion();  // TypeError — es un objeto, no una función
// ✅ Desestructura correctamente
import { miFuncion } from './modulo';
miFuncion();

Caso — callback no llegó como función:

// ❌ Si onSubmit es undefined porque no se pasó como prop
function Formulario({ onSubmit }) {
  return  onSubmit(datos)}>Enviar;
  // TypeError si el padre no pasó onSubmit
}
// ✅ Comprueba antes de llamar
function Formulario({ onSubmit }) {
  const handleClick = () => {
    if (typeof onSubmit === 'function') onSubmit(datos);
  };
  return Enviar;
}

Caso — shadowing de nombre:

// ❌ La variable local tapa la función global
function procesarDatos() {
  const parseInt = 42;  // ← tapa window.parseInt
  return parseInt('10'); // TypeError: parseInt is not a function
}