序文

私は以前からTypeScriptの傍観者であり、仕事をするときにそれを学ぶ必要があると常に感じていますが、過去数日間の経験から確かに教訓が得られました。それは0202であり、フロントエンドはTypeScriptではありませんか？傷は自分のものなので、やってみましょう！

TypeScriptとは

TypeScriptは、Microsoftによって開発された無料のオープンソースプログラミング言語です。これはJavaScriptのスーパーセットです。TypeScriptはオプションの静的型付けとクラスベースのオブジェクト指向プログラミングをJavaScriptに追加します。実際、TypeScriptはJavaScriptの拡張バージョンと同等ですが、実行の最後にJavaScriptにコンパイルする必要があります。TypeScriptの最大の目的は、プログラマーの創造性を高め、生産性を向上させることです。これにより、JavaScript書き込みアプリケーションの開発とデバッグが大幅に強化され、大規模なアプリケーションの作成や複数人のコラボレーションにJavaScriptが使いやすくなります。

可変型

プログラムを価値あるものにするためには、数値、文字列、構造、ブール値などの最も単純なデータ単位を処理できる必要があります。TypeScriptは、JavaScriptとほぼ同じデータ型をサポートし、使用できる実用的な列挙型も提供します。

TypeScriptのデータ型

ブール値：ブール値
数値：数値型;
文字列：文字列型;
列挙型：列挙型
任意：任意のタイプ
void：空のタイプ
ヌル：ヌルタイプ
未定義
決して存在しない値のタイプはありません
オブジェクトオブジェクト
配列：配列タイプ
タプル：原始型

1.ブール値

ビジネスロジックの判断を行うには、ブール型の参加が必要です。正しいか間違っているかの判断は、最も直感的な論理処理です。ブール型には、trueとfalseの2つの値しかありません。

let  isOk:boolean = false
console.log(isOk)//false

2.番号

JavaScriptと同様に、TypeScriptのすべての数値は浮動小数点数です。これらの浮動小数点数のタイプはnumberです。TypeScriptは、10進数と16進数のリテラルをサポートするだけでなく、ECMAScript2015で導入された2進数と8進数のリテラルもサポートします。

let num1:number = 123
let num2:number = 0xf00d
let num3:number = 0b1111
let num4:number = 0o744

console.log(num1,num2,num3,num4)//123 61453 15 484

3.string

javascript：""や一重引用符：のような二重引用符を''使用できます。テンプレート文字列も使用できます。(``)

let pz:string = "pzeng"
let age: number = 37;
let question: string = `Hello, my name is ${
      
       pz },i love ${
      
      age}`
console.log(question) //Hello, my name is pzeng,i love 37

4.列挙型

この世界には、次のように複数の固定された多くの値があります：季節：春、夏、秋、冬、4つの結果があります。この種の変数の結果がいくつかの固定データである場合は、列挙型を使用するのが最適な時期です。

//默认情况下，从0开始为元素编号
enum Color {
    
    yello,pink,red} 
let c:Color = Color.pink
console.log(c)//1
//自定义编号
enum Color {
    
    yello=1,pink,red} 
let c:Color = Color.pink
console.log(c)//2
//枚举类型提供的一个便利是你可以由枚举的值得到它的名字
enum Color {
    
    yello=1,pink,red} 
let colorName:string = Color[2]
console.log(colorName)//pink

5.任意

プログラミング段階で型がわからない変数の型を指定したい場合があります。これらの値は、ユーザー入力やサードパーティのコードライブラリなどの動的コンテンツから取得される場合があります。この場合、タイプチェッカーにこれらの値をチェックさせたくはありませんが、コンパイル段階で直接チェックに合格させます。次に、anyタイプを使用してこれらの変数をマークできます。実際、フロントエンドの記述が多すぎると、タイプが無意識のうちに不明確になることがあります。これは悪い習慣であり、フロントエンドの苦痛でもあります。そのため、JavaScriptは大規模なプロジェクトには適さないと何度も批判されてきました。

var t:any =10
t='你好'
t= false
console.log(t)

6.ボイド

ある意味、viodはその逆であり、型がないことを意味します。関数が値を返さない場合、通常、戻り値の型はvoidであることがわかります。


function warnUser(): void {
    
    
  console.log("This is my warning message");
}
let unusable: void = undefined;

7.ヌル和未定義

デフォルトでは、nullとundefinedはすべてのタイプのサブタイプです。つまり、タイプnumberの変数にnullおよびundefinedを割り当てることができます。

let u: undefined = undefined;
let n: null = null;

8.決して

neverタイプは、決して存在しない値のタイプを表します。たとえば、never型は、常に例外をスローするか、まったく値を返さない関数式または矢印関数式の戻り値型です。変数は、保護によって制約されている場合、真の型ではない場合でも、never型である可能性があります。

neverタイプは、任意のタイプのサブタイプであり、任意のタイプに割り当てることができます。ただし、neverタイプは、neverのサブタイプであるか、neverタイプに割り当てることができます（never自体を除く）。いずれも決してに割り当てることはできません。

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    
    
    throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
    
    
    return error("Something failed");
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
    
    
    while (true) {
    
    
    }
}

9.オブジェクト

objectそれは、非プリミティブ型を表す以外number、string、boolean、symbol、nullまたはundefinedタイプ外部。

objectタイプを使用して、Object.createこのようなAPIをより適切に表現します

declare function create(o: object | null): void;

create({
    
     prop: 0 }); // OK
create(null); // OK

create(42); // Error
create("string"); // Error
create(false); // Error
create(undefined); // Error

10配列タイプ

//可以在元素类型后面接上 []，表示由此类型元素组成的一个数组
let list1: number[] = [1, 2, 3]
//使用数组泛型，Array<元素类型>
let list2: Array<number> = [1, 2, 3]

11タプル

タプルタイプを使用すると、要素の数とタイプがわかっている配列を表すことができ、各要素のタイプは同じである必要はありません。たとえば、値が文字列と数値であるタプルのペアを定義できます。

let x: [string, number];
x = ['hello', 10]; // OK
x = [10, 'hello']; // Error
console.log(x[0].substr(1)); // ello
console.log(x[1].substr(1)); // Error, 'number' does not have 'substr'

TypeScriptの一般的なデータ型

序文