在TypeScript中Getter/Setter

Question

我正在跟随一个有关Typescript类的教程，讲解者创建了一个类和一些setter/getter方法。但是当我阅读Typescript文档时，这种方法有所不同。有人能帮我理解两种方法之间的区别吗？

方法1：

class Student {
private _name: string;

constructor(name:string) {
    this._name=name;
}

getName = (): string => {
    return this._name;
}

setName = (name: string) => {
    this._name = name;
}
}

方法二：

class Student {
private _name: string;

constructor(name:string) {
    this._name=name;
}

public get name(): string {
    return this._name;
}


public set name(value: string) {
    this._name = value;
}
}

看一下。在方法1中，我们将getter/setter编写为普通函数，但在方法2中使用了关键字get/set。有人能帮我理解两种方法之间的区别吗？

- Raj Thakur

---

你尝试过两个都使用吗？你没有注意到任何区别吗？ - JB Nizet

是的，我尝试过两种方法。我能看到的区别是：在第一种方法中： 例如，我可以使用以下代码： myStudent.setName("ABCD"); console.log(mystudent.getName());但是在第二种方法中，我可以做的是： myStudent.name="XYZ"; console.log(stu.name); - Raj Thakur

Answer 1

它们使用方式的不同。在第一种情况下，您需要显式调用get/set方法。在第二种情况下，您可以像类上的实际字段一样使用name，运行时会自动调用get/set访问器。

考虑一个简单的例子，向名称附加字符：

方法1

let s = new Student();
s.setName(s.getName() + "A") // we need to explicitly call the get/ set methods

方法二

let s = new Student();
s.name += "A" // we can use += and the get/set accessors will get called for us

幕后，get/set访问器方法（方法2）将使用Object.defineProperty

- Titian Cernicova-Dragomir

---

嗨，Titian Cernicova-Dragomir，是的，我也观察到了相同的行为。还有其他主要差异吗？ - Raj Thakur

谢谢你的帮助。我明白了它们之间的区别。同时，指出使用Object.defineProperty也很有帮助。 - Raj Thakur

@RajThakur 这将是主要的区别，我想不到其他重要的事情（除了如果您的目标是es3，则不支持方法2，并且可能无法在非常旧的浏览器中工作）。 - Titian Cernicova-Dragomir