Question

嗨如何多次使用一个方法而不重复并在JavaScript中制作另一个方法。因为我所做的是我创建了一个具有相同字段和代码的方法，但唯一不同的是id。我需要一个参数用于每个方法，即id。

function enemyGet() {

    new enemyMove2()
    new enemyMove()
    new enemyMove3()
}

  function enemyMove2() {

    var enemyimage = document.getElementById("enemy");
        var leftenemy = parseInt(enemyimage.style.left);
        var topenemy = parseInt(enemyimage.style.top);
        var time = setTimeout("enemyMove2()", 20)

        if (leftenemy < leftplayer) {
            leftenemy = leftenemy + 5;

        }
        if (leftenemy > leftplayer) {
            leftenemy = leftenemy - 5;

        }

        if (topenemy < topplayer) {
            topenemy = topenemy + 5;
        }
        if (topenemy > topplayer) {
            topenemy = topenemy - 5;
        }

        enemyimage.style.left = leftenemy + "px";
        enemyimage.style.top = topenemy + "px";

        var hit_list = $("#x").collision(".lollol");
        hit_list.remove();

}

function enemyMove() {


    var enemyimage = document.getElementById("enemy2");
    var leftenemy = parseInt(enemyimage.style.left);
    var topenemy = parseInt(enemyimage.style.top);
    var time = setTimeout("enemyMove()", 20)

    if (leftenemy < leftplayer) {
        leftenemy = leftenemy + 5;

    }
    if (leftenemy > leftplayer) {
        leftenemy = leftenemy - 5;

    }

    if (topenemy < topplayer) {
        topenemy = topenemy + 5;
    }
    if (topenemy > topplayer) {
        topenemy = topenemy - 5;
    }

    enemyimage.style.left = leftenemy + "px";
    enemyimage.style.top = topenemy + "px";

    var hit_list = $("#x").collision(".lollol");
    hit_list.remove();

}

function enemyMove3() {


    var enemyimage = document.getElementById("enemy3");
    var leftenemy = parseInt(enemyimage.style.left);
    var topenemy = parseInt(enemyimage.style.top);
    var time = setTimeout("enemyMove3()", 20)

    if (leftenemy < leftplayer) {
        leftenemy = leftenemy + 5;

    }
    if (leftenemy > leftplayer) {
        leftenemy = leftenemy - 5;

    }

    if (topenemy < topplayer) {
        topenemy = topenemy + 5;
    }
    if (topenemy > topplayer) {
        topenemy = topenemy - 5;
    }

    enemyimage.style.left = leftenemy + "px";
    enemyimage.style.top = topenemy + "px";

    var hit_list = $("#x").collision(".lollol");
    hit_list.remove();

}

Answer 1

使用参数：

function enemyGet() {
    // pass the id as a argument to the function
    enemyMove("enemy2")
    enemyMove("enemy")
    enemyMove("enemy3")
}

function enemyMove(enemy) {
    // the variable enemy is the id passed as an argument to the function 
    var enemyimage = document.getElementById(enemy);
        var leftenemy = parseInt(enemyimage.style.left);
        var topenemy = parseInt(enemyimage.style.top);
        // Pass the parameter in timeout as well. You have access to enemy variable due to concept of closure
        var time = setTimeout(function(){enemyMove(enemy)}, 20)

        if (leftenemy < leftplayer) {
            leftenemy = leftenemy + 5;

        }
        if (leftenemy > leftplayer) {
            leftenemy = leftenemy - 5;

        }

        if (topenemy < topplayer) {
            topenemy = topenemy + 5;
        }
        if (topenemy > topplayer) {
            topenemy = topenemy - 5;
        }

        enemyimage.style.left = leftenemy + "px";
        enemyimage.style.top = topenemy + "px";

        var hit_list = $("#x").collision(".lollol");
        hit_list.remove();

}

Answer 2

在这种情况下，您可以参数化调用之间不同的值。

您可以将变量id作为参数传递给enemyMove方法。

function enemyMove(id) {


    var enemyimage = document.getElementById(id);
    var leftenemy = parseInt(enemyimage.style.left);
    var topenemy = parseInt(enemyimage.style.top);
    var time = setTimeout(function(){
        enemyMove(id);
    }, 20)

    if (leftenemy < leftplayer) {
        leftenemy = leftenemy + 5;

    }
    if (leftenemy > leftplayer) {
        leftenemy = leftenemy - 5;

    }

    if (topenemy < topplayer) {
        topenemy = topenemy + 5;
    }
    if (topenemy > topplayer) {
        topenemy = topenemy - 5;
    }

    enemyimage.style.left = leftenemy + "px";
    enemyimage.style.top = topenemy + "px";

    var hit_list = $("#x").collision(".lollol");
    hit_list.remove();

}

然后

function enemyGet() {

    new enemyMove('enemy')
    new enemyMove('enemy2')
    new enemyMove('enemy3')
}

Answer 3

您可以使用方括号表示法来引用该功能：

// Store reference to global object for use wherever
var global = this;

...
  var n = 3;

  // Call method based on value of n
  global['enemyMove' + n]();

...

您可以创建除全局/窗口对象之外的某个对象的函数属性（方法）。

JavaScript中的高效方法

3 个答案: