[TOC] >[success] # TypeSprict -- 基礎類型 ~~~ 1.'TypeSprict ' 和 'JavaSprict' 的類型是基本一致 ts 原始類型包括: boolean、number、string、void、undefined、null、 symbol、bigint，關于ts 更多類型'TypeSprict' 依次是: 1.1 'boolean' -- 布爾類型,定以后可以賦值true/false 和Boolean()對象 1.2 'number' --數字類型，,定以后可以賦值'2/8/10/16進制'，'整數類型'， '小數類型'，'NaN','Infinity（表示無窮大）' 1.3 'string' -- 字符串類型 1.4 '數組類型' -- '類型[]' /' Array<類型>' 1.5 '元組類型' -- '[類型]' 1.6 'enum' -- 枚舉 1.7 'any' -- 任意類型 1.8 'void' -- 空置,定義方法時候沒有返回值使用 1.9 'null/undefined' -- 'Null 和 Undefined' 1.10'never' -- 不存在類型一般用于錯誤處理函數.例如'拋出異常'/'死循環' 1.11'object' -- ts 中是泛指非所有非原始類型 1.12'類型斷言' -- 可以理解成斷定這個類型是自己斷言設置的類型 后續擴展(隨著ts 升級增加的新的類型) 1.13.bigint -- 使用較少的大整數 1.14.unkwon -- 用來描述類型并不確定的變量 2.基本類型使用的時候，通過冒號分割，以冒號左邊為變量名，右面是變量的 類型 3.下面的案例建議在剛才的'example' 文件下創建一個'.ts'文件，并且在這個文 件中引入對應在'example' 創建的ts文件，例如: 在'example' 創建了一個 'basic-type.ts'文件，在'index.ts' 引入時需要寫:import './example/basic-type' 4.注意'let' 和 'const' 變量聲明修飾問題，在第一個案例中會詳細說明，其他 案例同理 ~~~ >[info] ## let 和 const 注意事項 ~~~ 1.兩者區別'const' 必須定義就賦值,但'let' 定義時候可以不賦值，但使用時候 必須賦值 ~~~ >[danger] ##### const * 錯誤示范 如果使用const聲明變量，在初始的時候沒有賦值是不被允許的 ~~~js const name1 : string ~~~ * 正確寫法 ~~~js const name1 : string = 'wang' console.log(name1) // 打印結果 wang ~~~ >[danger] ##### let ~~~js 1.let 和 const 最大的區別'let' 允許 定義時不用賦值，但使用前必須賦值 ~~~ * 錯誤示范 ~~~js let name1 : string // 這一步是正確的可以定義不賦值 console.log(name1) // 錯誤的 使用時候必須要賦值 ~~~ * 正確操作 ~~~js let name1 : string // 當然也可以寫成 let name1:string = 'wang' name1 ='wang' console.log(name1) // 打印結果是wang ~~~ >[info] ## 基本類型寫法 ~~~ 1.ts 會推斷你當前變量的類型 ~~~ >[danger] ##### 布爾類型 -- boolean ~~~ 1.只能賦值true 或者 false和Boolean()對象 ~~~ * 賦值為true 和 false ~~~js let bool:boolean = true // 只能賦值true 或者 false 和Boolean()對象 bool = false // 重新賦值 console.log(bool) // 打印結果false ~~~ * 賦值為Boolean()對象 ~~~js let bool: boolean = Boolean(1); console.log(bool) // true ~~~ >[danger] ##### 數字類型 -- number ~~~ 1.ts 和 js 一樣，TypeScript里的所有數字都是浮點數。不像java中有整數類 型、雙精度類型等等，因為'ts' 的 數字表現形式是'number' 2.定義成number 只能賦值有: '二進制'、'八進制'、'十進制'、'十六進制'、 '整數類型和小數類型(整數類型可以算進十進制)'、'NaN(非數字類型)'、 'Infinity（表示無窮大）' ~~~ [可以參考js數字類型 -- 作者 醬路油過](http://www.hmoore.net/cyyspring/more/1016606#Number__68) ~~~js let binNum:number = 0b110 // 二進制 let octNum:number = 0o6 // 八進制 let num:number = 6// 十進制 let hexNum:number = 0x6 // 十六進制 let maxNum:number = Infinity // 無窮大 let minNum:number = -Infinity // 無窮小 let isNaNum:number = NaN // 表示非數值類型 console.log(binNum) // 6 console.log(octNum) // 6 console.log(num) // 6 console.log(hexNum) // 6 console.log(maxNum) // Infinity console.log(minNum) // -Infinity console.log(isNaNum) // NaN ~~~ >[danger] ##### 大數字 -- bigint ~~~ 1.BigInt 可以安全地存儲和操作大整數，即使這個數已經超出了JavaScript構造函數 Number 能夠表示的安全整數范圍 ~~~ ~~~ 1.const num: bigint = 1n ~~~ >[danger] ##### 字符串類型 -- string ~~~ 1.字符串也支持es6的`` 拼接寫法，所有 JavaScript 支持的定義字符串的方法，我們都可以直接在 TypeScript 中使用。 ~~~ ~~~ // 字符串類型 let num:number = 1 let str: string str = 'abc' str = `數值${num}` // 使用es6 拼接 `` console.log( str ) let familyname: string = String('S'); // 顯式類型轉換 ~~~ >[danger] ##### 數組類型 ~~~ 1.數組類型是用來限制數組內部元素的類型，寫法有兩種 '「類型 + 方括號」表示法','數組泛型' ~~~ * 「類型 + 方括號」 ~~~ // 第一種寫法 let arr: number[] arr = [1] ~~~ * 泛型 ~~~ // 第二種寫法泛型 let arr2: Array<number> arr2 = [1] ~~~ * 聯合類型 ~~~ // 聯合類型(下面案例顯示可以是數字字符串類型) let arr3: (string|number)[] arr3 = [2,'3'] // 聯合類型泛型的形式 let arr4: Array<string|number> arr4 = [2,'3'] ~~~ >[danger] ##### 元組類型 ~~~ 1.元組類型 固定長度固定類型 2.順序必須一一對應 3.2.6版本后不不準在越界超過定義數組長度 4.但是可以'push' 往里面添加元素,但只能添加定義好的聯合類型 ~~~ ~~~js let tuple: [string, number, boolean] tuple = ['a',1,true] tuple.push("1") // 可以push tuple[3] // 但是當我們訪問新加入的元素時，會報錯 tuple.push(Symbol("a")) // 報錯不是元組中聯合類型 ~~~  >[danger] ##### 枚舉類型 -- enum ~~~ 1.寫法：'enum 變量名 {}'，變量名第一個單詞一般大寫 2.使用場景:當后臺開發人員將一些特定的內容通過,特殊含義的數字提供給 我們時候，這個舉個例子：權限后臺返回給我們0 代表管理員，1代表普通 用戶,我們需要結合寫一些注釋提供給其他接下來的維護,前端人員說明，現 在可以利用枚舉值 3.默認順序從0開始 ~~~ * 枚舉類型定義參數點定義變量返回的是數值 ~~~js enum Roles { SUPER_ADMIN, ADIMN, USER } console.log(Roles.SUPER_ADMIN)// 返回的是0 // 后臺返回的這種數據不一定是從0 開始 我么你想自定制怎么辦 // 可以在后面去賦值，可以三個都賦值，也可以指定賦值其中一個 // 后面的排序會根據上一個進行 累加1 enum Roles2 { SUPER_ADMIN, ADIMN = 3, USER } console.log(Roles2.SUPER_ADMIN)// 返回的是0 console.log(Roles2.USER)// 返回的是4 ~~~ * 枚舉類型[對應枚舉數值]返回的是定義名稱 ~~~js enum Roles { SUPER_ADMIN, ADIMN, USER } console.log(Roles[2])// USER ~~~ >[danger] ##### 任意類型 -- any ~~~js 1. 這些值可能來自于動態的內容，比如來自用戶輸入或第三方代碼庫。 這 種情況下，我們不希望類型檢查器對這些值進行檢查而是直接讓它們通過編 譯階段的檢查。 那么我們可以使用any類型來標記這些變量 2.使用any 等同于 : let something; something = 'seven'; something = 7; ~~~ ~~~js // any任意類型 少用 let value: any value = 1 value = '1' // 利用any 定義數組 const arr4: any[] = [1,'a'] ~~~ >[danger] ##### 不確定的變量 -- unknown ~~~ 1.unknown 類型會更加嚴格 2.https://juejin.cn/post/6844903866073350151 更多細節 ~~~ ~~~ const num = 1 const unknown:unknown = num ~~~ >[danger] ##### 空值 -- void ~~~ 1.它表示沒有任何類型 2.當變量定義的時候只能賦值'undefined' (官方文檔說變量定義這個一般沒多大用) 3.變量的時候也可以賦值null 但需要修改配置文件給'"strictNullChecks":?false,' 4.當函數定義的時候表示函數沒有任何返回值 ~~~ ~~~ let anyParams: void = undefined // let anyParams2:void = null 可以賦值null 但需要修改配置文件 // 沒有返回值的函數 const consoleText = (text:string):void => { console.log(text) } consoleText('測試') ~~~ >[danger] ##### Null 和 Undefined ~~~ 1.如果開啟嚴格模式不能吧其他模式的值設置為null 和 undfined 2.與 void 的區別是，undefined 和 null 是所有類型的子類型。也就是說 undefined 類型的變量，可以賦值給 number 類型的變量 舉個例子： let num: number = undefined，如果你在tsconfig.json 開啟了嚴格模式'strict'那這樣會報錯 ~~~ ~~~ let u: undefined u = undefined // 只能是undefined類型 let n: null n = null // 只能是null 類型 ~~~ >[danger] ##### 不存在的類型 -- never ~~~ 1.永遠不存在值的類型，一般用于錯誤處理函數.例如'拋出異常'/'死循環' 2.never 類型表示的是那些永不存在的值的類型，never 類型是任何類型的子類型，也可以賦值給任何類型； 然而，沒有類型是 never 的子類型或可以賦值給 never 類型（除了never本身之外）。 ~~~ ~~~ // never 類型 不存在的類型 const errorFunc = (message: string): never => { throw new Error(message) } // 死循環 const infiniteFunc = (): never => { while(true){} } // 任意類型都可以賦值 never 但是never 不能賦值任意類型 // 立即執行函 類型是never 下面是 let test:number const infiniteFunc2 = ((): never => { while(true){} })() test = infiniteFunc2 // 其他 類型可以賦值never類型 // infiniteFunc2 = test never類型不可以賦值其他類型 // ----------------讓屬性只讀不能賦值---------- const props: { id: number, name?: never } = { id: 1 } props.name = null; // ts(2322)) props.name = 'str'; // ts(2322) props.name = 1; // ts(2322) // ------------------永遠只是空數組---------------- const empty: never[] = [] ~~~ >[danger] ##### 對象 -- object ~~~ 1.object 類型 ts 中是泛指非所有非原始類型 ，也就是除 number，string，boolean，symbol，null 或 undefined 之外的類型。 普通對象、枚舉、數組、元組通通都是 object 類型 ~~~ ~~~ // object 類型 ts 中是泛指非所有非原始類型 // 也就是數組 函數 對象 let a:object = [] a= function(){} a = {} ~~~ >[danger] ##### 想明確定義一個對象 ~~~ 1.可以使用接口 或者字面量的語法方式這里舉個例子后面會深入 const b:{name:string} = {name:'w'} ~~~ >[danger] ##### 類型斷言 ~~~ 1.兩種寫法：'<類型>值' 或者 '值 as 類型' 2.當我們使用一些聯合類型的時候，不同的聯合類型是具有不同屬性，例如 數字就不存在字符串長度的方法，但是為了區分聯合類型傳遞的參數去做不 一樣方法，就需要使用到類型斷言 3.它沒有運行時的影響，只是在編譯階段起作用。 TypeScript會假設你，程序員，已經進行了必須的檢查。 4.下面函數中的應用如果是js的話傳入的數字，數字.length 會對應'undefined' 代碼不會出現問題的，但因為ts 強類型，他會去查你類型中是否有這個方法 讓你通過斷言去做不同的操作 5.簡單的說因為ts給我們做了強制的判斷，因此我們也要對指定的聯合參數 斷言告訴他使用那個 ~~~ * 兩種寫法 ~~~js // 尖括號寫法 let someValue: any = "this is a string"; let strLength: number = (<string>someValue).length; // as 的寫法 let someValue1: any = "this is a string"; let strLength1: number = (someValue1 as string).length; ~~~ * 函數中的應用 ~~~ function getLength(something: string | number): number { if ((<string>something).length) { return (<string>something).length; } else { console.log(2) return something.toString().length; } } console.log(getLength(1)) ~~~