TypeScript中怎么使用getter和setter


这篇文章主要介绍“TypeScript中怎么使用getter和setter”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“TypeScript中怎么使用getter和setter”文章能帮助大家解决问题。

使用 getset 关键字在 TypeScript 中定义 gettersettergetter 使我们能够将属性绑定到在访问属性时调用的函数,而 setter 将属性绑定到在尝试设置属性时调用的函数。

classDeveloper{private_language='';private_tasks:string[]=[];getlanguage(){returnthis._language;}setlanguage(value:string){this._language=value;}gettasks(){returnthis._tasks;}settasks(value:string[]){this._tasks=value;}}constdev=newDeveloper();dev.language='TypeScript';console.log(dev.language);//?????"TypeScript"dev.tasks=['develop','test'];dev.tasks.push('ship');console.log(dev.tasks);//['develop','test','ship']

Developer 类有 2 个 gettersetter

get 语法将对象属性绑定到函数,因此每次访问该属性时,都会调用该函数。

当我们访问类实例的语言属性时,我们调用的是 language() 方法。

set 语法将对象属性绑定到函数,每次尝试设置属性时,都会调用该函数。

需要注意的是,尽管我们在后台调用类方法,但我们使用 gettersetter 就像在对象上使用常规属性一样。

我们不应尝试将 setter 称为 myInstance.mySetter('TypeScript'),而应将属性设置为 myInstance.mySetter = ‘TypeScript’

请注意,我们在类中声明 _language_tasks 属性时使用了 private 关键字。

classDeveloper{private_language='';private_tasks:string[]=[];getlanguage(){returnthis._language;}setlanguage(value:string){this._language=value;}gettasks(){returnthis._tasks;}settasks(value:string[]){this._tasks=value;}}

具有私有可见性的类成员只能在类本身内部访问。

这很重要,因为我们不希望我们的类的消费者能够访问 _language_tasks 属性。

classDeveloper{private_language='';private_tasks:string[]=[];getlanguage(){returnthis._language;}setlanguage(value:string){this._language=value;}gettasks(){returnthis._tasks;}settasks(value:string[]){this._tasks=value;}}constdev=newDeveloper();//??Error:Property'_language'isprivate//andonlyaccessiblewithinclass'Developer'.ts(2341)console.log(dev._language);

尝试从类外部访问私有属性会导致错误,这正是我们需要的,以确保消费者按预期使用 gettersetter

使用下划线前缀,因为我们需要一个不同的属性名称,以避免我们的 gettersetter 方法中的无限循环。

以下实现会导致无限循环。

classDeveloper{privatelanguage='TypeScript';setlanguage(value:string){//??Error:Maximumcallstackexceededthis.language=value;}}constdev=newDeveloper();

代码中的问题是 - 我们没有使用下划线来为类中的语言属性添加前缀。

因此,每次调用 setter 时,它都会设置属性,并在每次设置属性时不断调用自身。

如果我们只为特定属性定义 getter,则该属性会自动标记为只读。

classDeveloper{private_language='TypeScript';getlanguage(){returnthis._language;}}constdev=newDeveloper();console.log(dev.language);//?????"TypeScript"//??Cannotassignto'language'because//itisaread-onlyproperty.ts(2540)dev.language='TypeScript';

我们只为语言属性分配了一个 getter,因此不能重新分配它。

如果我们没有显式键入 setter 参数,TypeScript 能够从 getter 的返回类型推断它。

classDeveloper{private_language='';getlanguage(){returnthis._language;}//?????(parameter)value:string(inferred)//fromgetterreturntypesetlanguage(value){this._language=value;}}constdev=newDeveloper();dev.language='TypeScript';console.log(dev.language);//?????"TypeScript"

即使我们没有在 setter 中显式键入 value 参数,TypeScript 仍然知道它是 string 类型,因为语言 getter 返回一个 string 类型的值。

我们还可以设置在实例化类时使用 gettersetter 的属性的值。

classDeveloper{private_language='';//?????useaconstructormethodconstructor(language:string){this.language=language;}getlanguage(){returnthis._language;}setlanguage(value:string){this._language=value;}}constdev=newDeveloper('TypeScript');console.log(dev.language);//?????"TypeScript"dev.language='JavaScript';console.log(dev.language);//?????"JavaScript"

实例化类时调用构造函数方法。 该方法采用语言参数并使用已定义的设置器初始化其值。

如果我们不想使用 setter 在构造函数中初始化属性,也可以使用 _language 属性。

classDeveloper{private_language='';constructor(language:string){//?????Notusingsetter(_languageinsteadoflanguage)this._language=language;}getlanguage(){returnthis._language;}setlanguage(value:string){this._language=value;}}constdev=newDeveloper('TypeScript');console.log(dev.language);//?????"TypeScript"dev.language='JavaScript';console.log(dev.language);//?????"JavaScript"

上面的示例没有使用 setter 方法为语言属性设置初始值,因为我们在属性前面加上了下划线。

关于“TypeScript中怎么使用getter和setter”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注主机评测网行业资讯频道,小编每天都会为大家更新不同的知识点。


上一篇:Pandas中怎么对DataFrame列名进行重命名

下一篇:Pytorch中的图像增广transforms类和预处理方法是什么


Copyright © 2002-2019 测速网 www.inhv.cn 皖ICP备2023010105号
测速城市 测速地区 测速街道 网速测试城市 网速测试地区 网速测试街道
温馨提示:部分文章图片数据来源与网络,仅供参考!版权归原作者所有,如有侵权请联系删除!

热门搜索 城市网站建设 地区网站制作 街道网页设计 大写数字 热点城市 热点地区 热点街道 热点时间 房贷计算器