JavaScript 新語法詳解：Class 的私有屬性與私有方法
譯者按：為什麼偏要用# 符號?
本文采用意譯，版權歸原作者所有
proposal-class-fields 與proposal-private-methods 定義了 Class 的私有屬性以及私有方法，這 2 個提案已經處於 Stage 3，這就意味著它們已經基本確定下來了，等待被加入到新的 ECMAScript 版本中。事實上，最新的 Chrome 已經支援了 Class 私有屬性。
那麼，對於 Class 的私有屬性與私有方法，它們究竟是什麼呢？它們是怎樣工作的？為什麼要使用# 符號來定義呢？
Class 的私有屬性語法如下：
class Point {
#x;
#y;
constructor(x, y) {
this.#x = x;
this.#y = y;
}
equals(point) {
return this.#x === point.#x && this.#y === point.#y;
}
}
我們可以將其語法理解為 2 個部分：
- 定義 Class 私有屬性
- 引用 Class 私有屬性
定義 Class 私有屬性
私有屬性與公共屬性的定義方式幾乎是一樣的，只是需要在屬性名稱前面新增# 符號：
class Foo {
publicFieldName = 1;
#privateFieldName = 2;
}
定義私有屬性的時候也可以不用賦值：
class Foo {
#privateFieldName;
}
引用 Class 私有屬性
引用私有屬性也只需要使用# 就好了。
class Foo {
publicFieldName = 1;
#privateFieldName = 2;
add() {
return this.publicFieldName + this.#privateFieldName;
}
}
其中，this.# 可以簡化，去掉 this 也沒問題，下面兩種寫法是等價的：
method() {
#privateFieldName;
}
method() {
this.#privateFieldName;
}
在 Class 定義中引用 Class 例項的私有屬性
對於私有屬性，我們是不可以直接通過 Class 例項來引用的，這也是私有屬性的本來含義。但是有一種情況除外，在 Class 定義中，我們可以引用 Class 例項的私有屬性：
class Foo {
#privateValue = 42;
static getPrivateValue(foo) {
return foo.#privateValue;
}
}
Foo.getPrivateValue(new Foo()); // >> 42
其中，foo 是Foo 的例項，在 Class 定義中，我們可以通過 foo 來引用私有屬性#privateValue 。
Class 的私有方法
Class 的私有屬性是提案proposal-class-fields 的一部分，這個提案只關注 Class 的屬性，它並沒有對 Class 的方法進行任何修改。而 Class 的私有方法是提案proposal-class-fields 的一部分。
Class 的私有方法語法如下：
class Foo {
constructor() {
this.#method();
}
#method() {
// ...
}
}
我們也可以將函式賦值給私有屬性：
class Foo {
constructor() {
this.#method();
}
#method = () => {
// ...
};
}
封裝(隱藏)私有屬性
我們不能直接通過 Class 例項引用私有屬性，我們只能在 Class 定義中引用它們：
class Foo {
#bar;
method() {
this.#bar; // Works
}
}
let foo = new Foo();
foo.#bar; // Invalid!
另外，要做到真正的私有 的話，我們應該無法檢測這個私有屬性是否存在，因此，我們需要允許定義同名的公共屬性：
class Foo {
bar = 1; // public bar
#bar = 2; // private bar
}
如果我們不允許公共屬性與私有屬性同名，我們則可以通過給同名的公共屬性複製監測該私有屬性是否存在：
foo.bar = 1; // Error: `bar` is private! (報錯，說明私有屬性存在)
不報錯也行：
foo.bar = 1; foo.bar; // `undefined` (賦值失敗，說明私有屬性存在)
對於 subclass 應該同樣如此，它也允許公共屬性與私有屬性同名：
class Foo {
#fieldName = 1;
}
class Bar extends Foo {
fieldName = 2; // Works!
}
關於 Class 私有屬性的封裝，可以參考Why is encapsulation a goal of this proposal? 。
為什麼使用#符號？
很多人都有一個疑問，為什麼 JS 不能學習其他語言，使用private 來定義私有屬性和私有方法？為什麼要使用奇怪的# 符號？
使用 private 的話，程式碼要舒服很多：
class Foo {
private value;
equals(foo) {
return this.value === foo.value;
}
}
為什麼不使用 private 來定義私有屬性?
很多語言使用 private 來定義私用屬性，如下：
class EnterpriseFoo {
public bar;
private baz;
method() {
this.bar;
this.baz;
}
}
對於這些語言屬性，私用屬性和公共屬性的引用方式是相同的，因此他們可以使用 private 來定義私有屬性。
但是，對於 JavaScript 來說，我們不能使用 this.field 來引用私有屬性（我接下來會解釋原因），我們需要在語法層面上區分私有屬性和公共屬性。在定義和引用私有屬性的時候，使用# 符號，私有屬性與公共屬性可以很好地區分開來。
為什麼引用私有屬性的時候需要#符號?
引用私有屬性的時候，我們需要this.#field ，而不是this.field ，原因如下：
-
因為我們需要封裝私有屬性，我們需要允許公共屬性與私有屬性同名，因此私有屬性與公共屬性的引用方式必須不一樣。這一點我們在前文已經詳述。
-
公共屬性可以通過this.field 以及this[‘field’] 來引用，但是私有屬性不能支援this[‘field’] 這種方式，否則會破壞私有屬性的隱私性，示例如下：
class Dict extends null {
#data = something_secret;
add(key, value) {
this[key] = value;
}
get(key) {
return this[key];
}
}
new Dict().get("#data"); // 返回私有屬性
因此，私有屬性與公共屬性的引用方式必須不一樣，否則會破壞this[‘field’] 語法。
- 私有屬性與公共屬性的引用方式一樣的話，會導致我們每次都需要去檢查屬性是公共的還是私有的，這會造成嚴重的效能問題。
這篇文章遵循Creative Commons Attribution 4.0 International License 。