ページへ戻る

− Links

 印刷 

TypeScriptのジェネリック :: NJF Wiki

xpwiki:TypeScriptのジェネリック
ページ内コンテンツ
  • ジェネリックの概要
  • ジェネリックの型
  • クラス定義でのジェネリック
  • ジェネリックを継承で制限

ジェネリックの概要 anchor.png[1] Edit [2]

ジェネリックとは型の変数のような物。総称型、パラメタ付型などとも呼ばれる。 たとえば引数と戻り値の関数を考える。number型なら、

function testFunction(n:number):number{
    return n;
}

となる。

引数と戻り値が同じという条件のみ課したいが、

function testFunction(n:any):any{
    return n;
}

としてしまうとそうはならない。

そこで、ジェネリックを使う。

function testFunction<T>(n:T):T{
    return n;
}

使うときは、「<T>」の部分に型を入れる。

console.log(testFunction<number>(2)); // => 2
console.log(testFunction<string>("string")); // => string

つまり、あたかも型を変数のように扱っている。

この例だとあまりありがたみが無い。しかし、次のようにたとえば配列の三番目（つまり添え字が2）の要素を返す関数を考えてみると利点がわかる。

function getThird<T>(n:T[]):T{
    return n[2];
}

console.log(getThird<number>([1,2,3,4])); // => 3
console.log(getThird<string>(["one","two","three","four"])); // => three

このような配列の要素を返したり、引数の配列を返したりする場合には、ジェネリックは任意の型に対して整合性をチェックできる。

二つ以上のジェネリックを定義するときは、「<>」の中にコンマ区切りで列記する

function testFunc<U,T>(U,T):U{
    //何か処理
}
Page Top

ジェネリックの型 anchor.png[3] Edit [4]

型定義にもジェネリックは使える。

var func: <T>(n: T[])=>T = getThird;

こちらの書き方でも良い。

var func: {<T>(n: T[]):T} = getThird;

インターフェイスにも利用できる。

interface GenericGetThird {
    <T>(n: T[]):T;
}
Page Top

クラス定義でのジェネリック anchor.png[5] Edit [6]

クラス定義でもジェネリックは利用できる。

class TestClass<T>{
    x:T;
    concat(x:T,y:T):T[]{
        this.x = x;
        return [x,y];
    }
}
var numCat:TestClass<number> = new TestClass<number>();
var strCat:TestClass<string> = new TestClass<string>();

console.log(numCat.concat(1,2));// => [1,2]
console.log(numCat.x);// => 1
console.log(strCat.concat("one","two"));// => ["one","two"]
console.log(strCat.x);// => "one"

console.log(strCat.concat(1,2));//エラー
Page Top

ジェネリックを継承で制限 anchor.png[7] Edit [8] 

<T extends BaseClass>

と書くとTはBaseClass編集[9]を継承した物で無ければエラーが出る。

Last-modified: 2016-03-19 (土) 08:28:32 (JST) (2953d) by njf
ページ別名: 未設定
ページ作成: njf
サイト管理: njf

Links list

(This host) = https://njf.jp

  1. (This host)/cms/modules/xpwiki/?TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF#raf578a5
  2. (This host)/cms/modules/xpwiki/?cmd=edit&page=TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF&paraid=raf578a5
  3. (This host)/cms/modules/xpwiki/?TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF#rd25308b
  4. (This host)/cms/modules/xpwiki/?cmd=edit&page=TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF&paraid=rd25308b
  5. (This host)/cms/modules/xpwiki/?TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF#f6c4b07e
  6. (This host)/cms/modules/xpwiki/?cmd=edit&page=TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF&paraid=f6c4b07e
  7. (This host)/cms/modules/xpwiki/?TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF#o334a46a
  8. (This host)/cms/modules/xpwiki/?cmd=edit&page=TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF&paraid=o334a46a
  9. (This host)/cms/modules/xpwiki/?cmd=edit&page=BaseClass&refer=TypeScript%E3%81%AE%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%83%83%E3%82%AF