エラーメッセージ
TypeError: "x" is not a function
エラーの種類
エラーの原因
関数でないものを、関数呼び出ししようとした際に発生するエラーです。また適切な関数が定義されていることを期待されているが、定義されていない場合も発生します。
関数名のタイプミスをしていないか確認してみましょう。また、呼び出そうとしてるオブジェクトがそのメソッドを持っているかどうかも確認してみてください。配列オブジェクトが持っている map 関数を、それを持たない通常のオブジェクトに対して呼び出そうとしている場合が、後者の例になります。
多くの組み込み関数はコールバック関数を必要とします。これらのメソッドを正しく呼び出すためには、関数を引数に指定する必要があります:
ArrayもしくはTypedArrayオブジェクトを操作する場合:-
MapもしくはSetを操作する場合:
このエラーを起こすコードの例
関数名のタイプミス
次のように関数名を間違っている場合に発生します。なおこのミスは非常に多く発生します：
var x = document.getElementByID("foo");
// TypeError: document.getElementByID is not a function
正しい関数名は getElementById です:
var x = document.getElementById("foo");
間違ったオブジェクトに対する関数呼び出し
いくつかのメソッドは、引数に関数が指定されていることを期待していて、しかも特定のオブジェクトの上でのみ正しく動作するものがあります。この典型例が Array.prototype.map() で、これは Array オブジェクトでのみ正しく動作します。
var obj = { a: 13, b: 37, c: 42 };
obj.map(function(num) {
return num * 2;
});
// TypeError: obj.map is not a function
オブジェクトではなく、配列を利用しましょう:
var numbers = [1, 4, 9];
numbers.map(function(num) {
return num * 2;
});
// Array [ 2, 8, 18 ]
すでに存在するプロパティと名前を共有する関数
クラスを作るとき、時々プロパティと関数が同じ名前であることがあります。関数を呼び出すと、コンパイラーは関数が存在するのをやめたように考えます。
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代わりに異なるプロパティ名を使ってください:
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' }