0

在这种情况下，该站点是一个只能在 IE6 上查看的内部网站。目标是让它在 IE9 中可见。有几个仅适用于 IE 的脚本，例如使用xml 数据岛、通过点表示法访问文档元素，即，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。

4

1 回答 1

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/

于 2012-07-18T06:00:16.607 回答