在 ES6 中,我们可以用 class
声明一个类,而不仅仅是用构造函数来表示一个类。这种语法的增强为我们提供了更加优美的语法来表示一个对象的结构,它也大幅度地增强了面向对象编程的能力。
class
的语法
class
的语法非常简单,与其他高级语言的语法相似。以下是一个示例:
-- -------------------- ---- ------- ----- ------ - ----------------- - --------- - ----- - --------- - --------------- ---- -- --------------- - -
在上述示例中,我们声明了一个 Animal
类,它有一个名为 constructor
的方法来初始化实例属性。我们也定义了一个方法 sayName
来在控制台输出 this.name
。
继承
我们也可以使用 extends
关键字来继承一个类。以下是一个示例:
class Dog extends Animal { bark() { console.log('Woof!'); } }
在上述示例中,我们声明了一个 Dog
类继承了 Animal
类。 Dog
类还定义了一个方法 bark()
。
super()
在子类的构造函数中,我们必须先调用 super
函数来调用父类的构造函数来初始化它的属性。以下是一个示例:
-- -------------------- ---- ------- ----- --- ------- ------ - ----------------- ------ - ------------ ---------- - ------ - ------ - --------------------- - -
在这个例子中,我们声明了一个名为 Dog
的类,它的构造函数接受了两个参数。我们还在这个构造函数中调用了 super(name)
,来初始化 Animal
类的 name
属性。
类和模块
在 ES6 中,每个模块都是一个独立的文件,因此它们具有单独的作用域。当我们声明一个类时,它只存在于当前的模块中。以下是一个示例:
-- -------------------- ---- ------- -- ------ ----- ------ - ----------------- - --------- - ----- - --------- - --------------- ---- -- --------------- - - ------ ------- ------- -- -------- ------ ------ ---- -------- ----- --- ------- ------ - ------ - --------------------- - - ----- --- - --- ------------ -------------- -----------
在这个例子中,我们声明了一个 Animal
类,并在 dog.js
中导出它。在 index.js
中,我们导入了 Animal
类并将它用于子类 Dog
类。我们还创建了一个实例 dog
,并调用了它的 sayName()
和 bark()
方法。
总结
在本文中,我们学习了 ES6 中的类语法,以及它如何更好地实现面向对象编程。我们学习了用 class
来声明类和使用 extends
来继承。我们还学习了 super()
的使用,以及如何将类与模块结合使用。了解这些语法是每个前端开发人员必须掌握的技能之一。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/65b099a4add4f0e0ff9f3f2b