1) ? 的用法
示例:
?const obj = res?.data || {}; // obj是從接口中取到的數據const dataError = obj.a.b; ?// 若obj為空,則此時會報錯const dataSafe = obj?.a?.b; ?// 相當于 const dataSafe = obj && obj.a && obj.a.b ?? obj.a.b : undefined;
? 表示該參數是一個可選參數;
當使用某一個對象中的屬性時,若無法確定該對象是否會為空就需要在后面加上一個問號來進行判空處理,表示若不為空時再去訪問屬性。
2) ?? 的用法
示例:
const foo = str ?? ? 'default'; ?// ?若str 為 null 或 undefined, foo為default
只有當左側為null或者undefined時,才會返回右側的數;主要用于設置默認值
2.感嘆號的用法
1) ! 的用法— !obj
變量前使用表示取反;
可將變量轉為boolean類型: null、undefined、空字符串 取反之后都為true;
2) !! 的用法— !!obj
!! 用于類型判斷,在 ! 之后再做取反
const obj = {a: 1, ? ? ? ?? ??? ?// !obj['a'] 為false; ?? ?!!obj['a'] ?為true;b: '',?? ??? ??? ??? ?// !obj['b'] 為true;?? ?!!obj['b'] ?為false;c: 'test', ??? ??? ?// !obj['c'] 為false;?? ?!!obj['c'] ?為true;d: null,?? ??? ??? ?// !obj['d'] 為true;?? ?!!obj['d'] ?為false;e: undefined,?? ??? ?// !obj['e'] 為true;?? ?!!obj['e'] ?為false;f: {},?? ??? ??? ??? ?// !obj['f'] 為false;?? ?!!obj['f'] ?為true;g: { test: 'test'}?? ?// !obj['g'] 為false;?? ?!!obj['g'] ?為true;h: []?? ??? ??? ??? ?// !obj['h'] 為false;?? ?!!obj['h'] ?為true;i: 0?? ??? ??? ??? ?// !obj['i'] 為true;?? ?!!obj['h'] ?為false;
}
3) ! 的用法— obj!
變量后使用表示類型推斷排除 null、 undefined,告訴TS此處一定有值
示例1:
const uploadRef = ref<UploadInstance>();
uploadRef.value!.clearFiles(); // 給uploadRef斷言
示例2:
function Fun (data: IParams) {const obj = data.name!; ?// 變量值可以為空,為空時返回undefined
}
4)??+ 的用法
記住:在字符串前面添加?+?號,可以將 string 轉化為 number(字符串內容為數字時才有意義)。?