1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
|
---
title: 'TypeError: "x" is not a function'
slug: Web/JavaScript/Reference/Fehler/Not_a_function
tags:
- Errors
- JavaScript
- TypeError
translation_of: Web/JavaScript/Reference/Errors/Not_a_function
---
<div>{{jsSidebar("Errors")}}</div>
<h2 id="Fehlermeldung">Fehlermeldung</h2>
<pre class="syntaxbox">TypeError: "x" is not a function
</pre>
<h2 id="Fehlertyp">Fehlertyp</h2>
<p>{{jsxref("TypeError")}}.</p>
<h2 id="Was_ist_falsch_gelaufen">Was ist falsch gelaufen?</h2>
<p>Es wird versucht, ein Wert wie eine Funktion aufzurufen, da aber der Wert eigentlich keine Funktion ist, kommt es zu diesem Fehler. Manchmal erwartet das Programm, dass eine Funktion erstellt wird, was aber nicht der Fall ist.</p>
<p>Vielleicht ist ein Tippfehler im Funktionsnamen. Manchmal besitzt das aufgerufene Objekt eine Funktion aber auch nicht. Zum Beispiel besitzen JavaScript Objekte keine <code>map</code> Funktion, aber JavaScript Arrays haben diese Funktion.</p>
<p>Es gibt viele eingebaute Funktionen, die eine (Callback-) Funktion benötigen. Es muss eine Funktion bereitgestellt werden, damit diese Methoden normal funktionieren:</p>
<ul>
<li>Wenn mit {{jsxref("Array")}} oder {{jsxref("TypedArray")}} Objekten gearbeitet wird:
<ul>
<li>{{jsxref("Array.prototype.every()")}}, {{jsxref("Array.prototype.some()")}}, {{jsxref("Array.prototype.forEach()")}}, {{jsxref("Array.prototype.map()")}}, {{jsxref("Array.prototype.filter()")}}, {{jsxref("Array.prototype.reduce()")}}, {{jsxref("Array.prototype.reduceRight()")}}, {{jsxref("Array.prototype.find()")}}</li>
</ul>
</li>
<li>Wenn mit {{jsxref("Map")}} und {{jsxref("Set")}} Objekten gearbeitet wird:
<ul>
<li>{{jsxref("Map.prototype.forEach()")}} und {{jsxref("Set.prototype.forEach()")}}</li>
</ul>
</li>
</ul>
<h2 id="Beispiele">Beispiele</h2>
<h3 id="Ein_Schreibfehler_im_Funktionsnamen">Ein Schreibfehler im Funktionsnamen</h3>
<p>In diesem Fall passiert es viel zu oft, dass im Name ein Schreibfehler enthält:</p>
<pre class="brush: js example-bad">var x = document.getElementByID('foo');
// TypeError: document.getElementByID is not a function
</pre>
<p>Der korrekte Funktionsname ist <code>getElementByI<strong>d</strong></code>:</p>
<pre class="brush: js example-good">var x = document.getElementById('foo');
</pre>
<h3 id="Funktion_wird_auf_dem_falschen_Objekt_aufgerufen">Funktion wird auf dem falschen Objekt aufgerufen</h3>
<p>Für bestimmte Methoden musst eine (callback) Funktion benutzt werden, die nur bei spezifizierten Objekten funktionieren. In diesem Beispiel wird {{jsxref("Array.prototype.map()")}} verwendet, welche nur mit {{jsxref("Array")}} Objekten funktioniert.</p>
<pre class="brush: js example-bad">var obj = {a: 13, b: 37, c: 42};
obj.map(function(num) {
return num * 2;
});
// TypeError: "x" is not a function</pre>
<p>Stattdessen muss ein Array verwendet werden:</p>
<pre class="brush: js example-good">var numbers = [1, 4, 9];
numbers.map(function(num) {
return num * 2;
});
// Array [2, 8, 18]
</pre>
<h3 id="Funktionen_teilen_einen_Namen_mit_einer_existierenden_Eigenschaft">Funktionen teilen einen Namen mit einer existierenden Eigenschaft</h3>
<p>Manchmal, wenn eine Klasse geschrieben wird, haben eine Eigenschaft und eine Funktion den gleichen Namen. Nach dem Aufruf der Funktion denkt der Compiler, dass die Funktion nicht mehr existiert.</p>
<pre class="brush: js example-bad">var Dog = function () {
this.age = 11;
this.color = "black";
this.name = "Ralph";
return this;
}
Dog.prototype.name = function(name) {
this.name = name;
return this;
}
var myNewDog = new Dog();
myNewDog.name("Cassidy"); //Uncaught TypeError: myNewDog.name is not a function
</pre>
<p>Stattdessen kann ein anderer Eigenschaftsname benutzt werden:</p>
<pre class="brush: js example-good">var Dog = function () {
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;
}
var myNewDog = new Dog();
myNewDog.name("Cassidy"); //Dog { age: 11, color: 'black', dogName: 'Cassidy' }
</pre>
<h2 id="Siehe_auch">Siehe auch</h2>
<ul>
<li><a href="/de/docs/Web/JavaScript/Reference/Functions">Functions</a></li>
</ul>
|
