重构此代码的有效方法是什么?

时间:2019-07-25 01:40:23

标签: javascript refactoring processing p5.js

摘要

游戏是井字游戏。

我有一个庞大的加载时间进餐功能,我知道可以减少它,但是我什至不知道从哪里开始...

mousePressed()功能

function mousePressed() {
    // First Row
    if (mouseX >= 0 && mouseX <= scl && mouseY >= 0 && mouseY <= scl) {
        if (turn) {
            drawX(0, 0);
        } else {
            drawY(0, 0);
        }
    } else if (mouseX >= scl && mouseX <= scl * 2 && mouseY >= 0 && mouseY <= scl) {
        if (turn) {
            drawX(1, 0);
        } else {
            drawY(1, 0);
        }
    } else if (mouseX >= scl * 2 && mouseX <= width && mouseY >= 0 && mouseY <= scl) {
        if (turn) {
            drawX(2, 0);
        } else {
            drawY(2, 0);
        }
    }
    // Second Row
    else if (mouseX >= 0 && mouseX <= scl && mouseY >= scl && mouseY <= scl * 2) {
        if (turn) {
            drawX(0, 1);
        } else {
            drawY(0, 1);
        }
    } else if (mouseX >= scl && mouseX <= scl * 2 && mouseY >= scl && mouseY <= scl * 2) {
        if (turn) {
            drawX(1, 1);
        } else {
            drawY(1, 1);
        }
    } else if (mouseX >= scl * 2 && mouseX <= width && mouseY >= scl && mouseY <= scl * 2) {
        if (turn) {
            drawX(2, 1);
        } else {
            drawY(2, 1);
        }
    }
    // Third Row
    else if (mouseX >= 0 && mouseX <= scl && mouseY >= scl * 2 && mouseY <= width) {
        if (turn) {
            drawX(0, 2);
        } else {
            drawY(0, 2);
        }
    } else if (mouseX >= scl && mouseX <= scl * 2 && mouseY >= scl * 2 && mouseY <= width) {
        if (turn) {
            drawX(1, 2);
        } else {
            drawY(1, 2);
        }
    } else if (mouseX >= scl * 2 && mouseX <= width && mouseY >= scl * 2 && mouseY <= width) {
        if (turn) {
            drawX(2, 2);
        } else {
            drawY(2, 2);
        }
    }
}

我知道它与for循环有关,但我不知道从哪里开始使用它们。

1 个答案:

答案 0 :(得分:0)

您可以在嵌套循环中执行代码。对于范围[0,2]中的变量ixiy,如果鼠标位于由(ixiy)索引的单元格中,则条件为

mouseX >= scl*ix && mouseX < scl*(ix+1) && mouseY >= scl*iy && mouseY < scl*(iy+1)

例如:

function mousePressed() {

    for (let ix = 0; ix <= 2; ++ix) {
        for (let iy = 0; iy <= 2; ++iy) {

            if ( mouseX >= scl*ix && mouseX < scl*(ix+1) &&
                 mouseY >= scl*iy && mouseY < scl*(iy+1)) {

                if (turn) {
                    drawX(ix, iy);
                } else {
                    drawY(ix, iy);
                }
            }
        }
    }
}