Question

在这种情况下，该网站是一个只能在IE6上查看的内部网站。目标是让它在IE9中可见。有几个IE唯一的专有脚本，例如使用xml data islands，通过点表示法访问文档元素，即resulttable.style.display = "block";等等。上述内容可能对手头的问题有点多余，但它可以提供一些见解。

在整个网站中，有大量的JavaScript方法非常庞大且难以调试。为了给你一个想法，有超过100个JS文件，每个文件平均大约1000行。

以下是省略所有名称/逻辑的实际方法。所有返回值都取决于先前的逻辑：

function someMethod() {
if (stuff) {
    // operations
    if (stuff) {
        // operations
        for (loop) {
            // operations
            if (stuff) {
                // operations
                if (stuff) {
                    // operations
                    for (loop) {
                        if (stuff) {
                            // operations
                        }
                    }
                    // operations
                }
                else {
                    // operations
                    if (stuff) {
                        // operations
                    } else {
                        // operations
                    }
                }
                // operations
            }
        }

        // operations

        if (stuff) {
            // operations
            if (stuff) {
                // operations
                if (stuff) {
                    // operations
                    for (stuff) {
                        // operations
                        if (stuff) {
                            // operations
                        } else {
                            // operations
                        }
                    }
                    if (stuff) {
                        // operations
                        if (stuff) {
                            // operations
                            for (loop) {
                                // operations
                            }
                            // operations
                            for (loop) {
                                if (stuff) {
                                // operations
                                }
                            }
                        }
                        // operations
                        if (stuff) {
                            // operations
                        }
                        return something;
                    }
                    else {
                        // operations
                        return something;
                    }
                }
                else {
                    // operations
                    if (stuff) {
                        // operations
                        return something;
                    }
                    else {
                        // operations
                        if (stuff) {
                            // operations
                        }
                        // operations
                        return something;
                    }
                }
            }
        }
        return something;
    }
    else {
        // operations
        return something;
    }
}
return something;
}

在处理遗留网站时，您有什么建议将JavaScript方法分解为更易于管理的部分？

免责声明：我的JS技能组件是平均值。我们现在想要避开JQuery。

Answer 1

您可以简单地将someMethod（）分解为可以重复逻辑的单个函数。

同样没有研究你所拥有的具体逻辑，并找到最适合逻辑的模式，一些可能有用的一般模式

模块模式，例如

var MyModule = function() {
    function privateFn() {
    }
    function publicFn() {
    }
    function doWork(args) {
    }

    return {
        publicFn: publicFn,
        doWork: doWork,
    };
}();
MyModule.doWork({ param1: 'test', param2: true});

原型继承可以类似于c＃/ Java中的类使用，例如

var MyClass = function(args) {
    this.prop1 = 'test'
    this.prop2 = args.param1;
};
MyClass.prototype.doWork = function(args) {
};
var myInstance = new MyClass({ param1: 'test' });
myInstance.doWork({ param1: true });

您可以使用命名空间来组织这些，例如

if (window.MyNamespace === undefined) window.MyNamespace = {};
MyNamespace.MyModule = function () { ... };
MyNamespace.MyClass = function () { ... };
MyNameSpace.MyModule.doWork();

可以在http://shichuan.github.com/javascript-patterns/

找到可能有用的其他模式

关于重构大型JavaScript方法的建议

1 个答案: