如何在TypeScript中使用getter和setter？

在TypeScript中，getter和setter是用于分别获取和设置类成员值的两个术语。但是，用户可以通过点运算符直接访问类的公共成员，方法是将特定类的对象作为引用。要访问类的私有成员，只需要使用getter方法。

使用getter访问类的私有成员

就像我们在C++和Java等其他编程语言中创建方法来访问类的私有成员一样，getter在TypeScript中也用于相同目的。我们可以通过在访问器方法的定义前编写get关键字来创建getter，该方法返回某个值。

语法

用户可以按照以下语法定义getter，并使用它来获取私有成员的值。

class employee {
   private emp_Name: string = "Shubham Vora";
   public get name() {
      return this.emp_Name;
   }
}

let man = new employee();
let name_Value = man.name;

在上面的语法中，我们使用get关键字定义了name()方法，并使用name方法访问类的私有成员emp_Name。

在TypeScript中使用'getter'的步骤

步骤1 - 创建employee类。

步骤2 - 将emp_Name、age_of_emp和role作为employee类的私有成员。不要忘记定义每个变量的类型并用一些值初始化它。

步骤3 - 接下来，使用get关键字定义getter来访问员工的姓名和年龄。

步骤4 - 现在，创建employee类的对象。

步骤5 - 使用employee类的对象作为引用和点运算符来调用getter。

开发人员可以观察到，我们没有像普通方法那样调用getter，而是在最后没有编写括号就调用了它。

示例

我们在下面的示例中使用了getter来访问employee类的私有成员。在输出中，用户可以看到我们正在使用getter访问姓名和年龄并显示它们。

Open Compiler
class employee {
   // creating private class members
   private emp_Name: string = "Shubham Vora";
   private age_of_emp: number = 22;
   private role: string = "Content Writer";
   // getters to get the name of the employee
   public get name() {
      return this.emp_Name;
   }
   //  getter to get the age
   public get age() {
      return this.age_of_emp;
   }
}

// Creating the object of the Student class
let man = new employee();

// Call the getter without paranthesis
let name_Value = man.name;
// Print the name
console.log("The name of the employee is " + name_Value);
console.log("The age of the employee is " + man.age);

编译后，它将生成以下JavaScript代码：

Open Compiler
var employee = /** @class */ (function () {
   function employee() {
      // creating private class members
      this.emp_Name = "Shubham Vora";
      this.age_of_emp = 22;
      this.role = "Content Writer";
   }
   Object.defineProperty(employee.prototype, "name", {
      // getters to get the name of the employee
      get: function () {
         return this.emp_Name;
      },
      enumerable: true,
      configurable: true
   });
   Object.defineProperty(employee.prototype, "age",{
      //  getter to get the age
      get: function () {
         return this.age_of_emp;
      },
      enumerable: true,
      configurable: true
   });
   return employee;
}());
// Creating the object of the Student class
var man = new employee();
// Call the getter without paranthesis
var name_Value = man.name;
// Print the name
console.log("The name of the employee is " + name_Value);
console.log("The age of the employee is " + man.age);

输出

以上代码将产生以下输出：

The name of the employee is Shubham Vora
The age of the employee is 22

使用setter设置TypeScript中类成员的值

通常，我们不能通过将对象作为引用来更改TypeScript中类私有成员的值。因此，我们需要使用setter。setter的工作方式与普通方法相同，但是我们需要在方法定义之前添加'set'关键字才能将其设为setter。

语法

用户可以按照以下语法使用setter来更改类私有成员的值。

class employee {
   private emp_Name: string = "Shubham Vora";
   public set name(new_value) {
      this.emp_Name = new_value;
   }
}

let man = new employee();
let man.name = "Shubham";

在上面的语法中，我们使用了set关键字来创建setter方法。通过使用setter，我们更改了emp_name变量的值。

参数

setter方法正好接受一个参数，如下所述。

  • new_Value - 这是我们需要为私有成员设置的值。

在TypeScript中使用'setter'的步骤

步骤1 - 使用set关键字创建setter来更改emp_Name变量的值。

步骤2 - 将new_Value作为setter方法的参数传递。

步骤3 - 创建employee类的对象。我们将通过调用setter来更改emp_Name的值。

步骤4 - 打印emp_Name变量的更新值。

示例

在下面的示例中，我们使用了employee类的对象作为引用和setter方法的名称来访问该方法。我们为setter分配新值，就像为类变量分配值一样。调用setter时，它表示用户不需要将新值作为参数传递，而是可以使用赋值运算符和新值作为右操作数。

Open Compiler
class employee {
   // creating private class members
   private emp_Name: string = "Shubham Vora";
   private age_of_emp: number = 22;
   private role: string = "Content Writer";
   // getters to get the name of the employee
   public get name() {
      return this.emp_Name;
   }
   public set name(new_value: string) {
      this.emp_Name = new_value;
   }
}

// creating the object of the Student class
let man = new employee();

// Call the getter without paranthesis
let name_Value = man.name;
// Print the name
console.log("The name of the employee is " + name_Value);
//   update the employee name using the setters
man.name = "Jems Bond";
console.log(
   "The name of the employee after updating it using the setters is " + man.name
);

编译后，它将生成以下JavaScript代码：

Open Compiler
var employee = /** @class */ (function () {
   function employee() {
      // creating private class members
      this.emp_Name = "Shubham Vora";
      this.age_of_emp = 22;
      this.role = "Content Writer";
   }
   Object.defineProperty(employee.prototype, "name", {
      // getters to get the name of the employee
      get: function () {
         return this.emp_Name;
      },
      set: function (new_value) {
         this.emp_Name = new_value;
      },
      enumerable: true,
      configurable: true
   });
   return employee;
}());
// creating the object of the Student class
var man = new employee();
// Call the getter without paranthesis
var name_Value = man.name;
// Print the name
console.log("The name of the employee is " + name_Value);
//   update the employee name using the setters
man.name = "Jems Bond";
console.log("The name of the employee after updating it using the setters is " + man.name);

输出

以上代码将产生以下输出：

The name of the employee is Shubham Vora
The name of the employee after updating it using the setters is Jems Bond

在本教程中，我们学习了如何在TypeScript中使用getter和setter。

更新于：2022年12月19日

8K+浏览量

启动你的职业生涯

通过完成课程获得认证

开始学习
广告