可変長引数 ES6 before & after

可変長引数の関数を定義する

/**
 * 可変長引数
 */
//ES6 before ----------------------------------------------------------------------
//argumentsオブジェクトは、Arrayオブジェクトのように見えるがそうではない。
function sum() {
    var result = 0;
    // 与えられた引数を順番に取り出し、順に加算処理。
    for (var i = 0, len = arguments.length; i < len; i++) {
        var tmp = arguments[i];
        if (typeof tmp !== 'number') {//引数が数字ではない場合、エラー表示する。
            throw new Error('引数が数値ではない:' + tmp);
        }
        result += tmp;
    }
    return result;
}
try {
    document.getElementById('hoge1').textContent='before : ' + sum(1, 3, 5, 7, 9); // 結果:25
} catch(e) {
    window.alert(e.message);
}

//ES6 after ----------------------------------------------------------------------
//仮引数の前に「...」(ピリオド)を付与することで、可変長引数となり、引数を配列として受け取ることができる。
function sum(...nums) {
    let result = 0;
    for (let num of nums) {
        if (typeof num !== 'number') {
            throw new Error('指定値が数値ではない:' + num);
        }
        result += num;
    }
    return result;
}
try {
    document.getElementById('hoge2').textContent='after : ' + sum(1, 3, 5, 7, 9); // 結果:25
} catch(e) {
    window.alert(e.message);
}

See the Pen 可変長引数 ES2015 before & after by nwstcode (@nwst) on CodePen.

TagTimes

Simple time tracking tool
Developed by Namu Works