From 9b965a794d8e500fc0414f234f451a0c6b464984 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Fri, 25 Jun 2021 01:17:20 +0900 Subject: Web/JavaScript/Reference/Errors/N* を更新 (#1202) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Web/JavaScript/Reference/Errors/N* を更新 2021/06/14 時点の英語版に同期 * 追加修正 --- .../reference/errors/not_a_function/index.html | 134 ++++++++++++++------- 1 file changed, 91 insertions(+), 43 deletions(-) (limited to 'files/ja/web/javascript/reference/errors/not_a_function') diff --git a/files/ja/web/javascript/reference/errors/not_a_function/index.html b/files/ja/web/javascript/reference/errors/not_a_function/index.html index 9b679e9bd2..06b63db14d 100644 --- a/files/ja/web/javascript/reference/errors/not_a_function/index.html +++ b/files/ja/web/javascript/reference/errors/not_a_function/index.html @@ -2,63 +2,67 @@ title: 'TypeError: "x" is not a function' slug: Web/JavaScript/Reference/Errors/Not_a_function tags: - - Errors - - JavaScript - - TypeError +- Error +- Errors +- JavaScript +- TypeError translation_of: Web/JavaScript/Reference/Errors/Not_a_function ---
{{jsSidebar("Errors")}}
-

エラーメッセージ

+

JavaScript の例外 "is not a function" は、値を関数として呼び出そうとしたが、その値が実際には関数ではなかった場合に発生します。

-
TypeError: "x" is not a function
+
エラーメッセージ

+
+
TypeError: Object doesn't support property or method {x} (Edge)
+TypeError: "x" is not a function
 

 
-
エラーの種類

+
エラーの種類

 
-
{{jsxref("TypeError")}}.

+
{{jsxref("TypeError")}}

 
-
エラーの原因

+
エラーの原因

 
 
関数でないものを、関数呼び出ししようとした際に発生するエラーです。また適切な関数が定義されていることを期待されているが、定義されていない場合も発生します。

 
 
関数名のタイプミスをしていないか確認してみましょう。また、呼び出そうとしてるオブジェクトがそのメソッドを持っているかどうかも確認してみてください。配列オブジェクトが持っている map 関数を、それを持たない通常のオブジェクトに対して呼び出そうとしている場合が、後者の例になります。

 
-
多くの組み込み関数はコールバック関数を必要とします。これらのメソッドを正しく呼び出すためには、関数を引数に指定する必要があります:

+
多くの組み込み関数はコールバック関数を必要とします。これらのメソッドを正しく呼び出すためには、関数を引数に指定する必要があります。

 
 
 
-
このエラーを起こすコードの例

+
例

 
-
関数名のタイプミス

+
関数名のタイプミス

 
-
次のように関数名を間違っている場合に発生します。なおこのミスは非常に多く発生します：

+
次のように関数名を間違えている場合に発生します。なおこのミスは非常に多く発生します。

 
-
var x = document.getElementByID("foo");
+
let x = document.getElementByID('foo');
 // TypeError: document.getElementByID is not a function
 

 
-
正しい関数名は getElementById です:

+
正しい関数名は getElementById です。

 
-
var x = document.getElementById("foo");
+
let x = document.getElementById('foo');
 

 
-
間違ったオブジェクトに対する関数呼び出し

+
間違ったオブジェクトに対する関数呼び出し

 
 
いくつかのメソッドは、引数に関数が指定されていることを期待していて、しかも特定のオブジェクトの上でのみ正しく動作するものがあります。この典型例が {{jsxref("Array.prototype.map()")}} で、これは {{jsxref("Array")}} オブジェクトでのみ正しく動作します。

 
-
var obj = { a: 13, b: 37, c: 42 };
+
let obj = {a: 13, b: 37, c: 42};
 
 obj.map(function(num) {
   return num * 2;
@@ -66,25 +70,25 @@ obj.map(function(num) {
 
 // TypeError: obj.map is not a function

 
-
オブジェクトではなく、配列を利用しましょう:

+
オブジェクトではなく、配列を利用しましょう。

 
-
var numbers = [1, 4, 9];
+
let numbers = [1, 4, 9];
 
 numbers.map(function(num) {
   return num * 2;
 });
 
-// Array [ 2, 8, 18 ]
+// Array [2, 8, 18]
 

 
-
すでに存在するプロパティと名前を共有する関数

+
すでに存在するプロパティと名前を共有する関数

 
-
クラスを作るとき、時々プロパティと関数が同じ名前であることがあります。関数を呼び出すと、コンパイラーは関数が存在するのをやめたように考えます。

+
クラスを作るとき、プロパティと関数が同じ名前になることがあります。関数を呼び出すと、コンパイラーは関数が存在するのをやめたように考えます。

 
-
var Dog = function () {
+
var Dog = function () {
  this.age = 11;
  this.color = "black";
- this.name = "Ralph";
+ this.name = "Ralph";
  return this;
 }
 
@@ -93,16 +97,16 @@ Dog.prototype.name = function(name) {
  return this;
 }
 
-
 var myNewDog = new Dog();
-myNewDog.name("Cassidy"); //Uncaught TypeError: myNewDog.name is not a function

+myNewDog.name("Cassidy"); //Uncaught TypeError: myNewDog.name is not a function
+

 
-
代わりに異なるプロパティ名を使ってください:

+
代わりに異なるプロパティ名を使ってください。

 
-
var Dog = function () {
+
var Dog = function () {
  this.age = 11;
  this.color = "black";
- this.dogName = "Ralph"; //Using this.dogName instead of .name
+ this.dogName = "Ralph"; //Using this.dogName instead of .name
  return this;
 }
 
@@ -111,12 +115,56 @@ Dog.prototype.name = function(name) {
  return this;
 }
 
-
 var myNewDog = new Dog();
-myNewDog.name("Cassidy"); //Dog { age: 11, color: 'black', dogName: 'Cassidy' }

+myNewDog.name("Cassidy"); //Dog { age: 11, color: 'black', dogName: 'Cassidy' }
+

+
+
乗算での括弧の使用

+
+
数学では、 2 × (3 + 5) を 2*(3 + 5) または単に 2(3 + 5) と書くことができます。

+
+
後者を使用するとエラーが発生します。

+
+
const sixteen = 2(3 + 5);
+alert('2 x (3 + 5) is ' + String(sixteen));
+//Uncaught TypeError: 2 is not a function

+
+
このコードは * 演算子を追加すると修正できます。

+
+
const sixteen = 2 * (3 + 5);
+alert('2 x (3 + 5) is ' + String(sixteen));
+//2 x (3 + 5) is 16
+

+
+
正しくエクスポートされたモジュールをインポートする

+
+
正しくモジュールをインポートしていることを確認してください。

+
+
helpers ライブラリーの例 (helpers.js)

+
+
let helpers = function () { };
+
+helpers.groupBy = function (objectArray, property) {
+  return objectArray.reduce(function (acc, obj) {
+    var key = obj[property];
+    if (!acc[key]) {
+      acc[key] = [];
+    }
+    acc[key].push(obj);
+    return acc;
+  },
+{});
+}
+
+export default helpers;
+

+
+
正しい import の使い方 (App.js):

+
+
import helpers from './helpers'

 
-
関連情報

+
関連情報

 
 
-- 
cgit v1.2.3-54-g00ecf