#20 JavaScriptで学ぶ関数の応用(デフォルト引数・可変長引数)の基本

JavaScriptで関数を使っていると、悩むことはありませんか。「引数を渡し忘れたらエラーになってしまう」「引数の数が決まっていないときはどうすればいいの?」といった場面です。今回は、そんな悩みを解決してくれる「デフォルト引数」と「可変長引数」という2つの機能を紹介します。どちらも関数をより柔軟に、読みやすく書くための仕組みです。

デフォルト引数とは

関数を呼び出すとき、引数(関数に渡す値)を省略すると、その値はundefined(値が定義されていないことを表す特別な値)になります。そのままだと計算に使ったときに意図しない結果になりがちです。

そこで便利なのが「デフォルト引数」です。これは、引数が渡されなかったときに自動で使われる初期値をあらかじめ設定しておく仕組みです。書き方はとてもシンプルで、引数名の後ろに= 初期値を書くだけです。

function greet(name = "ゲスト") {
  console.log(`こんにちは、${name}さん`);
}

greet();        // こんにちは、ゲストさん
greet("田中");  // こんにちは、田中さん

このように、引数を省略した場合は自動的に「ゲスト」が使われます。以前は関数の中でif文を使って「値が渡されていなければ初期値を代入する」という処理を書く必要がありましたが、デフォルト引数を使えば1行で済みます。

なお、デフォルト引数には固定の値だけでなく、他の変数を使った計算式や、別の関数の呼び出し結果を指定することもできます。この柔軟さはJavaScriptらしい特徴のひとつです。

可変長引数(残余引数)とは

次に紹介するのは「可変長引数」です。これは、関数に渡す引数の数が決まっていない場合に使う書き方です。例えば「合計を計算する関数」を作るとき、渡す数値が2個の場合も5個の場合もあり得ますよね。そんなときに便利なのが、引数名の前に...(ドット3つ)を付ける「残余引数(rest parameters)」という書き方です。

function sum(...numbers) {
  return numbers.reduce((total, n) => total + n, 0);
}

console.log(sum(1, 2, 3));       // 6
console.log(sum(10, 20, 30, 40)); // 100

この...numbersは、渡された引数をすべて配列としてまとめてくれます。配列なので、reduceのような配列用のメソッド(まとめて処理を行うための便利な機能)がそのまま使えるのが大きな利点です。

従来のarguments・apply・callとの違い

実はJavaScriptには、残余引数が登場する前から「arguments」という仕組みがありました。これは関数の中で自動的に使える特殊な変数で、渡された引数がすべて格納されています。ただし、argumentsは配列に似ていますが本物の配列ではないため、reduceやmapのような配列のメソッドを直接使うことができません。使うには配列に変換する一手間が必要でした。

また、他言語やJavaScriptの古いコードでは、関数に配列の中身をひとつずつ引数として渡すためにapplyやcallというメソッドが使われることもあります。これらは今でも使われる場面があります。ただし、残余引数とセットで登場する「スプレッド構文」(配列を...で展開して個別の値として渡す書き方)を使うと、より簡潔に同じことができます。

const nums = [3, 1, 4, 1, 5];
console.log(Math.max(...nums)); // 5

このように、初心者のうちは新しい書き方である残余引数・スプレッド構文を中心に覚えておけば十分です。argumentsやapply/callは、古いコードを読むときに「こういう書き方もあったのか」と理解できれば問題ありません。

デフォルト引数と可変長引数を組み合わせる

この2つは組み合わせて使うこともできます。ただし、可変長引数(残余引数)は必ず引数リストの一番最後に書くというルールがある点に注意してください。

function order(item, quantity = 1, ...options) {
  console.log(`${item}を${quantity}個、オプション: ${options.join("、")}`);
}

order("コーヒー", 2, "氷なし", "砂糖多め");

このように、決まった役割を持つ引数にはデフォルト引数を、数が不定な部分には残余引数を使い分けることで、呼び出す側にとって使いやすい関数を設計できます。

まとめ

今回はJavaScriptの関数をより柔軟に書くための2つの機能を紹介しました。

  • デフォルト引数:引数が省略されたときに使われる初期値を、= 値の形で設定できる
  • 可変長引数(残余引数):...引数名と書くことで、数が決まっていない引数を配列としてまとめて受け取れる

どちらも「関数を呼び出す側の負担を減らす」ための工夫です。最初は少し記号の意味を覚えるのに戸惑うかもしれませんが、実際に手を動かしてコードを書いてみると、すぐに感覚がつかめるはずです。ぜひ自分の書いた関数に少しずつ取り入れてみてください。

関連記事

本ページはプロモーションを含みます。

参考書籍(PR)

