在传统的 JavaScript 中，属性和方法是被定义在类的原型上的，这意味着它们可以被类的任何实例直接访问或修改。但是，ES12 提供了 Private Class Fields 的功能，在类中定义的属性将不再是公共的，而是只能在类内部使用。
本文将介绍 Private Class Fields 的语法和特性，以及如何在前端开发中使用它来保护类的属性。
语法和特性
Private Class Fields 的语法非常简单，只需要在属性名前面加上井号（#）即可：
-- -------------------- ---- -------
----- ------ -
------
----------------- -
---------- - -----
-
-
----- ---- - --- ---------------
------------------------ -- ----在这个例子中，我们定义了一个 Person 类，并在其中定义了一个私有属性 #name。在类的构造函数中，我们使用了这个私有属性并赋值，这意味着这个属性只能在类的内部使用。
在类的外部无法直接访问私有属性，而是需要使用类的实例上的方法来操作它：
-- -------------------- ---- -------
----- ------ -
------
----------------- -
---------- - -----
-
--------- -
------ -----------
-
-
----- ---- - --- ---------------
---------------------------- -- ------这里，我们添加了一个 getName() 方法，可以在类的外部访问私有属性 #name 的值。
还有一个特殊的名称，可以在类的外部访问私有属性，即使用类的实例的属性名。例如：
-- -------------------- ---- -------
----- ------ -
------
----------------- -
---------- - -----
-
-
----- ---- - --- ---------------
--------------------------- -- ---------这里，在类的外部使用实例的属性名访问私有属性时，会返回 undefined。
在前端开发中的应用
在前端开发中，Private Class Fields 的应用非常广泛。例如，我们可以使用它来保护类的属性，以避免被意外改变。另外，我们还可以使用它来模拟私有属性、模块作用域等等。
下面就来看一个实际的例子，使用 Private Class Fields 来模拟私有属性：
-- -------------------- ---- -------
-- ----------
----- ------ -
------
----------------- -
---------- - -----
-
--------- -
------ -----------
-
-
------ ------- -------
-- ----------
------ ------ ---- ---------------
----- -------- ------- ------ -
--------
----------------- ------- -
------------
------------ - -------
-
----------- -
------ -------------
-
-
------ ------- ---------
-- -------
------ -------- ---- ---------------
----- ---- - --- ---------------- ------
---------------------------- -- ------
------------------------------ -- ----在这个例子中，我们有一个 Person 类，它有一个私有属性 #name。类 Employee 继承了 Person 类，并添加了一个私有属性 #salary。在 main.js 中，我们创建了一个 Employee 实例 john，并调用了它的 getName() 和 getSalary() 方法。
使用 Private Class Fields 可以保证 #name 和 #salary 属性只能在类内部被访问和修改，避免了意外的修改和滥用。
总结
在本文中，我们学习了 Private Class Fields 的语法和特性，以及它在前端开发中的应用。Private Class Fields 可以保护类的属性，避免被意外修改和异常访问，能够提高代码的可读性和可维护性。
使用 Private Class Fields 可以模拟私有属性、模块作用域等等，提高了代码的封装性和安全性。希望通过本文的介绍，能够在实际项目中更加灵活地应用 Private Class Fields。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e1f270f6b2d6eab3d42b71