ES12（也称为 ES2022）是 JavaScript 最新的标准版本之一，其中引入了许多新的语言特性和功能。其中，class fields 功能可以让开发人员更轻松地定义类的属性，并且可以更简洁地表达类的逻辑。
在传统的 JavaScript 中，我们通常使用构造函数或对象字面量来创建类。然而，这些方法并不完美，它们有时会让代码看起来比较冗长，且缺乏一些更精简的特性。ES12 中的 class fields 旨在解决这些问题，使得编写 JavaScript 类成为一项更加轻松、更加流畅的任务。
class fields 简介
在 ES12 中，我们可以使用 class fields 来定义类的属性。在传统的 JavaScript 中，我们必须使用构造函数来设置对象的属性值，但在 ES12 中，我们可以在类定义中直接设置属性的值。
下面是一个简单的示例，展示了如何使用 class fields 来定义一个类的属性：
----- ------ - ---- - -------- --- - --- -
在上面的示例中，我们定义了一个名为 Person 的类，并使用 = 运算符在类定义中声明了两个属性 name 和 age。这允许我们更轻松地设置一个对象的属性值，而不用通过构造函数或对象字面量来完成。同时，我们也可以使用这些属性来访问实例化的对象。
class fields 的优势
使用 ES12 中的 class fields 有几个主要的优势。首先，它允许我们更轻松地设置对象的属性值，而不需要使用额外的逻辑或代码。其次，它可以让我们更容易地理解和维护代码。
在传统的 JavaScript 中，我们经常需要在构造函数中写一些额外的逻辑来设置对象的属性值。这会让代码变得比较混乱，尤其是当你的类有很多属性时。ES12 的 class fields 允许我们把这些逻辑写在类定义中，从而使代码变得更加精简和直观。
同时，当我们使用 class fields 定义类属性时，我们也可以更容易地理解代码，因为我们不需要查看构造函数或其他逻辑来了解类的属性值。这可以帮助我们更好地组织和维护代码，特别是在处理大型或复杂的类和项目时。
示例代码
下面是一个示例代码，展示了如何使用 ES12 中的 class fields 来定义一个简单的 JavaScript 类。这个类表示一个人的基本信息，包括姓名、年龄和出生日期。
----- ------ -
---- - ---
--- - --
--- - -----
----------------- ---- ---- -
--------- - -----
-------- - ----
-------- - ----
-
--------- -
------ ----------
-
-------- -
------ ---------
-
-------- -
------ ---------
-
-
----- ------ - --- --------------- --- --- --------------------
------------------------------ -- --- -----
----------------------------- -- --- --
----------------------------- -- --- --- --- -- ---- -------- -------- --------在上面的示例中，我们首先定义了一个 Person 类，并通过 = 运算符在类定义中设置了三个属性 name、age 和 dob。接着，我们定义了一个类的构造函数，并在其中使用 this 关键字来设置实例的属性值。最后，我们定义了三个用于获取类属性值的方法 getName()、getAge() 和 getDob()，以及一个用于创建类实例的示例 person。
结论
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/67242c982e7021665e1285de