TypeScriptの関数 のバックアップソース(No.2) :: NJF Wiki

• 差分^[1] を表示
• 現在との差分^[2] を表示
• バックアップ No.2 を復元して編集^[3]
• TypeScriptの関数^[4] へ行く。

[[公式ページ:http://www.typescriptlang.org/Handbook]]も参照のこと。

*関数定義 [#v50d750e]
TypeScriptの関数定義はJavaScriptと同様で型が指定できるだけである。

 function testFunc(x:number,y:number):number{
     return x + y;
 }

 console.log(testFunc(2,4)); // => 6

*関数型 [#ue8e9075]
無名関数を変数に入れるときには注意が必要となる。

 var testFunc = function(x:number,y:number):number{
     return x + y;
 }

 testFunc = function(x:number,y:number,z:number):number{ //エラー
     return x + y + z;
 }

ここで2度目の代入でエラーとなるのは、一度目の代入の型推論で、testFuncは二つのnumber型引数とnumber型戻り値を持つ型と判断されるためである。つまり、TypeScriptは引数や戻り値まで区別した関数の型を持つ。

そのような関数の型を明示することもできる。

 var testFunc:(x:number,y:number)=>number = function(x:number,y:number):number{
     return x + y;
 }

 var test2Func:(x:number,y:number,z:number)=>number;

 test2Func = function(x:number,y:number,z:number):number{
     return x + y + z;
 }

これで無名関数をより厳密に扱うことができる。

また、このように明示的に関数の型を扱うときには、右辺の型は省略できる。
 var testFunc:(x:number,y:number)=>number = function(x,y){
     return x + y;
 }

*オプション引数とデフォルト引数 [#cf68938f]

関数の引数に「?」をつけると引数の数を変えられるオプション引数にできる。

 function testFunc(x:number,y?:number){
     if(y){
         return x + y;
     }
     return x;
 }

 console.log(testFunc(1)); // => 1
 console.log(testFunc(1,2)); // => 3

引数に「=」をつけるとデフォルト引数が指定できる。

 function testFunc(x:number,y:number = 10){
     return x + y;
 }

 console.log(testFunc(1)); // => 11
 console.log(testFunc(1,2)); // => 3

*可変引数 [#mcb8cf90]

「...」（ドット３つ）で引数の数を変更できる可変引数も使える。

 function testFunc(...a:string[]):string{
     return a.join(",");
 }

 console.log(testFunc("one","two","three","four")) // => one,two,three,four

*ラムダ式とthis [#medb6995]

ラムダ式は「=>」で定義する

 console.log(((x:number,y:number)=>{return x + y;})(1,2)); // => 3

ラムダ式は「this」の扱いがより直観的になるというメリットがある。まず、

 var wrapper = {
   x:2,
   whatisx:function () {
       return function(){
           return this.x;
       }
   }
  };

 var w = wrapper.whatisx();

 console.log(w()); // => undefined

すると実行結果は「undefined」となる。これは実行時に「this」が定義時と異なるからである。これを

 var wrapper = {
   x:2,
   whatisx:function () {
       return () => {
           return this.x;
       }
   }
 };

 var w = wrapper.whatisx();

 console.log(w()); // => 2

こちらは直感通り「2」となる。

*オーバーライド [#da6d0324]

関数の定義を並べるとオーバーライドも可能。

 function testFunc(x:number):number;
 function testFunc(x:string):string;

 function testFunc(x:any):any{
     if(typeof x == "number"){
         return x;
     }else if(typeof x == "string"){
         return "string:" + x;
     }
 }

 console.log(testFunc(2)); // => 2
 console.log(testFunc("test")); // => "string:test"
 testFunc(true); // => エラー

• TypeScriptの関数 のバックアップ一覧^[7]
• TypeScriptの関数 のバックアップソース(No. All)
  • 1: 2016-03-18 (金) 13:29:54^[8] njf^[9]
  • 2: 2016-03-18 (金) 16:04:21 njf^[9]
  • 現: 2016-03-19 (土) 11:54:06^[10] njf^[9]