2019/10/24TypeScriptを学ぶ ジェネリックとクラス関連
TypeScriptを学ぶ 型定義の基礎の続きです。 クラス関連の機能が主な内容です。
TypeScriptの基礎的なことを学ぶので、忘れないように残していきます。 目標としては自分が作っているReactNative製のアプリや、Gatsbyを利用しているこのブログに活かしていく予定です。
概要
- ジェネリック
- インターフェイスの実装
- クラス
- 名前空間の利用
ジェネリック
プログラミングの際には型が決められない、関数実行時にはデータ型が決まっている。 anyでもいいけども、例えば「引数と戻り値の型は一致してほしい」となどの場合に動的に任意のデータ型を指定する仕組み
// <T>の形式で指定、T以外の任意の文字でも良い
function getData<T>( value : T ) : T {
処理
}
// 関数呼び出しの際にデータ型numberで指定
data1 = getData<number>(1);
// データ型booleanで利用
data2 = getData<boolean>(true);クラスでのジェネリック
クラスでもジェネリックは利用可能
// class クラス名<T> {
// プロパティ名 : T ;
// メソッド名 ( 引数名:T ): T {
// 処理
// }
// }
// let 変数名 = new クラス名<データ型>();複数定義して交差型も可能
function getData<T,U>( value : T , param : U ) : T & U {
処理
}非同期処理のジェネリック
Promiseを返す非同期処理の返り値にも型を定義可能。 resolveで返される戻り値のデータ型を定義する。
// function 非同期関数名 (引数) {
// return new Promise<データ型>((resolve,reject) => {
// 非同期実行文
// if ( 条件 ) {
// resolve(戻り値);
// }else{
// reject(エラー);
// }
// });
// }
// async function Exec(){
// let data1 = await 非同期関数名(引数1)
// let data2 = await 非同期関数名(引数2)
// }インターフェイスの実装
クラスのデータ型のみを定義できる。クラスに持たせるプロパティとメソッドの組み合わせに名前とデータ型を定義できます。 異なる処理を共通のインターフェースとして取扱いやすくする仕組。
// インターフェイスの定義
// interface インターフェイス名{
// プロパティ:データ型;
// メソッド(引数:引数のデータ型): 戻り値のデータ型;
// }
// インターフェイスの実装
// let 変数名 : インターフェイス名;
// function 関数名(引数: インターフェイス名) {};
// クラスで実装
// class クラス名 implemets インターフェイス名 {
// プロパティ名:データ型;
//
// メソッド(引数:引数のデータ型):戻り値のデータ型 {
// 処理
// }
// }
// 複数のインターフェイスを実装
// class クラス implemets インターフェイス1,インターフェイス2 {}インターフェイスも継承できる
クラスのようにインターフェイスも継承して定義することが出来ます。 元の定義を引き継ぐことが出来ます
// interface インターフェイス1 extends インターフェイス2{
// プロパティ: データ型;
// }クラス
abstract クラス
abstructが指定されたクラスは継承可能だが、そのままnewでオブジェクトを作成できません。 メソッドのみ実装していて、プロパティは継承先で実装する時などにりようできます。
abstruct class Name {
}
// 以下はエラー
let data = new Name();メソッドのオーバーライド
jsとは異なり引数などのチェックが入ります。継承したメソッドをオーバーライドする場合は、元のメソッドと同じ名前、引数、戻り値のデータ型が一致しないとオーバーライドできない。
保護 public privete protected
他の言語では利用できる機能です。
- publicがクラスの外でも利用が可能
- privateとprotected はクラスの外から利用不可
- protectedは継承したクラスで利用可能
- privateは継承したクラスでも利用不可
読み取り専用readonly
クラスのプロパティを参照できるが、変更できないようにする。 コンストラクターでの初期化以外では値の変更を受け付けない。
// public readonly プロパティ: データ型;名前空間の利用
export などで使われているもの。別の名前空間に分けることで同じ名前のクラスを定義できる。 名前空間外から利用するためにexportの指定が必要。
// namespace 名前空間 {
// export class クラス名{}
// }
// namespace 名前空間2 {
// export class クラス名{}
// }名前空間を別ファイルから利用する
名前空間の前にexportを指定します。
// export namespace 名前空間 {
// export class クラス名 {}
// }ほかファイルからの参照
// import * as 参照名 from "./ファイル"
// import {名前空間} from "./ファイル"おわりに
クラス関連の便利な機能を学びました。他の言語では普通に使えたりするものが多く、これらが利用できるように成るTypeScriptはとても便利なように思います。 ほかの言語からの移行などもやりやすくなりそうです。
基本的にはビルド時にチェックされエラーが出るというものです。エラーを無視してデプロイすれば、保護を無視して実行できるようなものが多いので注意が必要です。
他にも機能があるので、少しずつ読み進めていこうと思います。
https://www.typescriptlang.org/
