TypeScript可推導的this類型

函數中this默認類型

對象中的函數中的this

// 對象中的this
const obj ={a:1,b:2,fun:function(){//默認情況下，this是any類型console.log(this.a)}
}
obj.fun()//1

明確this指向

• 步驟1：tsc --init，生成文件
  
• 步驟二，打開注釋
• 不讓有模糊的this，必須指定this指向
  
• this就會更嚴格，這個是this根據上下文自行推導出來的類型
  
• 這個是沒有上下文。推導不出來的，在嚴格模式下，不允許模糊this，所以會報錯
  

怎么指定this類型

• 函數的第一個參數我們可以根據該函數之后被調用的情況，用于聲明this的類型，名詞必須叫this
• 在后續調用函數傳入參數的時候。從第二個參數開始傳遞，this參數會在編譯后被抹除

// - 把this作為函數的第一個參數，給指定類型
function fun( this:{name:string},info:{name:string}){console.log(this)//{ name: '名字' }
}
//調用的時候，得這樣調用，不然會報void類型的錯誤
fun.call({name:"名字"},{name:"第二個名字"})

this相關的內置工具

類型轉換

• TS提供了一些工具來輔助進行常見的類型轉換，這些類型全局可用

ThisParameterType<>

• 用于提取一個函數類型Type的this
• 沒有this，則返回unknown

ThisParameterType<>

• 想要移除一個函數類型type的this參數類型，并且返回當前的函數類型

function fun( this:{name:string},info:{name:string}){console.log(this)
}
//獲取函數的類型
type funtype = typeof fun
//想要直接獲取函數的this類型,采用內置組件
type thisType= ThisParameterType<funtype>
//想要移除一個函數類型type的this參數類型，并且返回當前剩余的函數類型
type thisRemove= OmitThisParameter<funtype>export{}

ThisType

• 被用作標記一個上下文的this類型
• 原始方法

//原始獲取this，繁瑣
type User = {name: stringage: number
}
type Intype = {User: Usergetname: () => voidgetage: () => void
}
const username: Intype = {User: {name: "乞力馬扎羅",age: 18},//ts接收指定的this指向getname: function (this:User) {console.log(this.name)//乞力馬扎羅},getage: function (this:User) {console.log(this.age)//18}}
//call() 可以修改函數調用時 this 的指向，其余參數則會作為原函數的參數。
//第一個參數 thisArg。代表 this 將會被指向的值。如果不是對象，也會通過 Object() 方法轉換為對象。如果是 null 或 undefined，this 則會指向全局對象（即 window 或 global）
//傳入this指向
username.getname.call(username.User)
username.getage.call(username.User)
export { }

• 采取ThisType<>

type User = {name: stringage: number
}
type Intype = {User: Usergetname: () => voidgetage: () => void
}
//通過ThisType<User>,將這里以后不管多少函數，this的指向始終是User
const username: Intype & ThisType<User> = {User: {name: "乞力馬扎羅",age: 18},//ts接收指定的this指向getname: function () {console.log(this.name)//乞力馬扎羅},getage: function () {console.log(this.age)//18}}
//call() 可以修改函數調用時 this 的指向，其余參數則會作為原函數的參數。
//第一個參數 thisArg。代表 this 將會被指向的值。如果不是對象，也會通過 Object() 方法轉換為對象。如果是 null 或 undefined，this 則會指向全局對象（即 window 或 global）
//傳入this指向
username.getname.call(username.User)
username.getage.call(username.User)
export { }