TypeScript（3）基礎類型

来源:https://www.cnblogs.com/jiakecong/archive/2022/06/15/16378139.html
-Advertisement-
Play Games

基礎類型 TypeScript 支持與 JavaScript 幾乎相同的數據類型，此外還提供了實用的枚舉類型方便我們使用。 布爾值 最基本的數據類型就是簡單的true/false值，在JavaScript和TypeScript里叫做boolean（其它語言中也一樣） let isDone: bool ...


基礎類型

TypeScript 支持與 JavaScript 幾乎相同的數據類型，此外還提供了實用的枚舉類型方便我們使用。
 

布爾值

最基本的數據類型就是簡單的true/false值，在JavaScript和TypeScript里叫做boolean（其它語言中也一樣）

let isDone: boolean = false;
console.log(isDone)
isDone = true;  // ok
// isDone = 2 // error

其中:boolean就聲明變數isDone必須是布爾型，否則編譯會報錯，如果我們給isDone賦值為2，則會報錯

 

數字

和JavaScript一樣，TypeScript里的所有數字都是浮點數。 這些浮點數的類型是 number。 除了支持十進位和十六進位字面量，TypeScript還支持ECMAScript 2015中引入的二進位和八進位字面量。

let a1: number = 10 // 十進位
let a2: number = 0b1010  // 二進位
let a3: number = 0o12 // 八進位
console.log(a1)
console.log(a2)
console.log(a3)
console.log(a4)

結果

10
10
10
10

 

字元串

JavaScript 程式的另一項基本操作是處理網頁或伺服器端的文本數據。 像其它語言里一樣，我們使用 string 表示文本數據類型。 和 JavaScript 一樣，可以使用雙引號（"）或單引號（'）表示字元串。

let firstName: string = "jkc";
console.log(firstName)
firstName = "jkc1";
console.log(firstName)

結果

jkc
jkc1

