基本タイプ

🔹String

JSの文字列

let str = 'hello';

TSの文字列

let str: string = 'hello'; 

TIP
以上のように、:を用いてJavaScriptコードにタイプを定義する方式をタイプタグ(Type Annotation)と呼ぶ.

🔹 Number

let num: number = 10;

🔹 Array

配列タイプで、数字しか入れません.

let arr: Array<number> = [1,2,3];
let items: number[] = [1,2,3];

は配列タイプで、文字のみ入力できます.

let arrStr: Array<string> = ['one','two','three'];
let items: string[] = ['one','two','three'];

指定したタイプと異なる場合は、エラーが表示されます.

🔹 Tuple

let address: [string,number] = ['gangnam',100];

は、すべてのインデックスのタイプを決定します.

未定義のタイプ、インデックスでアクセスするとエラーが発生します.

🔹 Object

let obj: object = {}

// 튜플로 작성하기
let person: {name:string, age:number} = {
  name: 'young',
  age:26
}

変数名にフーバーマウスを付けたときに定義されたタイプを教えてあげます.

🔹 Boolean

let show: boolean = true;

🔹 Any

は、すべてのタイプに対して許可されています.

let str: any = 'hi';
let num: any = 10;
let arr: any = ['a',2, true]

2020.11.16を追加

🔹 Void

変数にはundefinedとnullしか割り当てられず、関数は戻り値を設定できません.

let unuseful: void = undefined;
function notuse(): void {
  console.log('sth');
}

2020.11.16を追加

🔹 Enums

C、Javaなど他の言語でよく使われるタイプで、特定の値の集合を表す.

enum Colors {Red, Liem, Yellow}
let color: Colors = Colors.Red;

インデックス番号でアクセスすることもできます.

enum Colors {Red, Liem, Yellow}
let color: Colors = Colors[0]; 

を超えるインデックスは、ユーザーが使いやすいように変更できます.

enum Colors {Red = 2, Liem, Yellow}
let color: Colors = Colors[2]; // Red
let color: Colors = Colors[4]; // Yellow

詳細Enums

関数のタイプ

🔹 パラメータ

関数のパラメータでタイプを定義する方法

function sum(a:number, b: number) {
  return a + b
}

sum(2,3) // 5

関数タイプを定義する方法

function sum(a:number, b: number): number {
  return a + b
}
sum(2,3) // 5

🔹 戻り値

関数の戻り値にタイプを定義します.

function add(): number {
  return 20;
}

🔹 制限パラメータのプロパティ

function func(a:number, b:number): number {
  return a + b;
}

func(10, 20); // 30
func(10,20,30,40) // error, too many parameters
func(10) // error, too few parameters

定義したパラメータ値を超えたときにエラーが発生しました.すぐには引き受けられない.

🔹 こうがくパラメータ

function log(a:string , b:string){
  console.log(`a:${a}, b:${b}`);
}

log('hello world'); // error, too few parameters

パラメータを選択的に取得したい場合は、?(疑問符)を使用してエラーを解決できます.

function log(a:string , b?:string){
  console.log(`a:${a}, b:${b}`);
}
log('hello world');

リファレンス
関数タイプスクリプト
板橋隊長タイプスクリプトの開始