使用getter＆setter和公共屬性之間的區別

Question

我是JS的新手，正在學習JS中的抽象以及getter和setter的使用。 因此，據我所知，可以使用object.defineProperty來實現getter和setter，但是伙計們，是什么原因允許通過getter和setter而不是公共財產訪問私有財產。 因為，使用getter可以讀取私有財產，而使用setter可以將新值設置為私有財產。 如果我們使用公共財產也可以讀取公共財產的價值並為其設置新的價值，這是不一樣的。 當我們可以使用公共屬性同時實現getter和setter時，我只是無法理解為什么要使用getter和setter。 希望你明白我的意思。

Answer 1

通常，在屬性訪問時，除了簡單地設置/檢索數據之外，類還需要執行某些操作時，getter / setter很有用。 例如：

 class MyClass { constructor() { this.setHistory = []; } set item(newVal) { this.setHistory.push(newVal); this._item = newVal; } get item() { return this._item; } } const f = new MyClass(); f.item = 'foo'; f.item = 'bar'; console.log(f.setHistory); 

在上面，可以使用設置功能存儲以前設置了哪些項目的“歷史記錄”。 如果沒有setter函數，則只有一個公共item屬性，該類將無法保存歷史記錄。

如果getter / setter所要做的只是設置或檢索值，那么您說對了，它幾乎沒有用，例如：

 class MyClass { set item(newVal) { this._item = newVal; } get item() { return this._item; } } const f = new MyClass(); f.item = 'foo'; f.item = 'bar'; console.log(f.item); 

在這里，setter和getter根本沒有做任何有用的事情，因此您可以刪除它們。 通常，當您要執行除存儲/檢索值之外的其他操作時，請使用setter / getter。

setter和getter還可用於隱藏對消費者不重要的實現細節。 （例如，分配給.innerHTML 與調用設置器非常相似 。）

它們在調試時也很有用，例如在更改對象時記錄日志。

一個警告：上面的第一個代碼片段實際上並不使用“私有”屬性，它只是使用_ -prefix約定來指示該屬性不應在外部使用。 對於無法從外部訪問的真實私有屬性，應定義WeakMap並使用IIFE創建類：

 // with this class, // neither item nor history can be accessed without going through the getters const MyClass = (() => { const privateDatas = new WeakMap(); return class MyClass { constructor() { privateDatas.set(this, { setHistories: [] }); } set item(newVal) { const privates = privateDatas.get(this); privates.setHistories.push(newVal); privates.item = newVal; } get item() { return privateDatas.get(this).item; } getSetHistory() { return privateDatas.get(this).setHistories; // if you want to make sure the internal array doesn't get mutated outside, // return a copy: .setHistories.slice() } } })(); const f = new MyClass(); f.item = 'foo'; f.item = 'bar'; console.log(f.getSetHistory()); 

Answer 2

每個getter / setter都不需要真正存在該字段。 一個示例是Date ，我相信它只存儲毫秒，但是您可以獲得所有信息（它不使用新的getter / setter語法，但是概念相同）

---

這是使用新語法的Date的簡單包裝，希望可以使它更加清晰。

 class NewSyntaxDate{ constructor(){ this.date = new Date() } get Hours(){return this.date.getHours()} set Hours(h){this.date.setHours(h)} get Minutes(){return this.date.getMinutes()} set Minutes(m){this.date.setMinutes(m)} } let date = new NewSyntaxDate() console.log(date.Hour) console.log(date.Minutes) console.log(date.date) date.Hours = 0 date.Minutes = 0 console.log(date.date) 

---

其他用途包括僅使用getter或僅使用setter。 數據驗證（設置為內部字段之前）。 其他領域的別名...