職案人

求職・歴史・仏教などについて掲載するつもりだが、自分の思いつきが多いブログだよ。適当に付き合って下さい。

JS--関数

2024年03月08日 | JavaScript

関数を定義する

【開発環境】
OS:Win11(64ビット)
VSCode1.72.2、
クロム
 
 
【関数を定義する】
関数を定義する方法はいくつかありますが、ここでは function キーワードを使った関数の宣言について
 
・書式
function 関数名(引数1, 引数2, ...){
実行される処理1;
実行される処理2;
...

return 戻り値;
}
 
引数が無い場合
function 関数名(){
実行される処理1;
実行される処理2;
...
return 戻り値;
}

※関数が呼び出された時に実行される処理を { から } のブロック内に記述する。ただし、関数の場合は処理が一つであってもブロックを表す { と } を省略することはできません!
関数の呼び出し元に値を返す場合には return 文を使用する

【関数を呼び出すには】
定義した関数を呼び出すには次のように記述します。

関数名(引数, ...);

引数が無い場合
関数名();

戻り値を変数に格納するには
let 変数名 = 関数名(引数, ...);

関数を呼び出す時に指定した引数が関数にどのように渡されるのか、そして関数からの戻り値が関数の呼び出し側にどのように戻ってくるか図にした。

サンプル

function dispHello(){
console.log('Hello');
console.log('JavaScript');
}

dispHello();
> Hello
>JavaScript

サンプル--引数有りの場合
function dispTotal(x, y){
let sum = x + y;
return sum;
}
let result = dispTotal(3, 4);
console.log(result);
> 7
result = dispTotal(7, 1);
console.log(result);
> 8

【他の方法で関数を定義する方法】
関数を定義する方法はこのページで解説した function キーワードを使った関数の宣言以外に 3 つの方法がある。

(1) Function コンストラクタを使用した関数の定義:
let 変数名 = new Function('引数1', '引数2', ..., '実行される処理');

(2) 関数リテラルを使った関数の定義:
let 変数名 = function(引数1, 引数2, ...){
実行される処理1; 実行される処理2;
... return 戻り値;
};

(3) アロー関数式を使った関数の定義:
let 変数名 = (引数1, 引数2, ...) => {
実行される処理1; 実行される処理2;
...

return 戻り値;
};




コメント    この記事についてブログを書く
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする
« JS--要素の値を合計する | トップ | JS--関数の引数 »
最新の画像もっと見る

コメントを投稿

JavaScript」カテゴリの最新記事