什么是JavaScript中的函数链接？

Z时代
2024-01-10
分类：综合

功能链

函数链接不过是使用点表示法将函数分组在一行中而已。这种类型的链接使代码非常简洁，并提高了性能。在这里，我们将学习使用常规对象进行函数链接。

a）没有功能链

在以下示例中的对象“OBJ”被创建并在该对象中的公共属性称为“I”是使用关键字创建“这个”和最初分配的值0以后称为用户定义的函数add()，subtract()和print()相同的对象内被创建'obj'。现在，对象“ obj”将像一个类一样工作（它的属性可以被其他对象共享）。

现在，使用关键字“ new”创建了另一个名为“ x”（用户定义）的对象，并使该对象可访问以使用对象“ obj”的属性。因为，功能的“物镜”，如内声明add()，subtract()并且print()不会返回，功能链接是不可能的未定义的被显示为输出，而单独地（非链式）为3（用户提供“5-2的那些功能将执行输出'）。

示例

<html>
<body>
<script>
   var obj = function(){
      this.i = 0;
      this.add = function(i){
         this.i += i;
       };
       this.subtract = function(i){
          this.i -= i;
       };
       this.print = function(){
          document.write(this.i);
          document.write("</br>");
          document.write(x.add(3));  // returns undefined
       }
   }
   var x = new obj();
   x.add(5);
   x.subtract(2);
   x.print(); // 5-2 = 3 so prints 3.
   x.add(5).subtract(2).print();  //  function chaining is not possible so undefined
</script>
</body>
</html>

输出结果

undefined

b）具有功能链

在下面的示例中，考虑到上述示例场景，使用用户定义的“ return this”语句，返回诸如add()和的函数，并subtract()通过显示3作为输出而使函数链接在那里成为可能。

示例

<html>
<body>
<script>
   var obj = function(){
      this.i = 0;
      this.add = function(i){
         this.i += i;
         return this;
      };
      this.subtract = function(i){
         this.i -= i;
         return this;
      };
      this.print = function(){
         document.write(this.i);
      }
   }
var x = new obj();
x.add(5).subtract(2).print();
</script>
</body>
</html>