腳本之家服務器常用軟件

快捷導航

軟件下載

android MAC 驅動下載字體下載 DLL

源碼下載

PHP ASP.NET ASP JSP

軟件編程

C# JAVA C 語言 Delphi Android

網(wǎng)絡編程

PHP ASP.NET ASP JavaScript

在線工具

CSS格式化 JS格式化 Html轉化為Js

數(shù)據(jù)庫

MYSQL MSSQL oracle DB2 MARIADB

CMS

PHPCMS DEDECMS 帝國CMS WordPress

常用工具

PHP開發(fā)工具 python Photoshop 必備軟件

TypeScript函數(shù)和類型斷言實例詳解

更新時間：2022年06月08日 16:35:59 作者：成成請努力

在某些情況下,我們會比TS更清楚一個數(shù)據(jù)的類型,這種時候我們就可以使用斷言來告訴TS相信我,我知道自己在干什么,下面這篇文章主要給大家介紹了關于TypeScript函數(shù)和類型斷言的相關資料,需要的朋友可以參考下

開始

現(xiàn)在要加速學習了，大佬們有沒有內推，給個推薦

會vue2/vue3 + ts

斷言

非空斷言

非空斷言就是確定這個變量不是null或者undefined，就是把null或者undefined從他的類型中排除

function demo(message:string|undefined|null) {
    const str: string = message
}
demo(undefined)

此時我們沒有用非空斷言，message的值是undefined和null，所以不能賦值給str，此事運行會報錯（Type 'string | null | undefined' is not assignable to type 'string'.Type 'undefined' is not assignable to type 'string'.）

如果用上非空斷言

let message:string
function demo(message:string|undefined|null) {
    const str: string = message!
}
demo(undefined)

此時代碼沒有問題

類型斷言

確定此時的變量類型

尖括號

我們可以用尖括號

let message: any = "scc"
let mesLength:number = (<string>message).length

as

as用來判斷變量是不是后面的類型

let message: any = "scc"
let mesLength:number = (message as string).length

確定賦值斷言

這個變量一定會被賦值，就可以使用確定賦值斷言

let message!:string

變量名后面添加一個！就可以

類型守衛(wèi)

ts類型守衛(wèi)就是起到一個縮小類型范圍作用

trpeof

typeof關鍵字可以使用===判斷此時的類型是什么

function demo(message: string | number | boolean) {
    if (typeof message === "string") {
        message.toUpperCase()
    }
}

此時message的類型被縮小成string類型，所以能調用toUpperCase方法

道理很簡單，相信有一定基礎的同學很快就會明白

in

in用來判斷變量是否在類型范圍內

interface Person {
    name: string
    age:number
}
interface Dog {
    name: string
    walk:string
}
type x = Dog|Person
function all(emp: x) {
    if ("walk" in emp) {
        console.log(d.walk);
    }
}

函數(shù)

可選參數(shù)

參數(shù)可以設成可選參數(shù)，可選參數(shù)最好在必填參數(shù)和有默認值的參數(shù)后面

function demo(num:number,str?:string){
}

默認值參數(shù)

function demo(num:number,bol:boolean = true,str?:string){ 
}

bol就是有默認值的參數(shù)，如果傳值，那么值為傳來的值，不傳就是默認值

函數(shù)重載

函數(shù)重載可以讓函數(shù)根據(jù)傳值得類型，自動選擇應該執(zhí)行的函數(shù)

function add(a1: number, a2: number):number
function add(a1: string, a2: string):string
function add(a1: any, a2: any):any {
        return a1 + a2
}
console.log(add(20,30));
console.log(add("scc","brd"));