在这篇博文中,我们将学习Typecript中的get和set Accessor方法或Encapsulation。
封装在Typescript中是如何工作的?
它是面向对象编程的概念之一。其他概念包括类、接口、多态性和抽象类。
每个类或对象都包含两件事
- 用于存储数据的成员变量或属性
- 操作数据或变量或属性的函数/方法代码。
数据被保护起来,不受外界影响,因此不能直接访问,但可以通过方法/函数代码访问。这些方法或函数被称为setter 和getter
这使得开发者可以在特定的入口处访问数据,并且在发生任何错误时都可以轻松地调试代码。
Typescript使用set和get访问器方法提供了封装功能:
- 将成员变量定义为私有关键字
- 为更新和读取成员变量声明公开的set和get方法
由于typescript是静态类型检查,在编译成javascript时没有代码产生。
如何使用编译器目标选项启用设置器和获取器?
typescript编译器默认不支持setters和getters访问器。
要启用这一点,我们需要修改typecript编译器的选项,以ES5为目标。否则就会出现 "错误 TS1056: Accessors只有在针对ECMAScript 5和更高版本时才可用。"被抛出。
tsc命令配置
你已经为tsc命令工具提供了编译器选项
tsc --target ES5
更新tsconfig.json的目标选项
在Angular应用程序中,为了支持set和get访问器语法,我们必须修改tsconfig.json的compilerOptions - target - es5
{
"compilerOptions": {
"target": "es5"
........
}
}
类型脚本封装实例
这里Employee对象的名字被设置为private,Private修改器属性只允许在类内部访问,外部无法访问。为了简单起见,我们为名字提供了getter/setter方法,并添加了public access修饰符来访问/操纵类外。
这是一个设置 和获取访问器方法的例子。
export class Employee {
private _name: string;
constructor() {
}
public get name(): string {
return this._name;
}
public set name(val: string) {
this._name= val;
}
}
export default Employee;
优点
- 数据被隐藏起来,并使数据可以通过get和set访问器方法被访问。
- 在检查属性变量数据的正确性时,非常容易进行调试。
Typescript接口的set和get访问器方法
Typescript不直接支持接口中的setter/getters方法。我们必须使用一种不同的语法。接口只需要提供成员变量,并没有为这些属性提供实现。实现类使用setter和getter来访问成员变量。
interface MyInterface {
name: string;
}
class MyClass implements MyInterface {
private name: string="Kiran";
public get name() {
return this._name;
}
public set name(value: string) {
this._name = value;
}
}
var myClass = new MyClass();
console.log(myClass.name);
Typescript setter和getter的命名规则
- setter和getter不应该有复杂的逻辑
- get和set的后缀应该有一个相同的名字
- get和set是typecript中的保留关键字。