Revision 1064266 of TypeError: "x" is not a function

<div>{{jsSidebar("Errors")}}</div>

<h2 id="Message">Message</h2>

<pre class="syntaxbox">
TypeError: "x" is not a function
</pre>

<h2 id="Error_type">Error type</h2>

<p>{{jsxref("TypeError")}}.</p>

<h2 id="What_went_wrong">What went wrong?</h2>

<p>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.</p>

<p>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 <code>map</code> function, but JavaScript Array object do.</p>

<p>There are many built-in functions in need of a (callback) function. You will have to provide a function in order to have these methods working properly:</p>

<ul>
 <li>When working with {{jsxref("Array")}} or {{jsxref("TypedArray")}} objects:
  <ul>
   <li>{{jsxref("Array.prototype.every()")}}, {{jsxref("Array.prototype.some()")}}, {{jsxref("Array.prototype.forEach()")}}, {{jsxref("Array.prototype.map()")}}, {{jsxref("Array.prototype.filter()")}},&nbsp; {{jsxref("Array.prototype.reduce()")}}, {{jsxref("Array.prototype.reduceRight()")}}, {{jsxref("Array.prototype.find()")}}</li>
  </ul>
 </li>
 <li>When working with {{jsxref("Map")}} and {{jsxref("Set")}} objects:
  <ul>
   <li>{{jsxref("Map.prototype.forEach()")}} and {{jsxref("Set.prototype.forEach()")}}</li>
  </ul>
 </li>
</ul>

<h2 id="Examples">Examples</h2>

<h3 id="Invalid_cases">A typo in the function name</h3>

<p>In this case, which happens way too often, there is a typo in the method name:</p>

<pre class="brush: js example-bad">
var x = document.getElementByID("foo");
// TypeError: document.getElementByID is not a function
</pre>

<p>The correct function name is <code>getElementByI<strong>d</strong></code>:</p>

<pre class="brush: js example-good">
var x = document.getElementById("foo");
</pre>

<h3>Function called on the wrong object</h3>

<p>For certain methods, you have to provide a (callback) function and it will work on specific objects only. In this example, {{jsxref("Array.prototype.map()")}} is used, which will work with {{jsxref("Array")}} objects only.</p>

<pre class="brush: js example-bad">
var obj = { a: 13, b: 37, c: 42 };

obj.map(function(num) {
  return num * 2;
});

// TypeError: obj.map is not a function</pre>

<p>Use an array instead:</p>

<pre class="brush: js example-good">
var numbers = [1, 4, 9];

numbers.map(function(num) { 
  return num * 2; 
}); 

// Array [ 2, 8, 18 ]
</pre>

<h2 id="See_also">See also</h2>

<ul>
 <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions">Functions</a></li>
</ul>