TypeScript入門-基本類型

_ipo 發布于2019-08-20 15:29 / 2264人閱讀

摘要：基本類型在中，提供了一下基本數據類型布爾類型數據類型字符串類型數組類型元組類型枚舉類型任意值類型和類型類型其中元組枚舉任意值類型和類型是有別與的特有類型。布爾類型布爾類型是最簡單的數據類型，只有和兩種值。

學習Angular 2 ，《揭秘Angular 2》讀書筆記。
Angular2 選擇 TypeScript 作為其官方最主要的構建語音，這意味著掌握 TypeScript 語音將更有利于高效地開發 Angular 應用。

TypeScript 基本類型

在TypeScript中，提供了一下基本數據類型

布爾類型（boolean）

數據類型（number）

字符串類型（string）

數組類型（array）

元組類型（tuple）

枚舉類型（enum）

任意值類型（any）

null 和 undefined

void 類型

never 類型

其中元組、枚舉、任意值、void類型和 never類型是TypeScript有別與JavaScript的特有類型。
在TypeScript中聲明變量，需要加上類型聲明，例如boolean和string等。通過靜態類型約束，在編譯時執行類型檢查，可以避免一些類型混用的低級錯誤。

布爾類型

布爾類型是最簡單的數據類型，只有true和false兩種值。也就是說如果賦值為非boolean的其他類型值，編譯時會拋出錯誤。

let flag: boolean = true;
flag = 1; // 報錯

數據類型

在TyopeScript中，數字都是浮點型。TypeScript同時支持二進制、八進制、十進制和十六進制字面量，示例代碼如下：

let binaryLiteral: number = 0b1010; // 二進制
let octalLiteral: number = 0o744;    // 八進制
let decLiteral: number = 6;    // 十進制
let hexLiteral: number = 0xf00d;    // 十六進制

字符串類型

