脚本宝典收集整理的这篇文章主要介绍了TypeScript Crash Course: Property Access Modifiers,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
There is no other great moment to head into the world of TypeScript instead of right now. Angular is in TypeScript, React is in TypeScript, and even Vue3 is in TypeScript. That means it's a skill we must equip with rather than wait and see.
This is the first post of my own TypeScript crash course, chances that it's your jam, stay tune;)
public
, private
, protected
and readonly
access modifierpublic
the default access modifier for properties
private
lock the properties inside the cage, no one else except the class in where it's defined can access it. But we could approach it in JavaScript runtime, even by valueOf
method.
protected
as the same as private
, but open a backdoor for derived class.
readonly
the properties marked with readonly
should be initialized either when declare in no time or inside constructor
. But it only works in TypeScript.
/* compile time */
class User {
readonly idCard: string
constructor(idCard: string) {
this.idCard = idCard
}
}
let user = new User('123')
user.idCard = '321' // error hint
/* runtime */
user.idCard = '321'
console.log(user.idCard) // "321", the value of idCard has been changed.
// solution for real readonly properties
class User {
readonly idCard: string
constructor(idCard: string) {
this.idCard = idCard
Object.defineProperty(this, 'idCard', { writable: false })
}
}
/* runtime */
user.idCard = '321' // everything goes well
console.log(user.idCard) // but it's still "123"
It's way too boring to put values into the properties when construct an instance like below
class User {
private readonly idCard: string
protected name: string
age: number
constructor(idCard: string, name: string, age: number) {
this.idCard = idCard
this.name = name
this.age = age
}
}
Fortunately, TypeScript has done that for us. When we specify public
, private
or other access modifiers on the constructor parameters, a corresponding property is created on the class and filled with the value of the parameter. So we could make the previous one much damn shorter like this.
class User {
constructor(private readonly idCard: string, protected name: string, public age: number) {}
}
Pretty cool yet;)
以上是脚本宝典为你收集整理的TypeScript Crash Course: Property Access Modifiers全部内容,希望文章能够帮你解决TypeScript Crash Course: Property Access Modifiers所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。