如何继承 JavaScript 函数?

阅读时长 3 分钟读完

JavaScript 函数是 JavaScript 中最基本的构建块之一,在编写前端代码时几乎无处不在。因此,函数的继承是非常重要的一部分,它可以让我们更高效地组织代码并将功能复用。

什么是函数继承?

函数继承是指一个新函数从另外一个函数中获取其属性和方法的过程。这个过程中,被继承的函数通常称为“父类”,而继承的函数则称为“子类”。

在 JavaScript 中,函数继承有两种方式:原型继承和类继承。接下来,我们将详细介绍这两种方式。

原型继承

原型继承是 JavaScript 中最常见的继承方式之一。它通过修改子函数的原型链来实现继承。

首先,我们来看一个简单的示例:

-- -------------------- ---- -------
-- --
-------- ------------ -
  --------- - -----
-

---------------------- - ---------- -
  --------------------- - - ----- - ---------
--

-- --
-------- --------- -
  ----------------- ------
-

------------- - --------------------------------
------------------------- - ----

------------------- - ---------- -
  --------------------- - - ---------
--

--- - - --- --------------
---------- -- -- ------- -------

在上面的代码中,我们定义了一个 Animal 父类和一个 Dog 子类。首先我们调用了 Animal.call(this, name) 来继承父类中的属性,然后使用 Object.create(Animal.prototype) 来继承父类中的方法。

注意,我们还需要将子类的构造函数设置为自身(Dog.prototype.constructor = Dog),这样在创建子类实例时就可以通过 new Dog() 调用子类的构造函数了。

最后,我们在子类中定义了一个新的 speak() 方法,覆盖了父类中的同名方法。

类继承

ES6 引入了一种新的继承方式:类继承。类继承提供了更加简洁、直观的语法,并且支持更加复杂的继承关系。

下面是一个使用类继承的示例:

-- -------------------- ---- -------
-- --
----- ------ -
  ----------------- -
    --------- - -----
  -

  ------- -
    --------------------- - - ----- - ---------
  -
-

-- --
----- --- ------- ------ -
  ----------------- -
    ------------
  -

  ------- -
    --------------------- - - ---------
  -
-

----- - - --- --------------
---------- -- -- ------- -------

在上面的示例中,我们使用 class 关键字来定义了父类 Animal 和子类 Dog。使用 extends 关键字来指定子类继承自哪个父类。

在子类的构造函数中,我们通过 super(name) 来调用父类的构造函数并继承了它的属性。然后我们重新定义了 speak() 方法覆盖了父类中的同名方法。

总结

函数继承是 JavaScript 中非常重要的概念,它可以让我们更好地组织代码并将功能复用。在本文中,我们学习了两种不同的继承方式:原型继承和类继承。

无论是哪种方式,都需要我们理解 JavaScript 中原型链和作用域的相关概念。掌握了这些概念之后,我们就可以轻松地实现函数的继承了!

参考资料

  • [MDN 文档:继承与原型

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/15221

纠错
反馈