TypeScript聯合類型 接口

TypeScript聯合類型

聯合類型表示取值可以爲多種類型中的一種
如下所示

/**
 * 聯合類型
 */
var muchtype:string|number="hello";
muchtype=1;

這一塊我們必須使用string或者number都支持的類型，那麼下面我們可以進行調用擴展方法toString()

/**
 * 聯合類型
 * 注意：如果說我們使用字符串的length屬性那麼我們需要注意，如果是number類型是不支持的
 * 這一塊我們必須使用string或者number都支持的類型，那麼下面我們可以進行調用擴展方法toString()
 * 
 */
var muchtype:string|number="hello";
muchtype="";
muchtype=1;
console.log(muchtype.length)
console.log(muchtype.toString().length)

TypeScript中對象類型-接口

接口可以描述一種抽象的行爲，也可以描述對象的結構形狀,當然我們也需要遵守接口命名規範,接口一般首字母大寫 當然在一些語言上面建議接口的名稱前綴加上I前綴

interface IStudent{
    name:string
}
/**
 * 接口規範了name屬性是必須要寫的所以我們要通過第四行代碼進行使用
 * 接口起到一個約束作用約束我們這些屬性字段必須一對一的編寫.
 */
var obj1:IStudent;
obj1="11";
obj1=1;
obj1={name:"11"};

如果說我們進行修改接口如下所示

interface IStudent{
    name:string,
    age:number
}

那麼我們必須要給age進行賦值操作

obj1={name:"11",age:1};

可選類型nullable

interface IStudent
{
    name:string,
    age?:number //?爲一個可空類型nullable 他是一個可有可無的,那麼在下面我們可以不用對age進行賦值操作也不會出現異常
}

var obj2={name:"張三",age:1}

在我們屬性不確定的時候我們可以通過如下方式實現,any必須是任意類型,
因爲當我們進行使用不確定屬性個數的時候會有侷限性.
當然下面的屬性中比如說string number我們也可以使用聯合類型,這一塊我們後續可以根據實際需求進行變動即可

//屬性個數不確定的時候 
interface IStudent{
    name:string,
    age?:number,
    [propName:string]:any
}

var obj3:IStudent={name:"Mr.A",age:1,sex:"男",birthday:"2020-03-20"}

只讀屬性 readonly

interface IStudent{
    name:string,
    readonly age:number
}
var obj3:IStudent={name:"Mr.A",age:18}
obj3.name="Mr.B";
obj3.age=19;

通過如上代碼我們可以發現當我們對obj3.age進行賦值的時候會發現感知錯誤提示 如下所示

也就是說一旦我們賦初始值以後那麼後面我們就不能將其進行修改了.