|
|
<!--
|
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
|
{
|
|
|
"original_hash": "8328f58f4593b4671656ff8f4b2edbd9",
|
|
|
"translation_date": "2025-10-24T14:46:28+00:00",
|
|
|
"source_file": "2-js-basics/2-functions-methods/assignment.md",
|
|
|
"language_code": "ja"
|
|
|
}
|
|
|
-->
|
|
|
# 関数で遊ぼう
|
|
|
|
|
|
## 課題の説明
|
|
|
|
|
|
この課題では、JavaScriptの関数、パラメータ、デフォルト値、戻り値について学んだ内容を強化するために、さまざまな種類の関数を作成する練習をします。
|
|
|
|
|
|
`functions-practice.js`というJavaScriptファイルを作成し、以下の関数を実装してください。
|
|
|
|
|
|
### パート1: 基本的な関数
|
|
|
1. **`sayHello`という関数を作成**してください。この関数はパラメータを取らず、単にコンソールに「Hello!」とログを出力します。
|
|
|
|
|
|
2. **`introduceYourself`という関数を作成**してください。この関数は`name`というパラメータを取り、「Hi, my name is [name]」のようなメッセージをコンソールにログ出力します。
|
|
|
|
|
|
### パート2: デフォルトパラメータを持つ関数
|
|
|
3. **`greetPerson`という関数を作成**してください。この関数は2つのパラメータを取ります: `name`(必須)と`greeting`(オプション、デフォルト値は"Hello")。この関数は「[greeting], [name]!」のようなメッセージをコンソールにログ出力します。
|
|
|
|
|
|
### パート3: 値を返す関数
|
|
|
4. **`addNumbers`という関数を作成**してください。この関数は2つのパラメータ(`num1`と`num2`)を取り、それらの合計を返します。
|
|
|
|
|
|
5. **`createFullName`という関数を作成**してください。この関数は`firstName`と`lastName`というパラメータを取り、フルネームを1つの文字列として返します。
|
|
|
|
|
|
### パート4: すべてを組み合わせる
|
|
|
6. **`calculateTip`という関数を作成**してください。この関数は2つのパラメータを取ります: `billAmount`(必須)と`tipPercentage`(オプション、デフォルト値は15)。この関数はチップの金額を計算して返します。
|
|
|
|
|
|
### パート5: 関数のテスト
|
|
|
各関数をテストするための関数呼び出しを追加し、結果を`console.log()`を使って表示してください。
|
|
|
|
|
|
**テスト呼び出しの例:**
|
|
|
```javascript
|
|
|
// Test your functions here
|
|
|
sayHello();
|
|
|
introduceYourself("Sarah");
|
|
|
greetPerson("Alex");
|
|
|
greetPerson("Maria", "Hi");
|
|
|
|
|
|
const sum = addNumbers(5, 3);
|
|
|
console.log(`The sum is: ${sum}`);
|
|
|
|
|
|
const fullName = createFullName("John", "Doe");
|
|
|
console.log(`Full name: ${fullName}`);
|
|
|
|
|
|
const tip = calculateTip(50);
|
|
|
console.log(`Tip for $50 bill: $${tip}`);
|
|
|
```
|
|
|
|
|
|
## 採点基準
|
|
|
|
|
|
| 評価基準 | 優秀 | 適切 | 改善が必要 |
|
|
|
| -------- | ---- | ---- | ---------- |
|
|
|
| **関数の作成** | 6つの関数すべてが正しく実装され、適切な構文と命名規則が守られている | 4~5つの関数が正しく実装されており、軽微な構文の問題がある | 3つ以下の関数が実装されている、または重大な構文エラーがある |
|
|
|
| **パラメータとデフォルト値** | 必須パラメータ、オプションパラメータ、デフォルト値が指定通り正しく使用されている | パラメータは正しく使用されているが、デフォルト値に問題がある場合がある | パラメータの実装が不正確または欠落している |
|
|
|
| **戻り値** | 戻り値が必要な関数は正しく値を返し、戻り値が不要な関数はアクションのみを実行している | 戻り値はほとんど正しいが、軽微な問題がある | 戻り値に重大な問題がある |
|
|
|
| **コードの品質** | きれいで整理されたコードで、意味のある変数名と適切なインデントがある | コードは動作するが、もう少し整理されるべき | コードが読みにくい、または構造が悪い |
|
|
|
| **テスト** | すべての関数が適切な関数呼び出しでテストされ、結果が明確に表示されている | ほとんどの関数が適切にテストされている | 関数のテストが限られている、または不正確 |
|
|
|
|
|
|
## ボーナスチャレンジ(オプション)
|
|
|
|
|
|
さらに挑戦したい場合は以下を試してください:
|
|
|
|
|
|
1. **1つの関数をアロー関数版で作成**する
|
|
|
2. **別の関数をパラメータとして受け取る関数を作成**する(レッスンで紹介した`setTimeout`の例のように)
|
|
|
3. **入力値のバリデーションを追加**して、関数が無効な入力を適切に処理できるようにする
|
|
|
|
|
|
---
|
|
|
|
|
|
> 💡 **ヒント**: ブラウザの開発者コンソール(F12)を開いて、`console.log()`ステートメントの出力を確認するのを忘れないでください!
|
|
|
|
|
|
---
|
|
|
|
|
|
**免責事項**:
|
|
|
この文書はAI翻訳サービス[Co-op Translator](https://github.com/Azure/co-op-translator)を使用して翻訳されています。正確性を追求しておりますが、自動翻訳には誤りや不正確な部分が含まれる可能性があります。元の言語で記載された文書を正式な情報源としてご参照ください。重要な情報については、専門の人間による翻訳を推奨します。この翻訳の使用に起因する誤解や誤解釈について、当社は責任を負いません。 |