TypeScript-関数
関数は、読み取り可能、保守可能、および再利用可能なコードの構成要素です。関数は、特定のタスクを実行するための一連のステートメントです。関数は、プログラムをコードの論理ブロックに編成します。定義すると、関数を呼び出してコードにアクセスできます。これにより、コードが再利用可能になります。さらに、関数を使用すると、プログラムのコードを簡単に読み取って保守できます。
関数宣言は、関数の名前、戻り値の型、およびパラメーターについてコンパイラーに通知します。関数定義は、関数の実際の本体を提供します。
| シニア番号 | 機能と説明 |
|---|---|
| 1.1。 | 関数の定義 関数定義は、特定のタスクが実行される内容と方法を指定します。 |
| 2.2。 | 関数の呼び出し 関数を実行するには、関数を呼び出す必要があります。 |
| 3.3。 | 関数を返す 関数は、制御とともに値を呼び出し元に返すこともできます。 |
| 4.4。 | パラメータ化された関数 パラメータは、関数に値を渡すメカニズムです。 |
オプションのパラメータ
関数の実行のために引数を強制的に渡す必要がない場合は、オプションのパラメーターを使用できます。パラメータの名前に疑問符を追加することで、パラメータをオプションとしてマークできます。オプションのパラメータは、関数の最後の引数として設定する必要があります。オプションのパラメータで関数を宣言する構文は次のとおりです。
function function_name (param1[:type], param2[:type], param3[:type])例：オプションのパラメータ
function disp_details(id:number,name:string,mail_id?:string) {
console.log("ID:", id);
console.log("Name",name);
if(mail_id!=undefined)
console.log("Email Id",mail_id);
}
disp_details(123,"John");
disp_details(111,"mary","[email protected]");上記の例では、パラメーター化された関数を宣言しています。ここで、3番目のパラメーター、つまりmail_idはオプションのパラメーターです。
関数呼び出し中にオプションのパラメーターに値が渡されない場合、パラメーターの値はundefinedに設定されます。
この関数は、引数に値が渡された場合にのみmail_idの値を出力します。
コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
function disp_details(id, name, mail_id) {
console.log("ID:", id);
console.log("Name", name);
if (mail_id != undefined)
console.log("Email Id", mail_id);
}
disp_details(123, "John");
disp_details(111, "mary", "[email protected]");上記のコードは次の出力を生成します-
ID:123
Name John
ID: 111
Name mary
Email Id [email protected]残りのパラメーター
残りのパラメーターは、Javaの変数引数に似ています。Restパラメーターは、関数に渡すことができる値の数を制限しません。ただし、渡される値はすべて同じタイプである必要があります。つまり、restパラメーターは、同じタイプの複数の引数のプレースホルダーとして機能します。
残りのパラメーターを宣言するには、パラメーター名の前に3つのピリオドを付けます。非restパラメーターは、restパラメーターの前に配置する必要があります。
例：RESTパラメーター
function addNumbers(...nums:number[]) {
var i;
var sum:number = 0;
for(i = 0;i<nums.length;i++) {
sum = sum + nums[i];
}
console.log("sum of the numbers",sum)
}
addNumbers(1,2,3)
addNumbers(10,10,10,10,10)関数addNumbers（）宣言は、残りのパラメータの受け入れNUMSを。残りのパラメーターのデータ型は配列に設定する必要があります。さらに、関数は最大で1つのrestパラメーターを持つことができます。
この関数は、それぞれ3つと6つの値を渡すことにより、2回呼び出されます。
forループは引数リストを反復処理し、関数に渡してそれらの合計を計算します。
コンパイル時に、次のJavaScriptコードが生成されます-
function addNumbers() {
var nums = [];
for (var _i = 0; _i < arguments.length; _i++) {
nums[_i - 0] = arguments[_i];
}
var i;
var sum = 0;
for (i = 0; i < nums.length; i++) {
sum = sum + nums[i];
}
console.log("sum of the numbers", sum);
}
addNumbers(1, 2, 3);
addNumbers(10, 10, 10, 10, 10);上記のコードの出力は次のとおりです-
sum of numbers 6
sum of numbers 50デフォルトパラメータ
関数パラメーターには、デフォルトで値を割り当てることもできます。ただし、このようなパラメーターには、明示的に値を渡すこともできます。
構文
function function_name(param1[:type],param2[:type] = default_value) {
}Note −パラメータをオプションとして宣言すると同時にデフォルトとして宣言することはできません。
例：デフォルトパラメータ
function calculate_discount(price:number,rate:number = 0.50) {
var discount = price * rate;
console.log("Discount Amount: ",discount);
}
calculate_discount(1000)
calculate_discount(1000,0.30)コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
function calculate_discount(price, rate) {
if (rate === void 0) { rate = 0.50; }
var discount = price * rate;
console.log("Discount Amount: ", discount);
}
calculate_discount(1000);
calculate_discount(1000, 0.30);その出力は次のとおりです-
Discount amount : 500
Discount amount : 300この例では、関数calculate_discountを宣言しています。この関数には、価格とレートの2つのパラメーターがあります。
パラメータレートの値は、デフォルトで0.50に設定されています。
プログラムは関数を呼び出し、パラメーターpriceの値のみを関数に渡します。ここで、rateの値は0.50（デフォルト）です。
同じ関数が呼び出されますが、2つの引数があります。レートのデフォルト値は上書きされ、明示的に渡された値に設定されます。
匿名関数
識別子（関数名）にバインドされていない関数は、次のように呼び出されます。 anonymous functions。これらの関数は、実行時に動的に宣言されます。匿名関数は、標準関数と同じように、入力を受け入れて出力を返すことができます。通常、匿名関数は最初の作成後にアクセスできません。
変数には無名関数を割り当てることができます。このような式を関数式と呼びます。
構文
var res = function( [arguments] ) { ... }例─単純な無名関数
var msg = function() {
return "hello world";
}
console.log(msg())コンパイル時に、JavaScriptで同じコードが生成されます。
次の出力が生成されます-
hello world例─パラメーターを使用した無名関数
var res = function(a:number,b:number) {
return a*b;
};
console.log(res(12,2))匿名関数は、渡された値の積を返します。
コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
var res = function (a, b) {
return a * b;
};
console.log(res(12, 2));上記のコードの出力は次のとおりです-
24関数式と関数宣言─それらは同義ですか？
関数式と関数宣言は同義ではありません。関数式とは異なり、関数宣言は関数名によってバインドされます。
2つの基本的な違いは、関数宣言は実行前に解析されることです。一方、関数式は、スクリプトエンジンが実行中に検出した場合にのみ解析されます。
JavaScriptパーサーは、メインコードフローで関数を検出すると、関数宣言を想定します。関数がステートメントの一部として提供される場合、それは関数式です。
関数コンストラクター
TypeScriptは、Function（）と呼ばれる組み込みのJavaScriptコンストラクターを使用した関数の定義もサポートしています。
構文
var res = new Function( [arguments] ) { ... }.例
var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);
console.log(x);新しいFunction（）はコンストラクターの呼び出しであり、コンストラクターは関数参照を作成して返します。
コンパイル時に、JavaScriptで同じコードが生成されます。
上記のサンプルコードの出力は次のとおりです。
12再帰関数とTypeScript関数
再帰は、結果に到達するまで関数呼び出しを繰り返し実行することにより、操作を反復処理する手法です。再帰は、ループ内から異なるパラメーターを使用して同じ関数を繰り返し呼び出す必要がある場合に最適です。
例–再帰
function factorial(number) {
if (number <= 0) { // termination case
return 1;
} else {
return (number * factorial(number - 1)); // function invokes itself
}
};
console.log(factorial(6)); // outputs 720コンパイル時に、JavaScriptで同じコードが生成されます。
これがその出力です-
720例：匿名再帰関数
(function () {
var x = "Hello!!";
console.log(x)
})() // the function invokes itself using a pair of parentheses ()コンパイル時に、JavaScriptで同じコードが生成されます。
その出力は次のとおりです-
Hello!!ラムダ関数
Lambdaは、プログラミングにおける無名関数を指します。ラムダ関数は、無名関数を表す簡潔なメカニズムです。これらの関数は、Arrow functions。
ラムダ関数-解剖学
ラムダ関数には3つの部分があります-
Parameters −関数はオプションでパラメータを持つことができます
The fat arrow notation/lambda notation (=>) −これはgoesto演算子とも呼ばれます
Statements −関数の命令セットを表します
Tip −慣例により、コンパクトで正確な関数宣言のために、1文字のパラメーターの使用が推奨されます。
ラムダ式
これは、1行のコードを指す無名関数式です。その構文は次のとおりです-
( [param1, parma2,…param n] )=>statement;例：ラムダ式
var foo = (x:number)=>10 + x
console.log(foo(100)) //outputs 110プログラムはラムダ式関数を宣言します。この関数は、渡された引数と10の合計を返します。
コンパイル時に、次のJavaScriptコードが生成されます。
//Generated by typescript 1.8.10
var foo = function (x) { return 10 + x; };
console.log(foo(100)); //outputs 110上記のコードの出力は次のとおりです-
110ラムダステートメント
Lambdaステートメントは、コードのブロックを指す無名関数宣言です。この構文は、関数本体が複数行にまたがる場合に使用されます。その構文は次のとおりです-
( [param1, parma2,…param n] )=> {
//code block
}例：Lambdaステートメント
var foo = (x:number)=> {
x = 10 + x
console.log(x)
}
foo(100)関数の参照が返され、変数に格納されます foo。
コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
var foo = function (x) {
x = 10 + x;
console.log(x);
};
foo(100);上記のプログラムの出力は次のとおりです。
110構文のバリエーション
パラメータタイプ推論
パラメータのデータ型を指定する必要はありません。このような場合、パラメータのデータ型は任意です。次のコードスニペットを見てみましょう-
var func = (x)=> {
if(typeof x=="number") {
console.log(x+" is numeric")
} else if(typeof x=="string") {
console.log(x+" is a string")
}
}
func(12)
func("Tom")コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
var func = function (x) {
if (typeof x == "number") {
console.log(x + " is numeric");
} else if (typeof x == "string") {
console.log(x + " is a string");
}
};
func(12);
func("Tom");その出力は次のとおりです-
12 is numeric
Tom is a string単一パラメーターのオプションの括弧
var display = x=> {
console.log("The function got "+x)
}
display(12)コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
var display = function (x) {
console.log("The function got " + x);
};
display(12);その出力は次のとおりです-
The function got 12単一ステートメントの場合はオプションの中括弧、パラメーターなしの場合は空の括弧
次の例は、これら2つの構文上のバリエーションを示しています。
var disp =()=> {
console.log("Function invoked");
}
disp();コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
var disp = function () {
console.log("Function invoked");
};
disp();その出力は次のとおりです-
Function invoked関数の過負荷
関数には、提供された入力に基づいて異なる動作をする機能があります。言い換えると、プログラムは、実装が異なる同じ名前の複数のメソッドを持つことができます。このメカニズムは、関数のオーバーロードと呼ばれます。TypeScriptは、関数のオーバーロードをサポートします。
TypeScriptで関数をオーバーロードするには、以下の手順に従う必要があります-
Step 1−名前は同じで、関数のシグネチャが異なる複数の関数を宣言します。関数シグネチャには次のものが含まれます。
The data type of the parameter
function disp(string):void;
function disp(number):void;The number of parameters
function disp(n1:number):void;
function disp(x:number,y:number):void;The sequence of parameters
function disp(n1:number,s1:string):void;
function disp(s:string,n:number):void;Note −関数のシグネチャには、関数の戻り値の型が含まれていません。
Step 2−宣言の後に関数定義を続ける必要があります。パラメータタイプは次のように設定する必要がありますany過負荷時にパラメータタイプが異なる場合。さらに、case b 上で説明したように、関数定義中に1つ以上のパラメーターをオプションとしてマークすることを検討できます。
Step 3 −最後に、関数を呼び出して機能させる必要があります。
例
次のサンプルコードを見てみましょう-
function disp(s1:string):void;
function disp(n1:number,s1:string):void;
function disp(x:any,y?:any):void {
console.log(x);
console.log(y);
}
disp("abc")
disp(1,"xyz");最初の2行は、関数のオーバーロード宣言を示しています。関数には2つのオーバーロードがあります-
単一の文字列パラメータを受け入れる関数。
タイプnumberとstringの2つの値をそれぞれ受け入れる関数。
3行目は関数を定義します。パラメータのデータ型は次のように設定されますany。さらに、2番目のパラメーターはここではオプションです。
オーバーロードされた関数は、最後の2つのステートメントによって呼び出されます。
コンパイル時に、次のJavaScriptコードが生成されます-
//Generated by typescript 1.8.10
function disp(x, y) {
console.log(x);
console.log(y);
}
disp("abc");
disp(1, "xyz");上記のコードは次の出力を生成します-
abc
1
xyz