Typescript中存取器getters和setters的使用

简介: Typescript中存取器getters和setters的使用

1.存取器


存取器可以让我们可以有效的控制对,对象中的中的成员的访问。


可以通过getters和setters来进行操作


在typescript中分别对应 get 和 set


2.如何解决报错


typescript 编译报错:


Accessors are only available when targeting ECMAScript 5 and higher.


报错原因:问器只在针对ECMAScript 5或更高版本时可用


知道了原因我们就可以解决了


执行如下借可以解决了


tsc ./你的文件名.ts -t es5


3.get和set的执行时机


在获取值的时候,会执行get


在修改或者说重新设置值的时候,会执行set


我们来看下面的例子


class Person{
    firstName: string //姓氏
    lastName: string  //名字
    constructor(firstName: string, lastName: string) {
        console.log('在实例化对象的时候,构造器被执行')
        this.firstName = firstName
        this.lastName = lastName
    }
    // 对数据进行读取
    get fullName() {
        console.log('get方法被执行了')
        return this.firstName+"-"+this.lastName
    }
    // 对数据进行修改
    set fullName(str: string) {
        console.log('set方法被执行了')
        this.firstName = str.split('-')[0]
        this.lastName = str.split('-')[1]
    }
}
const per = new Person('张', '无忌');
// 会去执行get方法,因为获取值吗
console.log(per.fullName)
// 会去执行set方法;因为你修改了值
per.fullName = '李-四'

1425695-20210716225022822-1611494427.png


相关文章
|
1月前
|
JavaScript 前端开发 编译器
TypeScript 类 第二章 【参数属性,存取器,静态属性】
TypeScript 类 第二章 【参数属性,存取器,静态属性】
43 2
|
8月前
TypeScript-类存取器 和 TypeScript-抽象类
TypeScript-类存取器 和 TypeScript-抽象类
42 0
|
1月前
|
JavaScript
TypeScript【类的继承、访问修饰符、readonly 修饰符、存取器、实例方法与静态方法、实例属性与静态属性、静态属性、抽象类】(三)-全面详解(学习总结---从入门到深化)
TypeScript【类的继承、访问修饰符、readonly 修饰符、存取器、实例方法与静态方法、实例属性与静态属性、静态属性、抽象类】(三)-全面详解(学习总结---从入门到深化)
28 0
|
JavaScript 数据安全/隐私保护 编译器
TypeScript基础入门 - 类 - 存取器
转载 TypeScript基础入门 - 类 - 存取器 项目实践仓库 https://github.com/durban89/typescript_demo.git tag: 1.1.2 为了保证后面的学习演示需要安装下ts-node,这样后面的每个操作都能直接运行看到输出的结果。
1424 0
|
19天前
|
JavaScript 前端开发 Java
TypeScript 类型兼容性
TypeScript 类型兼容性
|
19天前
|
JavaScript 前端开发
typescript 混合类型
typescript 混合类型
|
3天前
|
JavaScript 前端开发 IDE
TypeScript中的声明文件(.d.ts):扩展类型系统
TypeScript的`.d.ts`声明文件为JS库提供类型信息,增强IDE支持,如自动完成和类型检查。通过声明合并,可在全局作用域定义类型。示例包括为`my-library`创建声明模块,导出函数和接口。声明文件通常存于`@types`或指定`typeRoots`。用于旧JS代码的类型注解,如`myGlobalObject`。学习更多,参阅TypeScript官方文档。分享你的TS声明文件经验!
|
15天前
|
JavaScript 前端开发 安全
TypeScript:静态类型的动态语言
【6月更文挑战第9天】TypeScript是JavaScript的静态类型超集,解决JS类型安全问题,提供更强的代码组织和维护。它引入静态类型、接口和类,增强类型安全,减少运行时错误。TS与JS无缝集成,兼容现有库和框架,拥有丰富的开发工具和活跃社区。广泛应用在各种规模项目中,尤其提升复杂前端应用的代码质量。学习TypeScript对提升开发效率和代码可靠性极具价值。
25 10
|
13天前
|
前端开发 JavaScript 安全
TypeScript作为一种静态类型的JavaScript超集,其强大的类型系统和面向对象编程特性为微前端架构的实现提供了有力的支持
【6月更文挑战第11天】微前端架构借助TypeScript提升开发效率和代码可靠性。 TypeScript提供类型安全,防止微前端间通信出错;智能提示和自动补全加速跨代码库开发;重构支持简化代码更新。通过定义公共接口确保一致性,用TypeScript编写微前端以保证质量。集成到构建流程确保顺利构建打包。在微前端场景中,TypeScript是强有力的语言选择。
28 2
|
19天前
|
JavaScript
TypeScript 泛型类型
TypeScript 泛型类型