在过去，JavaScript中的类都是基于原型继承的机制。虽然 ES6引入了 class 语法，为JavaScript的面向对象编程提供了正式的支持，但没有提供封装的机制，导致开发人员必须使用一些约定和技巧（如属性前面添加下划线）来达到代码封装的效果。但这种方式只能称为“伪封装”，并且没有任何真正的安全保障。随着ES11的发布，我们现在可以使用私有类字段来实现真正的代码封装和安全保护。
Private Class Fields简介
私有类字段是JavaScript的一个新特性，用于将类的内部状态封装起来，只有类自身可以访问这些字段，可以理解为类的私有变量。使用私有类字段可以防止外部代码意外地修改类的状态，从而提高代码的健壮性和安全性。
私有类字段是在实例化时动态创建的，因此无法从类的实例外部访问它们。它们的命名以“#”开头，例如：
-- -------------------- ---- -------
----- ------ -
------
----------------- -
---------- - -----
-
--------- -
------ -----------
-
-在上面的代码中，我们定义了一个Person类，并且使用私有类字段 #name 存储了一个人的名字。在构造函数中，我们可以将传入的参数name赋给#name，使其成为Person实例的私有变量。此外，我们还定义了getName方法，用于从实例中获取#name。由于私有类字段 #name 是私有的，所以只能从Person类的内部访问它，不能从类的实例外部访问它。
Private Class Fields的优势
私有类字段提供了许多优点，使JavaScript的类更加强大和灵活：
更安全的代码
私有类字段的存在可以防止不小心意地修改类的状态。在使用私有类字段时，只有类自身可以访问它们，从而大大降低了出错的概率。
更有效的封装
使用私有类字段可以更有效地封装类的内部状态，并将其保护起来。在ES6之前，我们可以使用闭包和IIFE来达到类似的效果，但私有类字段在实现代码封装方面更加简单和直接。
更灵活的控制
私有类字段为类提供了更灵活的控制，可以在外部控制类的状态，同时又保证了类的封装性和安全性。例如，你可以使用setters和getters来访问私有类字段，并根据需要进行更改或修改。
Private Class Fields的实践
让我们来看一个具体的例子，说明如何使用私有类字段。
-- -------------------- ---- -------
----- ---- -
------
-----
-------
----------------- ---- -
---------- - -----
--------- - ----
----------- - -
--- ------ -
------ -----------
--
--- ----------- -
-- -------- -- -------------- -
----- --- -------------- --------
-
---------- - -------------
--
--- ----- -
------ ----------
--
--- ---------- -
-- ------- ----- --- -------- -- ----- - - -- ----- - ---- -
----- --- -------------- -------
-
--------- - ------
--
--
-
-在上面的代码中，我们定义了一个User类，并使用私有类字段 #name 和 #age 来存储用户名和年龄。在构造函数中，我们将传入的值分别赋值给#name和#age。由于#name和#age是私有的，所以只能从User类的内部使用它们。
此外，我们还定义了一个getter对象，其中包含四个访问器：三个getters用于获取name和age值，一个setter用于设置name和age值。getters和setter用于从外部访问私有字段，并根据需要进行更改或修改。
在setter中，我们还添加了一些验证逻辑来确保传入的值是有效的。如果传入的name或age不是一个有效的字符串或数字，将抛出一个错误。这个例子演示了如何使用私有类字段和getter/setter对象来提高类的封装性和安全性。
结论
私有类字段是ES11中的一个重要特性，使JavaScript语言的面向对象编程更加强大和灵活。使用私有类字段，我们可以更有效地封装类的内部状态，并保护类的安全性。它可以帮助开发人员避免不必要的错误，并提高代码的可维护性和可读性。如果你想写更好的JavaScript代码，私有类字段是值得掌握的重要部分。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66f0c8586fbf96019733f3e5