Typescript-functions

提供：Dev Guides
移動先:案内、検索

TypeScript-関数

関数は、読み取り可能、保守可能、および再利用可能なコードの構成要素です。 関数は、特定のタスクを実行するための一連のステートメントです。 関数は、プログラムをコードの論理ブロックに編成します。 定義すると、コードにアクセスするために関数を呼び出すことができます。 これにより、コードが再利用可能になります。 さらに、関数を使用すると、プログラムのコードの読み取りと保守が簡単になります。

関数宣言は、関数の名前、戻り値の型、およびパラメーターについてコンパイラーに通知します。 関数定義は、関数の実際の本体を提供します。

Sr.No Funtions & Description
1.

Defining a Function

関数定義は、特定のタスクの実行内容と方法を指定します。

2.

Calling a Function

関数を実行するには、関数を呼び出す必要があります。

3.

Returning Functions

関数は、制御とともに値を呼び出し元に戻すこともできます。

4.

Parameterized Function

パラメータは、値を関数に渡すメカニズムです。

オプションのパラメータ

オプションのパラメーターは、関数の実行のために引数を強制的に渡す必要がない場合に使用できます。 パラメータには、名前に疑問符を追加することにより、オプションとしてマークできます。 オプションのパラメーターは、関数の最後の引数として設定する必要があります。 オプションのパラメータを持つ関数を宣言するための構文は以下のとおりです- 

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","mary@xyz.com");
  • 上記の例では、パラメーター化された関数を宣言しています。 ここで、3番目のパラメーター、つまりmail_idはオプションのパラメーターです。
  • 関数呼び出し中にオプションのパラメーターに値が渡されない場合、パラメーターの値は未定義に設定されます。
  • この関数は、引数に値が渡された場合にのみ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", "mary@xyz.com");

上記のコードは、次の出力を生成します- 

ID:123
Name John
ID: 111
Name  mary
Email Id mary@xyz.com

レストパラメーター

レストパラメータは、Javaの変数引数に似ています。 残りのパラメーターは、関数に渡すことができる値の数を制限しません。 ただし、渡される値はすべて同じタイプでなければなりません。 つまり、残りのパラメーターは、同じ型の複数の引数のプレースホルダーとして機能します。

残りのパラメーターを宣言するには、パラメーター名の前に3つのピリオドを付けます。 残りのパラメータは、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つの残りのパラメーターを持つことができます。
  • 関数は、それぞれ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) {
}

注-パラメータをオプションとデフォルトで同時に宣言することはできません。

例：デフォルトのパラメーター

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つのパラメーターがあります。
  • パラメーター_rate_の値は、デフォルトで_0.50_に設定されています。
  • プログラムは関数を呼び出し、パラメーターpriceの値のみを渡します。 ここで、rate_の値は_0.50（デフォルト）です
  • 同じ関数が呼び出されますが、2つの引数があります。 _rate_のデフォルト値は上書きされ、明示的に渡された値に設定されます。

無名関数

識別子（関数名）にバインドされていない関数は、*匿名関数*と呼ばれます。 これらの関数は、実行時に動的に宣言されます。 無名関数は、標準関数と同様に、入力を受け入れて出力を返すことができます。 通常、匿名関数は最初の作成後はアクセスできません。

変数には匿名関数を割り当てることができます。 このような式は関数式と呼ばれます。

構文

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は、プログラミングにおける匿名関数を指します。 Lambda関数は、匿名関数を表す簡潔なメカニズムです。 これらの関数は、*矢印関数*とも呼ばれます。

ラムダ関数-解剖学

ラムダ関数には3つの部分があります-

  • パラメータ-関数はオプションでパラメータを持つことができます
  • 太い矢印表記/ラムダ表記（⇒）-行き先演算子としても呼び出されます
  • ステートメント-関数の命令セットを表します

ヒント-慣例により、コンパクトで正確な関数宣言のために、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

構文のバリエーション

パラメータタイプ推論

パラメーターのデータ型を指定することは必須ではありません。 このような場合、パラメーターのデータ型はanyです。 私たちは次のコードスニペットを見てみましょう- 

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の関数をオーバーロードするには、以下の手順に従う必要があります-

  • ステップ1 *-同じ名前で異なる関数シグネチャを持つ複数の関数を宣言します。 関数のシグネチャには次のものが含まれます。
  • パラメータのデータ型
function disp(string):void;
function disp(number):void;
  • パラメーターの数
function disp(n1:number):void;
function disp(x:number,y:number):void;
  • パラメータのシーケンス
function disp(n1:number,s1:string):void;
function disp(s:string,n:number):void;

注-関数のシグネチャには、関数の戻り値の型は含まれません。

ステップ2 *-宣言の後に関数定義を続ける必要があります。 パラメータタイプは、オーバーロード中にパラメータタイプが異なる場合は、 *any に設定する必要があります。 さらに、上記で説明した case b の場合、関数定義中に1つ以上のパラメーターをオプションとしてマークすることを検討できます。

  • ステップ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つのオーバーロードがあります-
  • 単一の文字列パラメーターを受け入れる関数。
  • 型番号と文字列の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
「https://www.finddevguides.com/index.php?title=Typescript-functions&oldid=14724」から取得
Powered by MediaWiki