在 ES6 中，引入了 Class 关键字，这是一种新的声明方式，用于定义一个类。相比于以前的构造函数和原型链方式，Class 的语法更加简洁明了，更加符合面向对象编程的思想。在本文中，我们将探究 ES6 中的 Class 声明方式，深入了解其特性和用法。
Class 的基本语法
Class 的基本语法如下：
-- -------------------- ---- -------
----- ------- -
------------- -
-- ----
-
--------- -
-- ---
-
--------- -
-- ---
-
-这里定义了一个名为 MyClass 的类，它有一个构造函数和两个方法 method1 和 method2。构造函数用于创建对象实例，而方法则用于操作对象。
构造函数
Class 中的构造函数使用 constructor 关键字声明，该函数会在创建对象实例时调用。可以在构造函数中初始化对象的属性和方法。
-- -------------------- ---- -------
----- ------ -
----------------- ---- -
--------- - -----
-------- - ----
-
---------- -
------------------- -- ---- -- ------------- --- ----------- ----- -------
-
-
----- ------ - --- ------------- ----
------------------ -- --------- -- ---- -- ---- --- -- ----- ----在这个例子中，我们定义了一个 Person 类，它有两个属性 name 和 age，以及一个方法 sayHello。在构造函数中，我们使用传入的参数初始化了对象的属性。当我们创建一个 Person 对象实例时，它会调用构造函数，并输出 "Hello, my name is Tom, I'm 18 years old."。
类的继承
类可以通过继承来扩展其属性和方法。在 ES6 中，使用 extends 关键字来实现继承。
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
----- -
------------------------- -- ----------
-
-
----- --- ------- ------ -
------ -
------------------------- -- -----------
-
-
----- --- - --- -------------
---------- -- -------- -- -------
----------- -- -------- -- --------在这个例子中，我们定义了一个 Animal 类和一个 Dog 类，Dog 类继承了 Animal 类。在 Dog 类中，我们添加了一个 bark 方法。当我们创建一个 Dog 对象实例时，它会继承 Animal 类的属性和方法，并可以调用自己的 bark 方法。
类的静态方法
类还可以定义静态方法，它们可以直接在类上调用，而无需创建对象实例。在 ES6 中，使用 static 关键字来声明一个静态方法。
-- -------------------- ---- -------
----- --------- -
------ ------ -- -
------ - - --
-
------ ----------- -- -
------ - - --
-
-
---------------------------- ---- -- ----
--------------------------------- ---- -- ----在这个例子中，我们定义了一个 MathUtils 类，它有两个静态方法 add 和 subtract。这些方法可以直接在类上调用，而无需创建对象实例。
类的 get 和 set 方法
在 ES6 中，Class 还提供了 get 和 set 方法，用于访问类的属性。get 方法用于获取属性的值，而 set 方法用于设置属性的值。
-- -------------------- ---- -------
----- ------ -
---------------------- --------- -
-------------- - ----------
------------- - ---------
-
--- ---------- -
------ ------------------ ------------------
-
--- -------------- -
----- ----------- --------- - ------------ ---
-------------- - ----------
------------- - ---------
-
-
----- ------ - --- ------------- ---------
----------------------------- -- ------ -----
--------------- - ----- -----
------------------------------ -- -------
----------------------------- -- ------在这个例子中，我们定义了一个 Person 类，它有两个属性 firstName 和 lastName。我们使用 get 和 set 方法来访问 fullName 属性，当我们获取 fullName 属性时，它会返回 firstName 和 lastName 的组合字符串，当我们设置 fullName 属性时，它会将字符串分割成 firstName 和 lastName，并分别设置到对象的属性中。
总结
在本文中，我们探究了 ES6 中的 Class 声明方式，学习了其基本语法、构造函数、类的继承、静态方法、get 和 set 方法等。相比于传统的构造函数和原型链方式，Class 的语法更加简洁明了，更加符合面向对象编程的思想。在日常的前端开发中，我们可以使用 Class 来创建对象，继承其他类的属性和方法，以及定义静态方法和访问器方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65119d3c95b1f8cacda266ac