Javascript でタブの動作が停止してしまう

Question

javascriptで簡単なゲームを作っているのですがボタンを押したら球が動くようにしたくて

        for (var i=0; i<Infinity; i++) {
            pong.x = pong.x + 10
          
        }
    }

と書いたのですがボタンを押すと動作が停止してしまいます
原因と解決方法を教えていただけると嬉しいです
現在の状況ゲームのサイト

Comments

[itagagaki]

そのコードではコンピューターはpong.xに10を足す動作をできる限りのスピードで繰り返します。
10を足してから次に10を足すまでの時間を見計らわないといけないのではないですか？
そして、pong.xを何か画面上のオブジェクトの位置に反映させることも必要なのではないですか？

[K93MSY]

delayを追加してみましたが上手くどうさしませんでした

[K93MSY]

座標を移動させてすぐ反映させる必要があるということでしょうか？

[itagagaki]

もしそのdelayも全力で待っているだけなら意味無いです。
どういうシステムなのか知りませんがsleepなりyieldなりといったような仕組みは無いですか？

[K93MSY]

sleepは実装してみましたが上手く動作しませんでしたyieldもまだ使い方がよくわからなくて、、、初心者ですいません、

[itagagaki]

リンクのサイトはご自分のサイトで、そこで自作のスクリプトを動かしているわけですか？
（怖いのでページ内はクリックしてません）
何か参考にされたものはありますか？

[K93MSY]

自分でpixijsをつかって作りました
一部一部をqittaとかいろんなところから参考にしたので、
glitchをつかってホスティングしてます
問題はないです

[K93MSY]

一様githublinkも載せときますhttps://github.com/K93MSY/webgame

Answer 1

GitHubであなたのコードを見ました。
何かライブラリを使っているときはそれを質問で示してくださいね。
そして、必要最低限のコードも載せてください。

まず

    if(gamep=true){
      let i = 1;
      while (i > 0) {
        async function hoge() {
          await sleep(5000);
          pong.x = pong.x + 10
        }
      }
    }

これは一旦削除してださい。

そしてplay.jsの最後に下記のコードを加えて実行してみてください。

app.ticker.add( delta => {
  pong.x = pong.x + 1;
} );

PixiJSというライブラリの使い方の問題なので、PixiJSで検索して参考になりそうなコードを見て回るといいと思いますよ。

Comments

[K93MSY]

すいませんでした。わざわざ対応ありがとうございました。がんばります