0

バグのイメージがあります。その画像の 5 つのコピーを画面の横から飛ばし、画面の周りで跳ね返り、横から跳ね返したいと考えています。出発点も方向性も違うものにしてほしい。

だから私はいくつかのグローバル変数を作りました

var flyVar;

var flySpeed = 5;
var widthMax = 0;
var heightMax = 0;
var xPosition = 0;
var yPosition = 0;
var xDirection = "";
var yDirection = "";
var bugFly;

var count = 1;
var bug = "bug";

setBugs()ユーザーの画面のサイズに応じて widthMax と heightMax の値を設定するために使用する関数があります。

各バグの最初の開始場所を設定する bugStartingPlace 関数があります。関数全体を投稿することはしませんが、「bug1」から「bug5」まで同じことを行い、異なる値を与えます。

function bugStartingPlace(bugName) {
//Accepts string as argument and sets the starting position and starting direction of each bug. 
    if (bugName == "bug1") {
        xPosition = 0;
        yPosition = 100;
        xDirection = "right";
        yDirection = "up";
    }
}

アニメーションを実行して画像の位置を設定する flyBug() という関数があります。このような一連のステートメントで構成されています。1つのバグで動作させることができるので、動作することを知っています。問題は、5 つのバグでそれを行うことです。

function flyBug() { 
     if (xDirection == "right" && xPosition > (widthMax - document.getElementById("bugImage").width - flySpeed))
         xDirection = "left";
<!--More flow control statements are here-->

document.getElementById("bug1").style.left = xPosition + "px";
document.getElementById("bug1").style.top = yPosition + "px";
<!-- More statements are here that set the position of the image -->

}

そのため、ボディの onload() イベントでアニメーションを実行する方法が必要です。問題の 1 つは、setInterval がパラメーターを含む関数を許可しないことです。そのため、「bug1」をこの関数のパラメーターとして渡したり、「bug2」をこの関数のパラメーターとして渡したりする複数のステートメントを body onload イベントに入れることはできません。そのため、グローバル カウント変数を作成しました。そうすれば、バグの名前を変更する必要があるときはいつでも、カウントの名前を変更してから実行します

bug = bug + count;

しかし、それは多くの複雑さを追加します。bugStartingPlace() 関数のバグの名前が必要なので、その関数を使用する前に count の値と bug の値を変更する必要があります。bugStartingPlace() 関数を使用すると、グローバル変数の値が変更されます。次に、バグの値を再度変更する前に flyBug() を使用する必要があります。

問題の 1 つは、複数のバグがあるにもかかわらず、方向と位置にグローバル変数を使用していることだと思います。1 つのバグに対しては正常に機能しますが、複数のバグに対しては機能しません。

このプログラムのロジックがどのように機能するかについてのヒントを教えてもらえますか?

4

1 に答える 1

0

setInterval では、setTimeout と同様に、関数内でパラメーターを使用できますが、次のようになります。

setInterval(funcName(param1,param2...), 100);

動作しません。次のように動作するようになります。

var func = function () { funcName(param1,param2..); }

setInterval(func, 100);

javascript のその部分を理解するには、関数の dougles crockfords の説明を読んでください。彼のビデオへのリンク

編集：すみません、あなたの質問が間違っていると理解しました...

なぜそれがうまくいかないのかという問題は、あなたがグローバル変数を理解したように. バグをオブジェクトにすることができます。彼のアクションは、関数などを含むことができるメソッドになります。その後、新しいバグを初期化すると (これを何千回も実行できます)、すべての変数が互いに競合することなくオブジェクト内にとどまります。これは、コードの堅牢性を提供する安全な方法です。

ネストされた関数を使用すると、非常に簡単に実行できます。

もう 1 つの方法は、バグ vie パラメーターの名前を fly 関数などに送信することです。そして、それに与えられたパラメーターを持つその関数での唯一の作業。

于 2013-04-15T15:56:17.867 に答える