可以调用 javascript 嵌套函数 new fun1().fun2().fun3()

编程问答 2022-04-24

问题描述

这是我的原始函数

   function fun1(){
     this.fun2 = function(){
        this.fun3 = function(){
        } 
     }
    }

当我调用函数时

new fun1().fun2()

它工作正常，但是当我使用

new fun1().fun2().fun3()

它不起作用。我需要像

这样的嵌套函数调用 
 new fun1().fun2().fun3()

解决方法

您以构造函数的形式编写了 fun1 和 fun2（使用 this，不返回值）。如果使用 new 关键字调用构造函数，则会生成一个新对象。

因此，new fun1() 返回一个具有 .fun2 的对象。但是 obj.fun2() 返回 undefined，因为它没有 return，并且没有使用 new，这就是您的 .fun3 调用不起作用的原因。您需要编写以下内容之一：

new (new fun1().fun2)().fun3()         // if `fun3` is a function
new (new (new fun1().fun2)().fun3)()   // if `fun3` is a constructor

在您的场景中执行 fun3。正如 Rory 所说，这段代码几乎肯定是个坏主意。

为了使链式 new fun1().fun2().fun3() 起作用，fun1 应该是一个构造函数，它创建一个具有 fun2 方法的对象，它返回一个具有 fun3 方法的对象。一个明显的场景是当这些对象是同一个对象时，但不一定如此。您的链接代码可以工作的最简单的场景是

class fun1 {
  fun2() {
    return this;
  }
  fun3() {
  }
}

或等效

function fun1() {
}
fun1.prototype = {
  fun2: function fun2() {
    return this;
  },fun3: function fun3() {
  },};

或者几乎但不完全等效：

function fun1() {
  this.fun2 = function fun2() {
    return this;
  }
  this.fun3 = function fun3() {
  }
}

你也可以这样写，让两个中间对象不同：

class Other {
  fun3() {
  }
}

class fun1 {
  fun2() {
    return new Other();
  }
}

（或等效或几乎等效的代码）

另请注意，构造函数通常使用 TitleCase 命名；这会通知阅读代码的程序员应该如何使用它。因此，Fun1 应该比 fun1 更受欢迎——尽管这样做也不是错误。

（注意，我说的是构造函数和函数之间的区别；实际上，没有区别。我只是将其写为“以期望将其作为构造函数执行的方式编写的函数”的快捷方式”，和“一个函数，它应该作为一个普通函数被调用”。）

functionfunctionfunctionjavascriptjavascript-objectsjquerynested-function