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進行賦值的時候會發現感知錯誤提示 如下所示

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