職案人

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

JS--関数の引数

2024年03月12日 | JavaScript

関数の引数

【開発環境】
OS:Win11(64ビット)
VSCode1.72.2、
クロム
【引数の基本的な使い方】
・関数の定義

function 関数名(仮引数1, 仮引数2, ...){
実行される処理1;
実行される処理2;
...

return 戻り値;
}

・関数の呼び出し
関数名(実引数1, 実引数2, ...);
 
サンプル
function dispMessage(msg){
  console.log(msg);
}

dispMessage('Hello');
> Hello

dispMessage(100);
> 100

【関数の呼び出し側と、受け取り側で引数が異なる場合】
JavaScript の関数では、関数を呼び出す時に記述した値の数と、値を受けとる関数の引数の数が違っていてもエラーにはなりません。

サンプルコード

function dispProfile(name, old){
  console.log('name : ' + name);
  console.log('old : ' + old);
}

dispProfile('Yamada', 24);//引数が2つ
> name : Yamada
> old : 24

dispProfile('Suzuki');//引数が1つの場合、2つ目はundefinedと成る> name : Suzuki
> old : undefined

・引数が3つの場合

function dispProfile(name, old){
  console.log('name : ' + name);
  console.log('old : ' + old);
}

dispProfile('Yamada', 24);
> name : Yamada
> old : 24

dispProfile('Suzuki', 38, 'Kyoto');//引数が3つの場合、3つ目は無視される
> name : Suzuki
> old : 38

【引数のデフォルト値を設定するには】
関数を呼び出すときに記述した値の数が関数の引数の数よりも少なかった場合、値が格納されなかった引数を参照すると undefined となっていました。このような場合に、関数の引数に対してデフォルト値を設定しておくことができます。

・書式

function 関数名(引数1=デフォルト値1, 引数2=デフォルト値2, ...){
...
}

サンプル

function dispOrderPrice(price, count=10){
  console.log('Total = ' + (price * count));
}

dispOrderPrice(80, 14);
> Total = 1120

dispOrderPrice(120);//デフォルトがセットされる。
> Total = 1200

関数の 2 つの目の引数にデフォルト値が設定されています。

【可変長引数を記述する】
関数で引数を記述するときに、引数の前に '...' (リストパラメータ)を付けると、呼び出し側から渡されてきたすべての値を要素とした配列が要素に格納されます

・書式
function 関数名(...引数){
...

}

サンプル

function calcSum(...num){
  let sum = 0;
  for (let i = 0 ; i > 6

calcSum(1, 2, 3, 4, 5);
> 15

・普通の引数と組み合わせて使う場合
function 関数名(引数1, 引数2, ...引数3){

...

}

コメント
  • Twitterでシェアする
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする