最終更新日 2024-09-25

~文法メモ~ 関数の引数

デフォルト引数

function multiply(a, b = 1) {
  return a*b;
}

multiply(5); // 5

2番めの引数で、undefined(nullではない)を渡してもデフォルト引数が利用されます

function setBackgroundColor(element, color = 'rosybrown') {
  element.style.backgroundColor = color;
}

setBackgroundColor(someDiv);            // color に 'rosybrown' が設定される
setBackgroundColor(someDiv, undefined); // これも color に 'rosybrown' が設定される
setBackgroundColor(someDiv, 'blue');    // color に 'blue' が設定される

デフォルト引数は後続のデフォルト引数で再利用可能

n番目の引数を使って、n+1番め以降の後続の引数のデフォルト値とすることが出来ます。

function mul(a, b = a) {
    return a * b;
}

hm.debuginfo( mul(3) ); // 9

式などもデフォルト引数に出来ます

この性質を利用すれば、引数が渡されていないとエラーを出すことなども可能です。

function CheckArgumentException() {
    return "NoArgumentException";
}

function abc( val = CheckArgumentException() ) {
    return val.toString();
}

hm.debuginfo( abc() ); // "NoArgumentException"

関数と名前付き引数

分割代入の性質を利用することで、関数の引数を名前引数であるかのように扱うことが出来ます。
このテクニックは様々なスクリプト言語で利用されています。

function mywindow({top = 10, left = 10, width = 100, height = 60}) {
    return [top, left, width, height]
}

hm.debuginfo(mywindow({top:200, height:300})); // [200,10,100,300]

分割代入の機能を利用しているだけですので、特定の値だけを取り出す目的にも使えます

function printtop({top}) {
    hm.debuginfo(top)
}

let data = {top:200, height:300};
printtop(data);

可変長引数

function sum(...args) {
    let sum = 0;
    for(let n of args) {
        sum += n;
    }
    return sum
}

hm.debuginfo(sum(100,200,300));

配列を複数個の引数へと展開する

function sum(...args) {
    let sum = 0;
    for(let n of args) {
        sum += n;
    }
    return sum
}

let sum1 = sum(10,20,30)
hm.debuginfo(sum1);

let arr = [10,20,30]
let sum2 = sum(...arr) // 配列を引数リストに展開
hm.debuginfo(sum2);