【初心者向け】JavaScriptで関数が存在するかチェックする方法は？メソッドの使い方や実践コード例について解説！

こんにちは、大学院でIT系の研究を専攻している、ひらりんです。

JavaScriptは、Webページにて様々な機能を搭載したり、操作する際に使用されるプログラミング言語です。JavaScriptによって、ゲーム作成やサイトを動的にすることができ、フロントエンジニアを始めとした、プログラミング初学者など、多くの人におすすめしたい言語のひとつです！

本記事では、JavaScriptにおいて関数がプログラム内に存在しているかチェックする方法について説明します。普段よく使う関数や定義したものだと思い込んでプログラムを書き進め、実行してみると定義していなかったといったことは多々あります。とはいうものの、関数が既に存在しているか、長いプログラムの中から探すのはめんどくさいですよね。

そこで、関数の存在・定義しているかチェックする方法や、変数の存在をチェックする方法についても説明するので、JavaScriptの学習を始めた方や、プログラムを書く予定の人はぜひ読んでみてください！

そもそもJavaScriptの関数とは？

JavaScriptを始めとした、プログラムにおける関数とはどのようなものでしょうか？一般的な関数とは、「ある値を代入して、決まった処理を行い、結果を得る」というような意味ですが、プログラムも似ており、「同じ処理をまとめており、呼び出すことで何度も使えるセットになったもの」を表します。

処理内容をプログラムの順序通りに毎回書いても、問題なく実行されますが、毎回記述するのはめんどくさいですよね。また、関数の処理が長いと、その分、エラーが発生しやすくなっちゃいます。また、途中で関数の処理を変更したいときに、全部変更点を反映させるのは大変ですよね。

そこで、関数を予め定義しておくと、一行記述するだけで同様の処理を実行することができます。さらに、定義元の関数のみ変更することで、関数を利用している箇所はすべて反映された結果を得ることができます。

以下の記事で、JavaScriptの関数について詳しく書かれているので、分からない人はぜひチェックしてみましょう！

関数が存在するかチェックする方法

それでは、プログラム内に関数が存在するかどうか、チェックする方法について見てみましょう！プログラムにおいて、関数をまだ定義していないにも関わらず、呼び出してしまうとエラーになってしまいます。しかし、そこまで長くないプログラムならともかく、何百行となるプログラムになると、目視で関数があるかどうかチェックするのは大変ですよね。

そんな時に、JavaScriptでは関数が存在するかチェックする方法があります。基本構文から、実際のプログラムで使用される例まで説明します！

基本構文

関数が存在するかは、typeof演算子を用います。typeof演算子は、対象となる値や関数のデータ型を返す演算子です。ここで返される値が、関数かどうかとチェックすることで、対象のプログラム内に指定した関数が定義されているか確認することができます。

なお、if文を用いて、調査したい関数が存在しているか確認する構文は、次のようになります。

このように、typeof演算子を用いた戻り値が’function’かどうかで、関数の存在をチェックすることができます。

では、実際の使用例を見てみましょう。

実践プログラム例

typeof演算子を用いて、関数の存在をチェックをしているプログラムを書きました。上から順に説明します。

2～4行目で、関数Doubleが定義されています。7行目以降で、関数が定義されているかチェックされています。最初の7行目では、typeof演算子を用いて、Double関数の存在を確認されています。ここでは、Double関数はあるので、8行目の処理が実行されて、「関数Doubleがあります」と表示されます。

一方、13行目では、関数Halfの存在をtypeof演算子を用いてチェックされています。ここでは、Half関数はないため、16行目の処理が実行されて、「関数Halfはありません」と表示されます。

このように、typeof演算子を用いることで、関数が既に定義されているかチェックすることができますね！

変数が存在するかチェックする方法

関数以外にも、既にプログラムで定義されているかチェックしたい場合がありますよね。その際にも、typeof演算子を用いることで、確認することができます。今回は、変数が存在するかチェックする方法について、簡単に見てみましょう。

基本構文

関数の他に、数値をチェックしたいときは’number’、文字列は’string’、論理値は’boolean’と指定することで、プログラム内に存在するかチェックすることができます。また、配列などのオブジェクト型の場合は、’object’という戻り値が得られます。

この方法を用いることで、変数の存在だけでなく、値の種類まで判別することができます。では、typeof演算子を用いた値の判別の実践例を見てみましょう。

実践プログラム例

1行目で定義した変数ageの判別するプログラムを記述しました。3行目から始まるif構文では、変数ageが文字列かどうかチェックしています。ここでは、ageは文字列ではないので、6行目の処理が実行されて、「変数ageは文字列ではありません」と表示されます。

続いて、9行目から始まるif構文では、ageが数値かどうか判別しています。ここでは、条件を満たすため、10行目の処理が実行されて、「変数ageは数値です」と表示されます。

まとめ

いかがでしたでしょうか？今回は、JavaScriptにて関数や変数が存在しているかチェックする方法について説明しました。

JavaScriptでは、typeof演算子を使って関数などの存在を確認することができます。ぜひ、typeof演算子について理解し、エラーの少ないWebサービス作成やシステム構築に活かしてください。