1.1原始類型
let age:number = 18
let Nmae: string = 'Shaolong'
let IsFine: boolean = true
let abc: null = null
let efg: undefined = undefined
let sfun: symbol = symbol()
完全按照JS中類型的名稱來書寫
1.2數(shù)組類型
//數(shù)組中只能是number類型
let numbers:number[] = [1, 2, 3]
//數(shù)組中既有number又有string
let arr: (number | string)[] = [1, 2, 3, 'a', 'b']
1.3聯(lián)合類型
//數(shù)組中既可以是number又可以是string[]
//兩個或多個類型中間用 | 隔開
let arr1: number | string[] = 1
let arr2: number | string[] = ['a', 'b']
1.4類型別名
type CustomName = (number | string)[]
let arr3: CustomName = ['a', 'b', 1, 2]
let arr4: CustomName = ['a', 'b', 1, 'c']
常用或多次使用的類型定義別名方便下次使用
使用type創(chuàng)建類型別名,CustomName可以是任何合法的變量名
1.5函數(shù)類型
//1.單獨指定參數(shù)、返回值類型
function add(num1: number, num2: number) : number{
return num1 + num2
}
add(1,2)
const addFun = (num1: number, num2: number) : number =>{
return num1 + num2
}
addFun(3,2)
//2.同時指定參數(shù)、返回值類型
const addFuna = (num1: number, num2: number) : number = (num1, num2) => {
return num1 + num2
}
addFuna(6,6)
//(num1: number, num2: number) : number 為指定類型代碼
//通過類似箭頭形式的語法來為函數(shù)添加類型
//只適用于函數(shù)類型
//3.void類型
function getName(name: string): void {
console.log('MyName is ' + name)
}
getName('Tom')
//函數(shù)沒有返回值時使用void類型
//4.可選參數(shù)(?):可傳可不傳
function IsOptionalParam(param1?: string, param2?: number): void {
console.log('參數(shù)1:' + param1 + ',參數(shù)2:' + param2)
}
IsOptionalParam() //參數(shù)1:,參數(shù)2:
IsOptionalParam('a') //參數(shù)1:a,參數(shù)2:
IsOptionalParam('a','b') //參數(shù)1:a,參數(shù)2:b
//可選參數(shù)只能出現(xiàn)在參數(shù)列表的最后,可選參數(shù)后面不能再出現(xiàn)必選參數(shù)
1.6 對象類型
//1.單行時用;分開
let person = {
name: string
age: number
//sayHi(): void
sayHi:()=> void
greet(name: string): void
} = {
name: 'Tom',
age: 16,
sayHi() {},
greet(name) {}
}
//2.可選屬性
function myAxios(config:{url: string, method?: string}) {
console.log(config)
}
myAxios({url:'baidu.com'})
myAxios({url:'baidu.com', method:'POST'})
//3.interface聲明接口后可多次使用
interface Iperson {
name: string
age: number
sayHi:()=> void
}
let person1: Iperson= {
name: 'Tom',
age: 16,
sayHi() {}
}
//interface 與 type 區(qū)別 { 前面需要加 =
//interface只能為對象類型指定別名,type可以為任意類型定義別名
//interface 繼承
interface point2d { x: number; y: number }
interface point3d { x: number; y: number; z: number}
//===
interface point2d1 { x: number; y: number }
interface point3d1 extends point2d1 { z: number }
let p3: point3d1 = {
x: 100,
y: 100,
z: 100
}
//extends 繼承實現(xiàn)復(fù)用
//point3d1 通過extends擁有了point2d1所有的類型
1.7 元組
let position: [number, number] = [32.11, 36.66]
//明確的知道數(shù)組中包含多少個元素以及索引指定的類型就可使用元組
//上面例子中少一個多一個元素都會報錯
1.8 類型斷言
//當你比ts更加明確的知道元素類型的時候使用類型斷言
//通過類型斷言獲取標簽特有的屬性和方法
//瀏覽器控制臺通過console.dir() 獲取元素標簽類型(a => HTMLAnchorElement)
const aLink = document.getElementById('ID') as HTMLAnchorElement
aLink.href
1.9 字面量類型
//字面量類型一般和聯(lián)合類型配合使用
//表示一組明確的可選值列表
funstion changeDir(direction: 'up' | 'down' | 'left' | 'right') {
console.log(direction)
}
changeDir('up')
//相比string更加嚴謹、精確
1.10枚舉
enum Direction {
Up,
Down,
Left,
Right
}
funstion changeDire(direction: Direction) {
console.log(direction)
}
changeDire(Direction.Up) //0
//枚舉的成員是有值的,默認從0開始自增數(shù)值
enum Direction {
Up = 2,
Down = 4,
Left = 6,
Right = 10
}
funstion changeDire(direction: Direction) {
console.log(direction)
}
changeDire(Direction.Up) //2
//也可以給數(shù)字枚舉中的成員設(shè)置初始值
enum Direction {
Up = 'up',
Down = 'down',
Left = 'left',
Right = 'right'
}
funstion changeDire(direction: Direction) {
console.log(direction)
}
changeDire(Direction.Up) //up
//字符串枚舉
//枚舉字符串必須要有初始值