TypeScript支持使用單引號（"）或雙引號（"）來表示字符串類型。還支持使用模板字符串反引號（`）來定義多行文本和內嵌表達式。使用${ expr }的形式嵌入變量或表達式，在處理拼接字符串的時候很有用，示例如下：

let name: string = "Angular";
let years: number = 5;
let words: string = `您好，今年是 ${ name } 發布 ${ years + 1} 周年`;

數組類型

TypeScript數組的操作類似與JavaScript中數組的操作，TypeScript有兩種數組定義方式，示例代碼如下：

// 在元素類型后面加上[]
let arr: number[] = [1, 2];

// 或者使用數組泛型
let arr: Array = [1, 2];

元組類型

元組類型用來表示已知元素數量和類型的數組，各元素的類型不必相同。下面定義了一組值分別為字符串和數字類型的元組，示例代碼如下：

let x: [string, number];
x = ["Angular", 25];    // 運行正常
x = [25, "Angular"];    // 報錯
console.log(x[0]);    // 輸出 Angular

枚舉類型

枚舉是一個可被命名的整型常數的集合，枚舉類型為集合成員賦予有意義的名稱，增強可讀性，示例代碼如下：

enum Color {Red, Green, Blue};
let c: Color = Color.Blue;
console.log(c);    // 輸出 2

枚舉默認下標是0，可以手動修改默認下標值，示例代碼如下：

enum Color {Red = 2, Blue, Green = 6};
let c: Color = Color.Blue;
console.log(c);    // 輸出：3

任意值類型

任意值是 TypeScript 針對編程時類型不明確的變量使用的一種數據類型，它常用于一下三種情況。

變量的值會動態改變時，比如來自用戶的輸入，任意值類型可以讓這些變量跳過編譯階段的類型檢查，示例代碼如下：

let x: any = 1;    // 數字類型
x = "I am who I am";    // 字符串類型
x = false;    // 布爾類型

改寫現有代碼時，任意值允許在編譯時可選擇地包含或移除類型檢查，示例代碼如下：

let x: any = 4;
x.ifItExists();    // 正確，ifItExists方法在運行時可能存在，但這里并不會檢查
x.toFixed();    // 正確

定義存儲各種類型數據的數組時，示例代碼如下：

let arrayList: any[] = [1, false, "fine"];
arrayList[1] = 100;

null 和 undefined

默認情況下，null 和 undefined 是其它類型的子類型，可以賦值給其它類型，如數字類型，此時，賦值后的類型會變成 null 或 undefined。而在TypeScript中啟用嚴格的空校驗（--strictNullChecks）特性，就可以使得null 和 undefined 只能被賦值給 void 或本身對應的類型，示例代碼如下：

// 啟用 --strictNullChecks
let x: number;
x = 1; // 運行正確
x = undefined;    // 運行錯誤
x = null;    // 運行錯誤

上面的例子中變量 x 只能是數字類型。如果一個類型可能出行 null 或 undefined，可以用 | 來支持多種類型，示例代碼如下：

// 啟用 --strictNullChecks
let x: number | null | undefined;
x = 1; // 運行正確
x = undefined;    // 運行正確
x = null;    // 運行正確

void 類型

在 TypeScript 中，使用 void 表示沒有任何類型。例如一個函數沒有返回值時，意味著返回值類型是 void，示例代碼如下：

function hello(): void {
    alert("Hello Angular");
}

對于可忽略返回值的回調函數來說，使用 void 類型會比任意值類型更安全一些，示例代碼如下：

function func(foo:() => void) {
    let f = foo();    // 使用函數 foo 的返回值
    f.doSth();    // 報錯， void 類型不存在 doSth() 方法， 此時換成任意值類型都不回報錯
}

never 類型

never 是其它類型（包括 null 和 undefined）的子類型，代表從不會出現的值。這意味著聲明為 never 類型的變量只能被 never 類型所賦值，在函數中它通常表現為拋出異常或無法執行到終止點（例如無線循環），示例代碼如下：

let x: never;
let y: number;

// 運行錯誤，數字類型不能轉為 never 類型
x = 123;

// 運行正確，never 類型可以賦值給 never類型
x = (()=>{ throw new Error("exception")})();

// 運行正確，never 類型可以賦值給 數字類型
y = (()=>{ throw new Error("exception")})();

// 返回值為 never 的函數可以是拋出異常的情況
function error(message: string): never {
    throw new Error(message);
}

// 返回值為 never 的函數可以是無法被執行到的終止點的情況
function loop(): never {
    while (true) {}
}

云服務器 GPU云服務器基本類型基本數據類型 python基本類型 javascript基本類型

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82290.html

JavaScript => TypeScript 入門

摘要：為了由簡入繁，不妨將這些類型劃分為基本類型復合類型。以下將漸進式的對的這些類型進行了解。實際上，有一種屬性描述對象，是通過獲取的。但無論如何，類型檢查是可以排除大部分錯誤的。在函數的類型聲明中，繼續來鞏固這條規則的寫法。幾個月前把 ES6 的特性都過了一遍，收獲頗豐。現在繼續來看看 TypesScript（下文簡稱為 TS）。限于經驗，本文一些總結如有不當，歡迎指正。概述官網有這...

Tonny 2019-08-21 17:27 評論0 收藏0
SegmentFault 技術周刊 Vol.40 - 2018，來學習一門新的編程語言吧！

摘要：入門，第一個這是一門很新的語言，年前后正式公布，算起來是比較年輕的編程語言了，更重要的是它是面向程序員的函數式編程語言，它的代碼運行在之上。它通過編輯類工具，帶來了先進的編輯體驗，增強了語言服務。 showImg(https://segmentfault.com/img/bV1xdq?w=900&h=385); 新的一年不知不覺已經到來了，總結過去的 2017，相信小伙們一定有很多收獲...

caspar 2019-08-15 13:33 評論0 收藏0
SegmentFault 技術周刊 Vol.40 - 2018，來學習一門新的編程語言吧！

摘要：入門，第一個這是一門很新的語言，年前后正式公布，算起來是比較年輕的編程語言了，更重要的是它是面向程序員的函數式編程語言，它的代碼運行在之上。它通過編輯類工具，帶來了先進的編輯體驗，增強了語言服務。 showImg(https://segmentfault.com/img/bV1xdq?w=900&h=385); 新的一年不知不覺已經到來了，總結過去的 2017，相信小伙們一定有很多收獲...

nihao 2019-08-21 18:39 評論0 收藏0
SegmentFault 技術周刊 Vol.40 - 2018，來學習一門新的編程語言吧！

摘要：入門，第一個這是一門很新的語言，年前后正式公布，算起來是比較年輕的編程語言了，更重要的是它是面向程序員的函數式編程語言，它的代碼運行在之上。它通過編輯類工具，帶來了先進的編輯體驗，增強了語言服務。 showImg(https://segmentfault.com/img/bV1xdq?w=900&h=385); 新的一年不知不覺已經到來了，總結過去的 2017，相信小伙們一定有很多收獲...

Drummor 2019-06-28 14:38 評論0 收藏0
為vue3學點typescript, 基礎類型和入門高級類型

摘要：導航第一課體驗第二課基礎類型和入門高級類型第三課泛型第四課解讀高級類型很重要這一節很重要可以說是的最核心部分這一節學完其實就可以開始用寫代碼了想想中的再看看標題中的類型字所以請大家務必認真什么是入門高級類型因為高級類型的內容比較多但是有些基導航第一課, 體驗typescript 第二課, 基礎類型和入門高級類型第三課, 泛型第四課, 解讀高級類型很重要這一節很重要, 可以說...

Songlcy 2019-08-23 18:27 評論0 收藏0