深嵌套函数的替代方案javascript

深嵌套函数的替代方案javascript,javascript,function,oop,Javascript,Function,Oop,我一直试图在一个javascript项目中组织代码,最终得到了一堆嵌套函数。据推测,这是一种糟糕的做法,我知道这会影响性能,但我很难想出一个替代方案。下面是我尝试做的一个例子: 嵌套前的代码: function Level1(dep1, dep2, dep3, dep4){ var tempResult1 = dep1 + dep2; var tempResult2 = tempResult1/2; var tempResult3 = dep3 + dep4;

我一直试图在一个javascript项目中组织代码,最终得到了一堆嵌套函数。据推测,这是一种糟糕的做法,我知道这会影响性能,但我很难想出一个替代方案。下面是我尝试做的一个例子:

嵌套前的代码:

function Level1(dep1, dep2, dep3, dep4){

    var tempResult1 = dep1 + dep2;
    var tempResult2 = tempResult1/2;
    var tempResult3 = dep3 + dep4;
    var mainResult = tempResult2 + tempResult3;

    return mainResult;

}
在我尝试将责任划分为层次结构后的情况:

function Level1(dep1, dep2, dep3, dep4){

    var tempResult2 = getTempResult2(dep1, dep2);
    var tempResult3 = getTempResult3(dep3, dep4);
    var mainResult = tempResult2 + tempResult3;
    return mainResult;

    function getTempResult2(dep1, dep2){

        var tempResult1 = getTempResult1(dep1, dep2);
        return tempResult1/2;

        function getTempResult1(dep1, dep2){

            return dep1 + dep2;

        }
    }

    function getTempResult3(dep3, dep4){

        return dep3 + dep4;
    }        

}

显然,对于这里使用的操作,函数有点过多,但它确实有助于使项目中的操作更易于管理。我不熟悉任何其他方法,因为这是我的第一个javascript项目。我在这里找到的建议只涉及1级嵌套函数,而不是2级,而且我没有看到任何关于如何实现嵌套作用域的好例子。如果有人能给我举一个例子,说明一种方法来完成我在这里寻找的组织,我将不胜感激。谢谢。

也许这就是你想要的:

function Level1(dep1, dep2, dep3, dep4){
    var tempResult2 = Level1.getTempResult2(dep1, dep2);
    var tempResult3 = Level1.getTempResult3(dep3, dep4);
    var mainResult = tempResult2 + tempResult3;

    return mainResult;
}

Level1.getTempResult2 = function (dep1, dep2) {
    var tempResult1 = Level1.getTempResult2.getTempResult1(dep1, dep2);
    return tempResult1/2;   
}

Level1.getTempResult2.getTempResult1 = function (dep1, dep2){
    return dep1 + dep2;
}

Level1.getTempResult3 = function (dep3, dep4){
    return dep3 + dep4;
}
现在我试过了

function a(val1, val2) { return a.foo(val1, val2) }
a.foo = function (x,y) { return x + y }
在我的浏览器中。命令
a(1,2)
按aspected打印
3
。其他例子:

function a() { return a.foo(1,2) }
a.foo = function (x,y) { return a.foo.bar(x,y) }
a.foo.bar = function (x,y) { return x+y }
a(1,2) // -> 3
function doChores(){
  //actually wash the dishes
  //actually walk the dog.
}

也许这就是你想要的:

function Level1(dep1, dep2, dep3, dep4){
    var tempResult2 = Level1.getTempResult2(dep1, dep2);
    var tempResult3 = Level1.getTempResult3(dep3, dep4);
    var mainResult = tempResult2 + tempResult3;

    return mainResult;
}

Level1.getTempResult2 = function (dep1, dep2) {
    var tempResult1 = Level1.getTempResult2.getTempResult1(dep1, dep2);
    return tempResult1/2;   
}

Level1.getTempResult2.getTempResult1 = function (dep1, dep2){
    return dep1 + dep2;
}

Level1.getTempResult3 = function (dep3, dep4){
    return dep3 + dep4;
}
现在我试过了

function a(val1, val2) { return a.foo(val1, val2) }
a.foo = function (x,y) { return x + y }
在我的浏览器中。命令
a(1,2)
按aspected打印
3
。其他例子:

function a() { return a.foo(1,2) }
a.foo = function (x,y) { return a.foo.bar(x,y) }
a.foo.bar = function (x,y) { return x+y }
a(1,2) // -> 3
function doChores(){
  //actually wash the dishes
  //actually walk the dog.
}

您不必担心调用堆栈会变得更深


这是一个例子,

您不必担心调用堆栈会变得更深

这是一个例子

最终得到了一堆嵌套函数

您可以简单地取消对它们的测试,因为它们没有用作闭包(您可以将所有必要的内容作为参数传递)。您甚至可以通过在每次调用外部函数时不创建本地函数对象来获得一点性能优势(这是经过良好优化的,可能可以忽略不计)

我刚刚读了一大堆关于嵌套函数是如何糟糕的实践的文章

请注意,有时需要使用嵌套函数


我不喜欢getTempResult1、2和3可以在级别1之外访问,或者getTempResult1可以在getTempResult2之外访问

您可以使用创建一个额外的作用域,从中仅导出
Level1

var Level1 = (function() {
    function Level1(dep1, dep2, dep3, dep4) {
        var tempResult2 = getTempResult2(dep1, dep2);
        var tempResult3 = getTempResult3(dep3, dep4);
        var mainResult = tempResult2 + tempResult3;
        return mainResult;
    }

    var getTemptResult2 = (function() {
        function getTempResult2(dep1, dep2) {
            var tempResult1 = getTempResult1(dep1, dep2);
            return tempResult1/2;
        }

        function getTempResult1(dep1, dep2) {
            return dep1 + dep2;
        }

        return getTempResult2;
    })();

    function getTempResult3(dep3, dep4) {
        return dep3 + dep4;
    }        

    return Level1;
}());
最终得到了一堆嵌套函数

您可以简单地取消对它们的测试,因为它们没有用作闭包(您可以将所有必要的内容作为参数传递)。您甚至可以通过在每次调用外部函数时不创建本地函数对象来获得一点性能优势(这是经过良好优化的,可能可以忽略不计)

我刚刚读了一大堆关于嵌套函数是如何糟糕的实践的文章

请注意,有时需要使用嵌套函数


我不喜欢getTempResult1、2和3可以在级别1之外访问,或者getTempResult1可以在getTempResult2之外访问

您可以使用创建一个额外的作用域,从中仅导出
Level1

var Level1 = (function() {
    function Level1(dep1, dep2, dep3, dep4) {
        var tempResult2 = getTempResult2(dep1, dep2);
        var tempResult3 = getTempResult3(dep3, dep4);
        var mainResult = tempResult2 + tempResult3;
        return mainResult;
    }

    var getTemptResult2 = (function() {
        function getTempResult2(dep1, dep2) {
            var tempResult1 = getTempResult1(dep1, dep2);
            return tempResult1/2;
        }

        function getTempResult1(dep1, dep2) {
            return dep1 + dep2;
        }

        return getTempResult2;
    })();

    function getTempResult3(dep3, dep4) {
        return dep3 + dep4;
    }        

    return Level1;
}());
尝试查看用于node.js的。我一直在用它

但是,即使在node.js环境之外,您也可能需要使用step.js脚本(注意:我还没有测试过这个)。至少,它显示了如何展平任意数量的嵌套级别。

请尝试查看,这是针对node.js的。我一直在用它


但是,即使在node.js环境之外,您也可能需要使用step.js脚本(注意:我还没有测试过这个)。至少,它展示了如何将任何级别的筑巢变平。

我知道这已经得到了回答,但我想我会留给你一些额外的资源来帮助你进行这次冒险。我认为现在是深入研究javascript设计模式的最佳时机

Addy Osmani是一个非常棒的阅读/资源,可以了解创建javascript应用程序、创建可重用代码、闭包等的多种模式。任何对如何更好地组织我的嵌套函数/范围等进行内部讨论的人都应该阅读它

下面是他文章中关于工厂模式的一个示例片段

// Types.js - Constructors used behind the scenes

// A constructor for defining new cars
function Car( options ) {

 // some defaults
 this.doors = options.doors || 4;
 this.state = options.state || "brand new";
 this.color = options.color || "silver";

}

// A constructor for defining new trucks
function Truck( options){

  this.state = options.state || "used";
  this.wheelSize = options.wheelSize || "large";
  this.color = options.color || "blue";
}


// FactoryExample.js

// Define a skeleton vehicle factory
function VehicleFactory() {}

// Define the prototypes and utilities for this factory

// Our default vehicleClass is Car
VehicleFactory.prototype.vehicleClass = Car;

// Our Factory method for creating new Vehicle instances
VehicleFactory.prototype.createVehicle = function ( options ) {

switch(options.vehicleType){
  case "car":
  this.vehicleClass = Car;
  break;
  case "truck":
    this.vehicleClass = Truck;
  break;
  //defaults to VehicleFactory.prototype.vehicleClass (Car)
 }

return new this.vehicleClass( options );

};


// Create an instance of our factory that makes cars
var carFactory = new VehicleFactory();
var car = carFactory.createVehicle( {
            vehicleType: "car",
            color: "yellow",
            doors: 6 } );

// Test to confirm our car was created using the vehicleClass/prototype Car

// Outputs: true
console.log( car instanceof Car );

// Outputs: Car object of color "yellow", doors: 6 in a "brand new" state
console.log( car );

希望本文能帮助您和其他人寻找类似的答案

我知道这已经得到了回答,但我想我会给你留下一些额外的资源来帮助你进行这次冒险。我认为现在是深入研究javascript设计模式的最佳时机

Addy Osmani是一个非常棒的阅读/资源,可以了解创建javascript应用程序、创建可重用代码、闭包等的多种模式。任何对如何更好地组织我的嵌套函数/范围等进行内部讨论的人都应该阅读它

下面是他文章中关于工厂模式的一个示例片段

// Types.js - Constructors used behind the scenes

// A constructor for defining new cars
function Car( options ) {

 // some defaults
 this.doors = options.doors || 4;
 this.state = options.state || "brand new";
 this.color = options.color || "silver";

}

// A constructor for defining new trucks
function Truck( options){

  this.state = options.state || "used";
  this.wheelSize = options.wheelSize || "large";
  this.color = options.color || "blue";
}


// FactoryExample.js

// Define a skeleton vehicle factory
function VehicleFactory() {}

// Define the prototypes and utilities for this factory

// Our default vehicleClass is Car
VehicleFactory.prototype.vehicleClass = Car;

// Our Factory method for creating new Vehicle instances
VehicleFactory.prototype.createVehicle = function ( options ) {

switch(options.vehicleType){
  case "car":
  this.vehicleClass = Car;
  break;
  case "truck":
    this.vehicleClass = Truck;
  break;
  //defaults to VehicleFactory.prototype.vehicleClass (Car)
 }

return new this.vehicleClass( options );

};


// Create an instance of our factory that makes cars
var carFactory = new VehicleFactory();
var car = carFactory.createVehicle( {
            vehicleType: "car",
            color: "yellow",
            doors: 6 } );

// Test to confirm our car was created using the vehicleClass/prototype Car

// Outputs: true
console.log( car instanceof Car );

// Outputs: Car object of color "yellow", doors: 6 in a "brand new" state
console.log( car );

希望本文能帮助您和其他人寻找类似的答案

最好尽可能少地实现函数,以实现最佳重用。例如:

function a() { return a.foo(1,2) }
a.foo = function (x,y) { return a.foo.bar(x,y) }
a.foo.bar = function (x,y) { return x+y }
a(1,2) // -> 3
function doChores(){
  //actually wash the dishes
  //actually walk the dog.
}
现在让我们假设天在下雨,我只想洗盘子,因为洗盘子是在多科里斯实施的,我不能不遛狗就这么说。以下是应该如何做到这一点:

function doChores(){
  walkTheDog();
  washTheDishes();
}
函数walkTheDog实现遛狗,washthedish实现洗碗,因此可以专门调用它们

您所面临的问题是将变量传递给函数链。我通常将一个参数传递给函数,该参数包含一个具有所需参数的对象。每个函数都可以读取或修改它们所关心的传递对象的成员。如果以后需要添加更多参数,则无需更改函数的签名(例如
函数(arg1、arg2、newArg)
),您将始终拥有
函数(args)

有关参数传递的更多信息可在此处找到:在“传递”下