JavaScript 中的方法链式调用

在编程中，将处理特定操作的函数或方法创建为独立的函数或方法被认为是一种最佳实践。虽然可以将所有操作合并到一个方法或函数中，但遵循最佳实践可能会对代码的可读性和清晰度产生负面影响。这主要是因为为每个操作定义一个单独的函数会导致一个函数的输出成为另一个函数的输入。因此，这会使代码理解复杂化，因为可能需要以相反的顺序嵌套函数。方法链提供了解决此问题的方法。

什么是方法链？

方法链是一种编程技术，可以增强代码的简洁性和美观性。它允许在属于同一对象的另一个方法上调用一个方法。在JavaScript中，关键字“this”指向调用它的当前对象。因此，当一个方法返回“this”时，它有效地返回调用它的对象的实例。由于返回的值是对象的实例，因此可以在该实例上调用另一个方法，从而在 JavaScript 中实现方法链。

语法

示例 1

未使用方法链技术

代码

输出

示例 2

在实现方法链后

代码

输出

示例 3

但是，在方法链中，编写方法位于单独的行上

代码

输出

示例 4

当我们希望连续使用多个数组方法时，也可以将相同的原理应用于数组。以下示例演示了数组上的方法链。

未进行方法链的数组对象

代码

输出

示例 5

在数组对象上使用链式方法

代码

输出

示例 6

JavaScript 中的异步函数使用 Promise 来执行其操作。Promise 是此上下文中方法链的一个很好的例子。要实现 Promise，必须首先创建 Promise 本身，然后开发合适的处理程序函数。这些处理程序函数对于在 Promise 解析后处理该值至关重要。下面是示例

使用 Promise

代码

输出

为 JavaScript 中的方法链开发自定义对象

在前面的示例中，我们探讨了方法链在 JavaScript 程序中的应用。在本节中，我们将讨论如何为我们自己的对象实现此技术。我们将创建一个包含多个函数的类，这些函数可以通过方法链来使用。

关键字“this”是方法链的基础，因为它指向正在使用的当前对象。

示例

使用 Promise

代码

输出

在这个说明中，很明显函数通过使用“this”关键字返回当前对象。省略此关键字将阻止方法链的实现。在上述示例中，类“Person”包含一个名为“state”的成员变量。此变量在每次调用类中定义的函数时都会被修改。最终，这些函数通过方法链集体执行。

结论

方法链是 JavaScript 中一项值得注意的功能，有助于减小代码大小并提高其可读性。此技术允许在单个对象上顺序调用多个方法，从而无需使用赋值运算符重复分配同一对象。方法链在处理使用 Promise 的异步函数时特别有效。在从网络检索数据的情况下，这些数据可能与代码执行不同步，因此有必要考虑等待时间。在这种情况下，通常有两种情况：一种是我们指定处理输入后要执行的操作，另一种是我们概述在发生错误时要遵循的步骤。