【JavaScript基礎】関数の定義functionの使い方

2023年4月8日2023年5月2日

JavaScript

前回、論理演算子（AND、OR、NOT）の使い方を勉強しました。

JavaScriptの関数の定義は「function 関数名(引数1, 引数2, 引数3…){処理}」というように記述されます。

function calc(val1, val2){
    result = val1 + val2;
    return result
}

console.log(calc(1, 5))

実行結果
6

上記の例では「calc」という関数を2つの引数「val1とval2」を使って定義しています。

そして「result = val1 + val2」で足し算した値「result」を「return」で返しています。

つまりこの関数「calc(値1, 値2)」の値1と値2に数値を入力すると足し算した値が返ってくるわけです。

そのため「console.log(calc(1, 5))」とするとコンソールに「6」が表示されます。

この形はPythonの関数の定義「def」でもほぼ同じなので分かりやすいですね。

JavaScriptでは上記の方法以外に関数式を使った方法とアロー関数を使った方法というものがあるようです。

関数式を使った方法とは「変数の定義 = function(引数1, 引数2, 引数3…){処理}」という書き方です。

var calc = function(val1, val2){
    result = val1 + val2;
    return result
}

console.log(calc(1, 5))

実行結果
6

正直、何が利点か分かりませんが、こういう書き方もあるようです。

もう一つはアロー関数を使った関数の定義の方法です。

この方法では「変数の定義 = (引数1, 引数2, 引数3…) =>{処理}」という書き方をします。

var calc = (val1, val2) =>{
    result = val1 + val2;
    return result
}

console.log(calc(1, 5))

実行結果
6

こちらの方法では「function」すら無くなっていますが、こちらも何が利点なのかよく分かりません。

とりあえずこういう関数の定義の方法もあるということを頭に入れておいて、自分は書きやすい書き方で書けばいいのかなと思います。

ここまで何回かJavaScriptの記事が続きましたが、その間にPythonで色々やってまた記事を書きたいことが出てきたので、次回からはPythonの解説に一旦戻ります。

次回はmatplotlibの画像サイズに関して解説をしていきます。