前言
前幾年我曾經寫過「7天搞懂JS進階議題」系列文章,你可以在我的網站或是CoderBridge閱讀。其中在番外篇提到過「隱私成員」,在當時因為JavaScript並沒有隱私屬性的設計,所以想實現,當時使用了閉包和屬性描述器來處理。
時過境遷,在我寫完發表沒多久,ES11(2020)也正式推出了,其中就有關於私有屬性和私有方法的設計。根據Can I Use使用支援程度已經超過九成,也就是在今天主要瀏覽器除了一些舊版本和特別的瀏覽器外應該多數也都支援了。


原先JavaScript設計的問題
class Person {
name = "";
birthday = new Date();
addr = ""
get age() {
return new Date().getYear() - this.birthday.getYear();
}
constructor(name, birthday, addr = "") {
this.name = name;
this.birthday = birthday;
this.addr = addr;
}
hello() {
console.log(`Hello, ${this.name}.`);
}
}
var bob = new Person(/* name = */ "Bob",
/* birthday = */ new Date(2004/* year */,
1 /* mouth */,
1 /* day */),
/* addr = */ "臺灣")
console.log(`${bob.name}今年${bob.age}歲`); // Bob今年18歲
bob.hello();
bob.birthday = new Date(); // 變更生日
console.log(`${bob.name}今年${bob.age}歲`); // Bob今年0歲
如果設計了一個類別Person
有名字(name
)、生日(birthday
)、地址(addr
)等屬性,從嘗試性來說生日在出生以後就不能夠變了,但是上面程式碼片段當我們建立一個實例物件bob
後,依然可以變更生日。