最近、会社はエレクトロンが作ったデスクトップ・プロジェクトを引き継ぐように依頼しました！
定義
Typescript (以下 ts) は、ES7 をカバーするために新しい使用規則を追加した JavaScript のスーパーセットです。主な目的は JavaScript の使用を制限することです。
インストールとコンパイル
ts環境では、nodeを使用し、tsをグローバルにインストールしてください。
この時点で、tscを使って対象のtsファイルをjsにコンパイルすることができます。
VsCodeを使っている方は
tsc-init
でtsconfig.jsonファイルを生成し、outDirに出力ディレクトリを設定します。
最後に、ctrl+shift+bを使い、tsconfig.jsonを動的コンパイルのために監視することを選択します。
データ型
tsでは、属性名の後に : を付けて型を修飾します。
//
let boo: boolean = true
//
let num: number = 12.3
//
let str: string = 'string'
上記の3種類はjsとあまり変わらないので、詳しくは書きません。
配列
tsの配列はjsと異なり、配列のメンバの型を修飾します。
宣言には2つの方法があります。
最初の要素タイプの後には[]が続きます。
let list: number[] = [1, 2, 3];
つ目の方法は、配列ジェネリックであるArray<元素类型>
let list: Array<number> = [1, 2, 3];
タプル
メンバの数と型が限定された配列。
let x: [string, number] = ['hello', 10]
// let x: [string, number] = [10, 'hello'] // 型エラーが報告され、設定できる順序に制限があることを示す。
列挙
enum 型は、配列のクラスにわかりやすい名前を追加するために使用します。
enum Info { success = 1, error = -1 }
var f: Info = Info.success // 名前で値を取得する
var n: string = Info[1] // 名前は、値によって得ることができる
console.log(f) // 1
console.log(n) // success
デフォルトで値が割り当てられていない場合、要素には自動的に0から始まる値が割り当てられます。
enum Info { success, error }
console.log(Info.success) // 0
console.log(Info.error) // 1
もちろん開始値を指定することもでき、指定した値から開始されます。
enum Info { success = 1, error, normal }
console.log(Info.success) // 1
console.log(Info.error) // 2
console.log(Info.normal) // 3
// の途中で値を指定することも可能である。
enum Info { success, error = 3, normal }
console.log(Info.success) // 0
console.log(Info.error) // 3
console.log(Info.normal) // 4
// ただし、数値以外の値の場合は、手動で指定する必要がある。
// enum Info { success, error = 'error', normal } // 列挙メンバは、初期化式を持たなければならない。
enum Info { success, error = 'error', normal = "normal" }
console.log(Info.success) // 0
console.log(Info.error) // error
console.log(Info.normal) // normal
Any
型が特定できない場合は、any を使用して変数をマークすることができます。
var anyitem:any = 123
anyitem = 'str'
anyitem = true
Void
void型はanyの反対で、型がないことを意味します。
返り値のない関数では、しばしばvoidフラグが使われます。
// function fun(): number { // その宣言された型が"void" "any" 型をチェックしない関数は、値を返さなければならない。
// console.log('none')
// }
function fun(): void { //
console.log('none')
}
function fun(): any { // ここで任意のものを使用することは可能であるが、上記のように、これをあまり頻繁に使用することは推奨されない、なぜならそうするとtsの特徴的な型制限はほとんど無効になるからである。
console.log('none')
}
Null および未定義
tsでnullとundefinedの分類を分け、型制限を追加するだけ。
これらはすべての型のサブクラスであるため、他のすべての型はnullやundefinedを代入することができます。
let u: undefined = undefined;
let n: null = null;
let s1: string = null
let s2: string = undefined
strictNullChecksフラグを指定すると、nullとundefinedは他の型のサブクラスではなくなります。
この場合、nullとundefinedはvoidとそれぞれの値にのみ代入することができ、文字列、null、undefinedを渡す必要があるパラメータについては、ユニオン型を使用することができます。
let s: string | null | undefined = undefined
Never
は存在しないタイプの値を表します。
は任意の型のサブタイプであり、任意の型に代入することもできます。
しかし、neverのサブタイプである型や、never型に代入できる型はありません。 anyであってもneverに割り当てることはできません。
例外または無限ループをスローする関数の戻り値。
// 例外を投げるために使用される
function error(message: string): never {
throw new Error(message);
}
// または無限ループ
function infiniteLoop(): never {
while (true) {
}
}
Object
オブジェクトは非原始型、つまり数値、文字列、ブーリアン、シンボル、null、undefined 以外の型を表します。これは、より低レベルの型と等価です。
function object(o: object): void {
console.log(o)
};
object({ prop: 0 }); // OK
// しかし、テストしてみたところ、nullやundefinedでもエラーなく動作したので、回答を期待している。
object(null); // OK
object(undefined); // OK
object(42); // Error
object("string"); // Error
object(false); // Error
let sym = Symbol("key");
object(sym); // Error
型の推論
宣言と代入が同じ行にある場合、tsは型を推測するので、型の宣言を省略することができます。
let str: string = 'string'
//
let str = 'string'
共同型
変数にはいくつかの種類があります。
let a: string | number
a = 123
a = 'string'
型アサーション
型が設定されると、tsは、その型がライタによってチェックされたと仮定します。 型チェックは行われません。
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
// TypeScriptでJSXを使用する場合、as構文アサーションのみが許可される。 そのため、asを使うことが推奨されている。
let strLength: number = (someValue as string).length;
