類(lèi)型聲明
比較常見(jiàn)的基礎(chǔ)類(lèi)型聲明
1.字符串
var a : string ; //聲明字符串
console.log(a = 11); // error type 11 not assignable to type string
console.log(a = 'string');
2.數(shù)字聲明
var b : number; //聲明數(shù)字
console.log(b = 2)
console.log(b = '11') // error type 11 not assignable to type 'number'
3.boolean
var c : boolean;
console.log(c = false);
console.log(c = 0) // error type 11 not assignable to type 'boolean'
4.數(shù)組聲明
var array : Array<any>; //表示聲明的數(shù)組可以是任何類(lèi)型
var arrayb : Array<string> //表示聲明的數(shù)組必須都是 字符串
var arrayo : Array<{name:string;age:number}> //表示數(shù)組元素必須是包含name 與 age的對(duì)象 并且name為字符串,age為數(shù)字
var arrayo = [{name:'dabao',age:25}]
var arrays : Array<{name:string,age?: number}>//這里表示數(shù)組元素必須為name的對(duì)象 age可選
var arrays = [{name:'dabao'}]
##類(lèi)作為元素
class newDabao {
name : string
age ?: number
}
var classArray : newDabao;
console.log(classArray = {name:'cxh'})
上面代碼中出現(xiàn)了Array<{name:string;age:number}>其中{name:string;age:number}并不是對(duì)象。有很多人寫(xiě)過(guò)這樣的代碼給我看艺玲,
var obj = {
name : 'cxh',
age : 12救军,
height : 180
}
var c : obj
5.定義對(duì)象
var obj : {}
var obj4 : {name:string;age:number}
console.log(obj4= {name : 'dabao',age :26})
我們不能定義一個(gè)對(duì)象直接使用對(duì)象名來(lái)進(jìn)行類(lèi)型聲明险污,但是我們卻可以直接聲明對(duì)象例如
var obj = {
name:'cxh',age:13
}
var obj5 :obj //報(bào)錯(cuò)
##but
var obj5 : {name:'cxh',age:13}
console.log(obj5 = {name:'daobao',age:13})
var obj5 : {name:'cxh',age:13}
console.log(obj5 = {name:'cxh',age:13}) //ok
同理
var string1 : 'string'
console.log(string1 = 'string') //ok
對(duì)變量聲明class類(lèi)
class Dabao {
name : string
age : number
height ?: number
constructor(opations : {
name : string;
age:number;
height?:number
}){
this.name = name
this.age = age
this.height = height
}
}
var dabao : Dabao = new Dabao('cxh',24)
一個(gè) 例子:
假設(shè)我們做一個(gè)表單蒸痹,表單的內(nèi)容分別為岩齿,姓名头遭、年齡寓免、地址、電話(huà)计维。我們把每個(gè)表單的數(shù)據(jù)組裝成一個(gè)對(duì)象去處理袜香,例如姓名,我們需要value來(lái)獲取用戶(hù)輸入鲫惶,placeholder用來(lái)提示用戶(hù)蜈首,當(dāng)然如果可以也可以把正則驗(yàn)證放進(jìn)去。這樣我們得到
username = {
value : 'dabao',
placeholder : '姓名'
}
首先我們先設(shè)置每個(gè)字段的數(shù)據(jù)類(lèi)型
export class FieldBase {
value : any
placeholder:string
}
整個(gè)表單的數(shù)據(jù)
import { FieldBase } from './fieldBase'
export class FieldForm{
username : FieldBase
age : FieldBase
address : FieldBase
phone :FieldBase
constructor(options: {
username : FieldBase
age : FieldBase
address : FieldBase
phone :FieldBase
}){
this.username = username
this.age = age
this.address = address
this.phone = phone
}
}
新建
import { FieldForm } from './fieldBase'
let formData : FieldForm = new FieldForm({
username : { //數(shù)據(jù)必須是FieldBase型
value: "",
placeholder:"姓名"
},
age : {
value: "",
placeholder:"年齡"
},
address:{
value: "",
placeholder:"地址"
},
phone:{
value: "",
placeholder:"手機(jī)"
}
})
二剑按、類(lèi)型斷言
所謂的類(lèi)型斷言就是程序員告訴typescript的編譯器疾就,“聽(tīng)我的,這就是這種類(lèi)型”例如:
let dabao : any = "woaidabao"
let xiaobao = (<string>dabao).length
這里dabao是any類(lèi)型艺蝴,但是在計(jì)算長(zhǎng)度時(shí)我斷言它是string猬腰,亦可以這樣做
let xiaobao = (dabao as string).length
具體情況在將接口的時(shí)候會(huì)繼續(xù)說(shuō)明。猜敢。