TypeScript可选类型 与 联合类型

620 阅读1分钟

'?'-> 可选类型

// 使用场景 当一个函数指定参数后,但是不想传这个参数 

function foo(agm:string){
    console.log(agm);
}
foo();

`

使用可选类型

function info(userInfo:{name:string,age:number,gender?:string}){
    console.log(userInfo.name,userInfo.age);
}
info({name:"大超",age:18})  // 这里对参数的gender属性使用了 可选类型  即使不传也不会报错

'|' -> 联合类型:值该变量的数据类型可以为多种 类似javascript中的 '||' 或运算符;

function messageFn(message:string | undefined){ 
    // 此时message的类型可以为 string 或 undefined
    console.log(message);
}
messageFn('虎年大吉!')
messageFn(undefined) // 注意!!联合类型下必须传值 

// 联合类型又类似于可选类型 相当于下方的写法
function messageFn(message?:string){  // 此时message的类型可以为 string 或 number
    console.log(message);
}
messageFn() //可选类型中则可以不用必须穿值

** 总结: 1.可选类型可以做到让一个参数是可选的 即可以存在也可以不存在 2. 联合类型可以让一个参数的类型是多种的 3.当一个参数是可选类型时,它类似于联合类型的 type | undefined **