我們還可以使用模版字元串，它可以定義多行文本和內嵌表達式。 這種字元串是被反引號包圍（ ），並且以${ expr }`這種形式嵌入表達式

let firstName:string = 'jkc1'
firstName = 'jkc2'
let age:number = 18
const info = `My name is ${firstName}, I am ${age} years old!`
console.log(info)

結果

My name is jkc2, I am 18 years old!

 

數組

TypeScript像JavaScript一樣可以操作數組元素。 有兩種方式可以定義數組。 第一種，可以在元素類型後面接上 []，表示由此類型元素組成的一個數組：

let list: number[] = [1, 2, 3];
let list1: string[] = ['1', '2', '3']
let list2: boolean[] = [true, false]
console.log(list)
console.log(list1)
console.log(list2)

 
第二種方式是使用數組泛型，Array<元素類型>：

let list2: Array<number> = [1, 2, 3]
console.log(list2)

 

元組 Tuple

元組類型允許表示一個已知元素數量和類型的數組，各元素的類型不必相同。 比如，你可以定義一對值分別為 string 和 number 類型的元組。

let t1: [string, number]
t1 = ['hello', 10] // OK
t1 = [10, 'hello'] // Error

當訪問一個已知索引的元素，會得到正確的類型：

console.log(t1[0].substring(1)) // OK
console.log(t1[1].substring(1)) // Error, 'number' 不存在 'substring' 方法

 

枚舉

enum 類型是對 JavaScript 標準數據類型的一個補充。 使用枚舉類型可以為一組數值賦予友好的名字。

enum Color {Red, Green, Blue}

// 枚舉數值預設從0開始依次遞增
// 根據特定的名稱得到對應的枚舉數值
let myColor: Color = Color.Green  // 1
console.log(myColor, Color.Red, Color.Blue)

預設情況下，從0開始為元素編號。 你也可以手動的指定成員的數值。 例如，我們將上面的例子改成從 1開始編號：

enum Color {Red = 1, Green, Blue}
let c: Color = Color.Green;

或者，全部都採用手動賦值：

enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green

枚舉類型提供的一個便利是你可以由枚舉的值得到它的名字。 例如，我們知道數值為 2，但是不確定它映射到 Color 里的哪個名字，我們可以查找相應的名字：

enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2]

console.log(colorName)  // 'Green'

 

any

有時候，我們會想要為那些在編程階段還不清楚類型的變數指定一個類型。 這些值可能來自於動態的內容，比如來自用戶輸入或第三方代碼庫。 這種情況下，我們不希望類型檢查器對這些值進行檢查而是直接讓它們通過編譯階段的檢查。 那麼我們可以使用 any類型來標記這些變數：

// any
let notSure: any = 4;
notSure = "maybe a string instead";
notSure = false; // 也可以是個 boolean

在對現有代碼進行改寫的時候，any 類型是十分有用的，它允許你在編譯時可選擇地包含或移除類型檢查。並且當你只知道一部分數據的類型時，any 類型也是有用的。 比如，你有一個數組，它包含了不同的類型的數據：

let list: any[] = [1, true, 'free']

list[1] = 100

any類型可以隨意更改裡面的值的類型
 

void

某種程度上來說，void類型像是與any類型相反，它表示沒有任何類型。 當一個函數沒有返回值時，你通常會見到其返回值類型是 void：

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

聲明一個void類型的變數沒有什麼大用，因為你只能為它賦予undefined和null：

let unusable: void = undefined;
unusable = null
unusable = 1 // error

 

Never

never類型表示的是那些永不存在的值的類型。 例如， never類型是那些總是會拋出異常或根本就不會有返回值的函數表達式或箭頭函數表達式的返回值類型； 變數也可能是 never類型，當它們被永不為真的類型保護所約束時。
never類型是任何類型的子類型，也可以賦值給任何類型；然而，沒有類型是never的子類型或可以賦值給never類型（除了never本身之外）。 即使 any也不可以賦值給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) {
    }
}

 

object

object表示非原始類型，也就是除number，string，boolean，symbol，null或undefined之外的類型。

使用object類型，就可以更好的表示像Object.create這樣的API。例如：

function getObj(obj: object):object {
    console.log(obj)
    return {
        name: "鳴人",
        age: 20
    }
}

getObj({name: '佐助'})
getObj({name: '卡卡西', age: 18})
getObj(null)
getObj(new String('123'))
getObj('123')  // 錯誤

 

類型斷言

有時候你會遇到這樣的情況，你會比TypeScript更瞭解某個值的詳細信息。 通常這會發生在你清楚地知道一個實體具有比它現有類型更確切的類型。
 
通過類型斷言這種方式可以告訴編譯器，“相信我，我知道自己在乾什麼”。 類型斷言好比其它語言里的類型轉換，但是不進行特殊的數據檢查和解構。 它沒有運行時的影響，只是在編譯階段起作用。 TypeScript會假設你，程式員，已經進行了必須的檢查。
 
類型斷言有兩種形式。 其一是“尖括弧”語法：

let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
`console.log(strLength)`

我們首先創建了一個any類型的變數someValue，然後使用<string>斷言這個類型是不是string類型，如果不是則會輸出undefined
另一個為as語法：

let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;

兩種形式是等價的。 至於使用哪個大多數情況下是憑個人喜好；然而，當你在TypeScript里使用JSX時，只有 as語法斷言是被允許的。
 

類型推斷

類型推斷: TypeScript會在沒有明確的指定類型的時候推測出一個類型
有下麵2種情況:

  1. 定義變數時賦值了, 推斷為對應的類型.
  2. 定義變數時沒有賦值, 推斷為any類型
/* 定義變數時賦值了, 推斷為對應的類型 */
let b9 = 123 // number
// b9 = 'abc' // error

/* 定義變數時沒有賦值, 推斷為any類型 */
let b10  // any類型
b10 = 123
b10 = 'abc'

 

聯合類型（Union Types）

聯合類型（Union Types）表示取值可以為多種類型中的一種
需求1: 定義一個一個函數得到一個數字或字元串值的字元串形式值

function toString2(x: number | string) : string {
    return x.toString()
}

console.log(toString2('123'))
console.log(toString2(123))
let list: number[] = [1, 2, 3];
console.log(toString2(list)) // error

如果我們輸入除number或者string類型，編譯就會報錯

 
需求2: 定義一個一個函數得到一個數字或字元串值的長度

// 定義一個getLength函數，傳入的參數可以是number或者string類型
function getLength(str: number | string) {
    // str.length存在嗎？如果存在也就說明str是string類型的
    if ((<string>str).length) {
        return (<string>str).length
    } else {
        // 此時說明str是number類型
        return str.toString().length
    }
}

console.log(getLength('123'))
console.log(getLength(12345678))

結果：

3
8

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 實時開發平臺建設實踐，深入釋放實時數據價值丨04期直播回顧
    原文鏈接：實時開發平臺建設實踐，深入釋放實時數據價值 視頻回顧：點擊這裡 課件獲取：點擊這裡 一、實時數倉建設背景 隨著整體行業的數字化轉型不斷深入以及技術能力的不斷提高，傳統的 T+1 式（隔日）的離線大數據模式越來越無法滿足新興業務的發展需求，開展實時化的大數據業務，是企業深入挖掘數據價值的一條 ...
  • SQL 如何進行並集、交集、差集等集合運算
    本文將會和大家一起學習集合運算操作。集合在數學領域表示“（各種各樣的）事物的總和”，在資料庫領域表示記錄的集合。具體來說，表、視圖和查詢的執行結果都是記錄的集合。 本文重點 集合運算就是對滿足同一規則的記錄進行的加減等四則運算。 使用 UNION（並集）、INTERSECT（交集）、EXCEPT（差 ...
  • Redis緩存更新策略
    Redis緩存更新策略 本文整理自黑馬程式員相關資料 記憶體淘汰 超時剔除 主動更新 說明 不用自己維護，利用Redis的記憶體淘汰機制，當記憶體不足時自動淘汰部分數據。下次查詢時更新緩存 給緩存數據添加TTL時間，到期後自動刪除緩存，下次查詢時更新緩存 編寫業務邏輯，在修改數據的同時，更新緩存 一致性 ...
  • 調試Archery連接SQL Server提示驅動錯誤
    一、課程介紹 數據服務API作為數據統一服務平臺建設的最上層，能夠將數據倉庫數據以服務化、介面化的方式提供給數據使用方，屏蔽底層數據存儲、計算的諸多細節，簡化和加強數據的使用。 隨著企業“互聯網化、數字化”進程的不斷深入，越來越多的業務被遷移到互聯網上，產生大量的業務交互和對外服務需求，對API介面 ...
  • Oracle學習筆記二十五：包的定義與調用
    一、包的作用 • Oracle中包的概念與Java中包的概念非常類似，只是Java中的包是為了分類管理類，但是關鍵字都是package。 • 在一個大型項目中，可能有很多模塊，而每個模塊又有自己的過程、函數等。而這些過程、函數預設是放在一起的（如在PL/SQL中，過程預設都是放在一起的，即Proce ...
  • Gradle連載6-AndroidGradle任務之defaultConfig配置
    一、android工程配置 buildscript { repositories { jcenter() } dependencies { classpath 'com.android.tools.build:gradle:3.1.4' } } apply plugin: 'com.android. ...
  • 基於 ZEGO SDK 實現 iOS 一對一音視頻聊天應用
    在開始集成 ZEGO Express SDK 前，請確保開發環境滿足以下要求 ...
  • js中數組reduce的使用原來這麼簡單
    reduce 的學習方法 array.reduce(callback(prev, currentValue, index, arr), initialValue) //簡寫就是下麵這樣的 arr.reduce(callback,[initialValue]) callback （執行數組中每個值的函 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類