JavaScriptをもっと学びたい方には「改訂新版JavaScript本格入門」がおすすめです。

コメント

コメントを投稿

このブログの人気の投稿

#11 Rustで学ぶエラーハンドリングの基本

Rustのエラーハンドリングは、他の言語のような「例外」という仕組みを持たず、`Result`という型を使った独自の考え方が中心になります。この記事では、Rustにおけるエラーハンドリングの基本を解説します。 Result型という考え方 失敗する可能性がある処理は、`Result`という「成功か失敗かを表す型」を返します。 fn divide(a: i32, b: i32) -> Result<i32, String> { if b == 0 { return Err(String::from("0では割れません")); } Ok(a / b) } 成功時は`Ok`、失敗時は`Err`という形で結果を包んで返します。 matchで結果を扱う match divide(10, 0) { Ok(result) => println!("結果: {}", result), Err(message) => println!("エラー: {}", message), } ?という便利な記号 Rustには、`Result`がエラーだった場合に、その場で関数の呼び出し元にエラーを伝えて処理を中断できる`?`という記号があります。 fn calculate() -> Result<i32, String> { let result = divide(10, 0)?; Ok(result) } Rustならではの注意点 他の言語の「エラーが起きても気づかずに進んでしまう」という問題を防ぐため、Rustは`Result`の中身を確認しない限り、警告を出す仕組みになっています。エラーの可能性を無視できない設計こそが、Rustの安全性を支えています。 まとめ Rustのエラーハンドリングは`Result`型が中心で、`match`や`?`を使って結果を扱います。エラーの可能性を無視できない設計に慣れていきましょう。 本ページはプロモーションを含みます。 参考書籍(PR) Rustをもっと学びたい方には「 実践Rust入門[言語仕様から開発手法まで] 」がおすすめです。...
続きを読む

#16 TypeScriptで学ぶ辞書型(マップ)の基本

TypeScriptの辞書に相当する仕組みは、JavaScriptと同じですが、キーと値の型をあらかじめ決めておけるのが特徴です。この記事では、TypeScriptにおける辞書の扱い方を解説します。 型付きのオブジェクト interface Person { name: string; age: number; } const person: Person = { name: "太郎", age: 20 }; キーの型が決まっていない辞書 キーの名前が事前に決まっていない辞書のような使い方をしたい場合は、次のように書きます。 const scores: { [key: string]: number } = {}; scores["太郎"] = 90; Mapを使う場合 const person = new Map<string, string>(); person.set("name", "太郎"); `Map<string, string>`のように、キーと値それぞれの型を指定できます。 TypeScriptならではの注意点 型付きのオブジェクト(`interface`)を使うと、存在しないキーにアクセスしようとした際に、実行前の段階でエラーとして教えてもらえます。データの形が決まっている場合は、キーが自由な辞書よりも`interface`を使うほうが安全です。 まとめ TypeScriptの辞書は、形が決まっているなら`interface`、自由なキーを扱うなら`{ [key: string]: 型 }`や`Map`を使います。用途に応じて型の付け方を選びましょう。 本ページはプロモーションを含みます。 参考書籍(PR) TypeScriptをもっと学びたい方には「 プロを目指す人のためのTypeScript入門 」がおすすめです。
続きを読む

#19 Goで学ぶテスト(単体テスト)の基本

Goはシンプルな文法が魅力ですが、書いたコードが正しく動くかどうかは別問題です。この記事では、Goで書いたコードを自動でチェックする「テスト」の基本を解説します。 なぜテストを書くのか コードを修正するたびに、関連する機能が壊れていないかを手作業で確認するのは大変です。テストを用意しておけば、コマンド一つで動作確認ができ、安心してコードを直せるようになります。 Go標準のテスト機能 Goには追加のライブラリを入れなくても使える testing パッケージが標準で備わっています。テスト対象のファイルと同じディレクトリに、名前の末尾が _test.go のファイルを作ります。 // add.go package main func add(a int, b int) int { return a + b } // add_test.go package main import "testing" func TestAdd(t *testing.T) { result := add(2, 3) if result != 5 { t.Errorf("add(2, 3) = %d; want 5", result) } } テスト関数の名前は Test から始める決まりです。ターミナルで go test と実行すると、 _test.go 内の Test から始まる関数がすべて自動で実行されます。 複数パターンをまとめてテストする Goでは、複数の入力パターンをスライス(配列のようなもの)にまとめて、まとめてテストする書き方(テーブル駆動テスト)がよく使われます。 func TestAddCases(t *testing.T) { cases := []struct{ a, b, want int }{ {2, 3, 5}, {0, 0, 0}, {-1, 1, 0}, } for _, c := range cases { if got := add(c.a, c.b); got != c.want { t.Errorf("add(%d,...
続きを読む