TypeScript - 関数:初級者のガイド
こんにちは、未来のプログラマーたち!今日は、TypeScriptの関数の世界に楽しく飛び込んでみましょう。コードを書いたことがない人も心配しないでください - 私があなたの親切なガイドになり、ステップバイステップで進めます。このチュートリアルの終わりまでに、TypeScriptの関数で何ができるか驚かれることでしょう!
関数とは?
本題に入る前に、まず関数とは何かを理解しましょう。関数は再利用可能なレシピと考えてください。あなたがケーキを焼くためにレシピを従うように、関数はプログラム内で特定のタスクを実行するための指示セットです。
以下はTypeScriptの簡単な関数の例です:
function greet(name: string): string {
return `Hello, ${name}!`;
}
console.log(greet("Alice")); // 出力: Hello, Alice!
この例では、greet
が私たちの関数です。name
を受け取り、挨拶メッセージを返します。パラメータの後と括弧の後の: string
は、関数が文字列を受け取り、文字列を返すことを示しています。
オプションパラメータ
時々、パラメータをオプションにしたい場合があります。TypeScriptでは、パラメータ名の後ろに?
を追加することでこれを行うことができます。
function introduce(name: string, age?: number): string {
if (age) {
return `Hi, I'm ${name} and I'm ${age} years old.`;
} else {
return `Hi, I'm ${name}.`;
}
}
console.log(introduce("Bob")); // 出力: Hi, I'm Bob.
console.log(introduce("Charlie", 30)); // 出力: Hi, I'm Charlie and I'm 30 years old.
この関数では、age
はオプションです。提供された場合、それを自己紹介に含めます。提供されない場合、省略します。
リストパラメータ
リストパラメータを使用すると、配列として複数のパラメータを扱うことができます。まるで「あなたが提供する材料を全部使ってレシピを作る」と言うようなものです!
function makeShake(...fruits: string[]): string {
return `I made a shake with ${fruits.join(", ")}.`;
}
console.log(makeShake("banana")); // 出力: I made a shake with banana.
console.log(makeShake("strawberry", "mango", "kiwi")); // 出力: I made a shake with strawberry, mango, kiwi.
...fruits
の構文は、TypeScriptにすべての引数を配列fruits
にまとめてもらうことを指示します。
デフォルトパラメータ
デフォルトパラメータはバックアッププランのようなものです。誰かが値を提供しない場合、デフォルトの値を使用します。
function orderCoffee(size: string = "medium", type: string = "latte"): string {
return `You ordered a ${size} ${type}.`;
}
console.log(orderCoffee()); // 出力: You ordered a medium latte.
console.log(orderCoffee("large")); // 出力: You ordered a large latte.
console.log(orderCoffee("small", "espresso")); // 出力: You ordered a small espresso.
サイズやタイプを指定しない場合、デフォルトでミディアムサイズのラテとなります。非常に便利ですね!
匿名関数
匿名関数は秘密工作員のように、名前を持っていません。一度だけ使うためによく使われます。
let greet = function(name: string): string {
return `Hello, ${name}!`;
};
console.log(greet("David")); // 出力: Hello, David!
ここでは、匿名関数をgreet
という変数に割り当てています。その後、greet
を通常の関数のように使用できます。
関数コンストラクタ
関数コンストラクタは関数を動的に作成する方法です。まるで指示に基づいてタスクを実行するロボットを建造するようなものです。
let multiply = new Function('a', 'b', 'return a * b');
console.log(multiply(4, 5)); // 出力: 20
この例では、2つの数を乗算する関数を作成しています。最後の引数は常に関数本体であり、残りはパラメータ名です。
再帰とTypeScriptの関数
再帰は関数が自分自身を呼び出すときのことを指します。ロシアのマatrioshka人形のように、それぞれの人形の中に小さな自分自身が入っています。
function countdown(n: number): void {
if (n <= 0) {
console.log("Blast off!");
} else {
console.log(n);
countdown(n - 1);
}
}
countdown(3);
// 出力:
// 3
// 2
// 1
// Blast off!
この関数は指定された数から0までカウントダウンします。0に達するまで自分自身を呼び出し続けます。
ラムダ関数
ラムダ関数、またはアロー関数は、関数を書くための短い方法です。関数のテキスト abbreviationsのように思えます!
let add = (a: number, b: number): number => a + b;
console.log(add(3, 4)); // 出力: 7
このコンパクトな構文は特に短くてシンプルな関数に非常に便利です。
文法的な変化
TypeScriptは関数を定義するためのさまざまな方法を提供しています。以下の表に異なる構文をまとめます:
構文 | 例 |
---|---|
関数宣言 |
function greet(name: string): string { return Hello, ${name}!; }
|
関数式 |
let greet = function(name: string): string { return Hello, ${name}!; };
|
アロー関数 |
let greet = (name: string): string => Hello, ${name}!;
|
オブジェクト内のメソッド |
let obj = { greet(name: string): string { return Hello, ${name}!; } };
|
非同期関数 | async function fetchData(): Promise<void> { /* ... */ } |
関数オーバーロード
関数オーバーロードにより、同じ関数に対して複数の関数シグネチャを定義することができます。同じ料理に対して複数のレシピを持つようなものです。
function makeNoise(animal: "cat"): string;
function makeNoise(animal: "dog"): string;
function makeNoise(animal: string): string {
switch(animal) {
case "cat":
return "Meow";
case "dog":
return "Woof";
default:
return "Unknown animal";
}
}
console.log(makeNoise("cat")); // 出力: Meow
console.log(makeNoise("dog")); // 出力: Woof
この関数は異なる動物種に対して適切な鳴き声を発生させます。
そして、ここまででした!今日は多くの内容をカバーしました。基本的な関数から再帰や関数オーバーロードまでの概念です。コードを書くことは新しい言語を学ぶのと同じで、練習と忍耐が必要です。これらの概念を試してみて、自分で関数を作成してみてください。すぐに複雑なプログラムを簡単に書けるようになるでしょう。ハッピーコーディング、次のレッスンでお会いしましょう!
Credits: Image by storyset