JavaScript 関数のデフォルトパラメータを理解する

JavaScript関数のデフォルトパラメータ

JavaScript の

デフォルト パラメーター を使用すると、関数パラメーターのデフォルト値を指定できます。特定のパラメーターの値を指定せずに関数が呼び出された場合は、代わりにデフォルト値が使用されます。

この機能は ES6 (ECMAScript 2015) で導入され、パラメーターが提供されない場合の処理​​に役立ち、未定義の動作を回避し、コードをより堅牢にします。

1. デフォルトパラメータの基本構文

次の例では、b に引数が渡されない場合、デフォルトの 10 になります。

function sum(a, b = 10) {
  return a + b;
}

console.log(sum(5, 3));  // Output: 8
console.log(sum(5));     // Output: 15 (b defaults to 10)

この場合:

• sum(5, 3) が呼び出されるとき、b は明示的に 3 として渡されるため、結果は 8 になります。
• sum(5) を呼び出すと、b が渡されないため結果は 15 になり、デフォルト値の 10 が使用されます。

2. 式でのデフォルト パラメータの使用

関数の呼び出しや計算の実行など、式の結果であるデフォルト値を設定することもできます。

function greet(name = "Guest") {
  console.log(`Hello, ${name}!`);
}

greet();          // Output: Hello, Guest!
greet("John");    // Output: Hello, John!

ここで、関数に値が渡されない場合、「Guest」は名前のデフォルト値です。

3. 分割を伴うデフォルトパラメータ

デフォルトのパラメータは分割でも機能します。関数パラメーターでオブジェクトまたは配列の構造化を使用している場合は、特定のプロパティまたは項目にデフォルト値を設定できます。

オブジェクト分割のデフォルト値

function printInfo({ name = "Anonymous", age = 18 } = {}) {
  console.log(`Name: ${name}, Age: ${age}`);
}

printInfo({ name: "Alice", age: 25 });  // Output: Name: Alice, Age: 25
printInfo({});                          // Output: Name: Anonymous, Age: 18
printInfo();                            // Output: Name: Anonymous, Age: 18

この場合:

• オブジェクトが渡された場合、関数はそのオブジェクトのプロパティを使用します。
• オブジェクトが渡されないか、オブジェクトにプロパティが欠落している場合は、デフォルト値が使用されます。

配列分割時のデフォルト値

function printNumbers([a = 1, b = 2] = []) {
  console.log(`a: ${a}, b: ${b}`);
}

printNumbers([5, 10]);  // Output: a: 5, b: 10
printNumbers([7]);      // Output: a: 7, b: 2
printNumbers();         // Output: a: 1, b: 2

この場合:

• この関数は配列を操作し、値が渡されない場合は a と b にデフォルト値を提供します。

4. デフォルトのパラメータと関数の引数

デフォルトのパラメータを引数と組み合わせて使用​​して、引数の数が動的である場合を処理することもできます。

function multiply(a, b = 2) {
  console.log(a * b);
}

multiply(3, 4);  // Output: 12
multiply(3);     // Output: 6 (b defaults to 2)

この例では:

• この関数は a と b を乗算します。b が指定されていない場合、デフォルトは 2 になります。

5. デフォルトを返す関数を含むデフォルトパラメータ

関数をデフォルト値として使用できます。これは、動的または複雑なデフォルト値が必要なシナリオで役立ちます。

function getUser(id, name = getDefaultName()) {
  console.log(`User ID: ${id}, Name: ${name}`);
}

function getDefaultName() {
  return "John Doe";
}

getUser(1);          // Output: User ID: 1, Name: John Doe
getUser(2, "Alice"); // Output: User ID: 2, Name: Alice

この例では:

• 名前が指定されていない場合、関数 getDefaultName() が呼び出され、その結果がデフォルト値として使用されます。

6. 残りのパラメータを含むデフォルトパラメータ

デフォルト パラメーターと残りのパラメーター (...args) を組み合わせて、関数が受け取る可能性のある引数の数がわからないシナリオに対処できます。

function sum(a, b = 10) {
  return a + b;
}

console.log(sum(5, 3));  // Output: 8
console.log(sum(5));     // Output: 15 (b defaults to 10)

この場合:

• 区切り文字パラメータが指定されていない場合、デフォルト値は であり、文字列は関数に渡されるすべての追加引数を収集します。

結論

JavaScript のデフォルト パラメーターを使用すると、欠落しているパラメーターまたは未定義のパラメーターのデフォルト値を定義できるため、関数がより柔軟になります。この機能により、コードの可読性が向上し、引数の欠落によるエラーの防止に役立ちます。

構造化、残りパラメータ、さらには関数呼び出しなどの他の機能と組み合わせて、動的で簡潔で保守可能な関数を作成できます。

---

こんにちは、アバイ・シン・カタヤットです!
私はフロントエンドとバックエンドの両方のテクノロジーの専門知識を持つフルスタック開発者です。私はさまざまなプログラミング言語やフレームワークを使用して、効率的でスケーラブルでユーザーフレンドリーなアプリケーションを構築しています。
ビジネス用メールアドレス kaashshorts28@gmail.com までお気軽にご連絡ください。

以上がJavaScript 関数のデフォルトパラメータを理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。