Question

我更新了这个问题，因为我的小提琴没有得到很好的保存 -

我正在构建一个包含与表单类似操作系列的应用程序。我没有添加很多表单，而是选择使用通用表单并动态更改表单按钮上的事件。

我的挑战是使代码更通用，因此我可以轻松添加更多操作而无需增加代码。完整的非通用代码位于Fiddle链接中，其中一部分位于链接下方。 refined Fiddle

// sample 


function init() {
    operationA.addEventListener('mousedown', prepareA);
    operationB.addEventListener('mousedown', prepareB);
}


// Operation flow:
// Prepare >> Cancel or Process >> Execute
function prepareA() {
    if (isEventsRemoved) {
        showForm();
        ok.addEventListener('mousedown', processA);
        cancel.addEventListener('mousedown', cancelA);
        isEventsRemoved = false;
    } else {
        alert("Cancel other operation first");
    }
}

function cancelA() {
    hideForm();
    cleanUp(processA, cancelA);
}

function processA() {
    hideForm();
    cleanUp(processA, cancelA);
    if (input.value == "a") {
        executeA();
    } else {
        alert("No good, try operationA again.");
        cleanUp(processA, cancelA);
        prepareA();
    }
}

function executeA() {
    alert("Executing A");
}

而不是为A，B，C等重复相同的功能/方法。我从通用函数开始，传递A，B，C等参数。但是，当我按照这一行时，我不知道如何将它粘合在一起，某种递归开始出现，请参阅通用的小提琴。再次只是Fiddle链接下的部分代码。 Problem Fiddle

// Set it up
function init() {
    operationA.addEventListener('mousedown', function(){ prepareAll(processA, cancelA)});
    operationB.addEventListener('mousedown', function(){ prepareAll(processB, cancelB)});
}


// Operation flow:
// Prepare >> Cancel or Process >> Execute

function prepareAll(processHandler, cancelHandler) {
    if (isEventsRemoved) {
        showForm();
        ok.addEventListener('mousedown', processHandler);
        cancel.addEventListener('mousedown', cancelHandler);
        isEventsRemoved = false;
    } else {
        alert("Cancel current operation first");
    }
}

function cancelAll(processHandler, cancelHandler) {
    hideForm();
    cleanUp(processHandler, cancelHandler);
}

我的问题：这种方式真的是死路一条，我应该使用对象实例而不是使用带参数的泛型函数，或者我只是不按照正确的方式进行操作？

使用实例或传递参数：优化的最佳方式

0 个答案: