[TypeScript] 合併型の配列(複数の型が含まれているを配列)の型定義

typescript-list-multi-type
INDEX

はじめに

初めてのTypeScriptを読みました。
その学習を記録します。

40036_learning_typescript_cvr

結論

文字列と数値の混合の配列のあ場合、(number | string)[]を指定する

使い方

OK: 文字列のみの配列

const stgList: string[] = ['1', '2', '3', '4', '5'];

console.log(stgList);
実行結果を確認する
["1", "2", "3", "4", "5"] 

OK: 数値のみの配列

const numList: number[] = [1, 2, 3, 4, 5];

console.log(numList);
実行結果を確認する
[1, 2, 3, 4, 5] 

NG: 数値のみの配列に文字列が含まれている

const numList: number[] = [1, 2, 3, '4', '5'];

console.log(numList);
実行結果を確認する
Type 'string' is not assignable to type 'number'.

OK: 合併型(文字列/数値)の配列

const numOrStgList: (number | string)[] = [1, 2, 3, '4', '5'];

console.log(numOrStgList);
実行結果を確認する
[1, 2, 3, "4", "5"] 

OK: 数値のみの多次元配列

const numMultiList: number[][] = [
  [1, 2, 3, 4, 5],
  [6, 7, 8, 9, 10],
]

console.log(numMultiList);
実行結果を確認する
[[1, 2, 3, 4, 5], [6, 7, 8, 9, 10]] 

OK: 合併型(文字列/数値)の多次元配列

const numOrStgListMulti: (number | string)[][] = [
  ['1', '2', '3', '4', '5'],
  [6, 7, 8, 9, 10],
]

console.log(numMultiList);
実行結果を確認する
[["1", "2", "3", "4", "5"], [6, 7, 8, 9, 10]] 
よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

Born in 1994
Engineer's career is from 2020.10
Skill: Next.js, TypeScript, Django, Python, HTML, CSS

INDEX