HTML: Markup language
CSS: Styling language
JavaScript: Scripting language
Web APIs: Programming interfaces
All web technology
Learn web development
Discover our tools
Get to know MDN better
Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.
View in English Always switch to English
Die JavaScript-Ausnahme "is not a function" tritt auf, wenn versucht wurde, einen Wert als Funktion aufzurufen, der Wert aber tatsächlich keine Funktion ist.
TypeError: "x" is not a function. (V8-based & Firefox & Safari)
TypeError
Es wurde versucht, einen Wert als Funktion aufzurufen, aber der Wert ist tatsächlich keine Funktion. Einige Codeabschnitte erwarten, dass Sie eine Funktion bereitstellen, was jedoch nicht geschehen ist.
Vielleicht gibt es einen Tippfehler im Funktionsnamen? Vielleicht hat das Objekt, auf dem Sie die Methode aufrufen, diese Funktion nicht? Zum Beispiel haben JavaScript-Objects keine map-Funktion, aber das JavaScript-Array-Objekt schon.
Objects
map
Array
Es gibt viele eingebaute Funktionen, die eine (Callback-)Funktion benötigen. Sie müssen eine Funktion bereitstellen, um diese Methoden ordnungsgemäß funktionieren zu lassen:
Beim Arbeiten mit Array oder TypedArray Objekten:
TypedArray
Array.prototype.every()
Array.prototype.some()
Array.prototype.forEach()
Array.prototype.map()
Array.prototype.filter()
Array.prototype.reduce()
Array.prototype.reduceRight()
Array.prototype.find()
Beim Arbeiten mit Map und Set Objekten:
Map
Set
Map.prototype.forEach()
Set.prototype.forEach()
In diesem Fall, der viel zu oft passiert, gibt es einen Tippfehler im Methodennamen:
const x = document.getElementByID("foo"); // TypeError: document.getElementByID is not a function
Der korrekte Funktionsname ist getElementById:
getElementById
const x = document.getElementById("foo");
Für bestimmte Methoden müssen Sie eine (Callback-)Funktion bereitstellen, und sie funktioniert nur mit bestimmten Objekten. In diesem Beispiel wird Array.prototype.map() verwendet, das nur mit Array Objekten funktioniert.
const obj = { a: 13, b: 37, c: 42 }; obj.map((num) => num * 2); // TypeError: obj.map is not a function
Verwenden Sie stattdessen ein Array:
const numbers = [1, 4, 9]; numbers.map((num) => num * 2); // [2, 8, 18]
Manchmal kann es bei der Erstellung einer Klasse vorkommen, dass eine Eigenschaft und eine Funktion denselben Namen haben. Beim Aufrufen der Funktion denkt der Compiler, dass die Funktion nicht mehr existiert.
function Dog() { this.age = 11; this.color = "black"; this.name = "Ralph"; return this; } Dog.prototype.name = function (name) { this.name = name; return this; }; const myNewDog = new Dog(); myNewDog.name("Cassidy"); // TypeError: myNewDog.name is not a function
Verwenden Sie stattdessen einen anderen Eigenschaftsnamen:
function Dog() { this.age = 11; this.color = "black"; this.dogName = "Ralph"; // Using this.dogName instead of .name return this; } Dog.prototype.name = function (name) { this.dogName = name; return this; }; const myNewDog = new Dog(); myNewDog.name("Cassidy"); // Dog { age: 11, color: 'black', dogName: 'Cassidy' }
In der Mathematik kann man 2 × (3 + 5) als 2*(3 + 5) oder einfach 2(3 + 5) schreiben.
Die Verwendung der letzteren Schreibweise führt zu einem Fehler:
const sixteen = 2(3 + 5); console.log(`2 x (3 + 5) is ${sixteen}`); // Uncaught TypeError: 2 is not a function
Sie können den Code korrigieren, indem Sie einen * Operator hinzufügen:
*
const sixteen = 2 * (3 + 5); console.log(`2 x (3 + 5) is ${sixteen}`); // 2 x (3 + 5) is 16
Stellen Sie sicher, dass Sie das Modul korrekt importieren.
Ein Beispiel aus einer Helferbibliothek (helpers.js)
helpers.js
function helpers() {} helpers.groupBy = function (objectArray, property) { return objectArray.reduce((acc, obj) => { const key = obj[property]; acc[key] ??= []; acc[key].push(obj); return acc; }, {}); }; export default helpers;
Die korrekte Importverwendung (App.js):
App.js
import helpers from "./helpers";