javascript解答例

JavaScript解答例

JavaScriptを書く、応用問題の解答例

  • 文字を縦に動かしてみよう
    y=100; // yの初期値を設定
    while(true){
        move("moji",100,y); // x軸が100,y軸が変数yの値の位置に"moji"を動かす
        wait(1000);
        y+=10; // yの値を10増やす
    }
  • 文字をななめに動かしてみよう
    x=100; // xの初期値を設定
    y=100; // yの初期値を設定
    while(true){
        move("moji",x,y); // x軸が変数x,y軸が変数yの位置に"mojiを動かす
        wait(1000);
        x+=10; // xの値を10増やす
        y+=10; // yの値を10増やす
    }
  • 文字をなめらかに動かしてみよう
    x=100;
    y=100;
    while(true){
        move("moji",x,y);
        wait(50); // 待つ間隔を短くすることで細かく描画する
        x+=3; // xの値を増やす量を少なくする
        y+=3; // yの値を増やす量を少なくする
    }
  • 画像を動かしてみよう
    HTMLでネコの画像を表示させ、nameをつける(ここでは"neko")
    <html>
      <body>
        <img src="images/neko1.png" name="neko" /><br/>
      </body>
    </html>
    JavaScriptでmoveの対象をHTMLで画像につけたnameにする
    x=100;
    y=100;
    while(true){
        move("neko",x,y);
        wait(50);
        x+=3;
        y+=3;
    }
  • 文字や画像を2つ以上動かしてみよう
    HTMLで複数の要素を設定する(ここでは"moji"と"neko")
    <html>
      <body>
        <span name="moji">文字</span>
        <img src="images/neko1.png" name="neko" /><br/>
      </body>
    </html>
    JavaScriptでは二つの要素それぞれのxとyの値を設定し、move命令でそこへ動かす
    mx=100; //"moji"のx
    my=100; //"moji"のy
    nx=50; //"neko"のx
    ny=50; //"neko"のy
    while(true){
        move("moji",mx,my); //"moji"を動かす
        move("neko",nx,ny); //"neko"を動かす
        wait(50);
        mx+=3;
        my+=3;
        nx+=5;
        ny+=5;
    }

ゲーム作成、練習問題・課題の解答例

  • 左に押したときに左に動くようにしてみよう
    x=100;
    y=300;
    onClick("right",right);
    onClick("left",left); // "left"が押されたときの動作を設定
    while(true){
        move("neko",x,y);
        wait(50);
    }
    function left(){
        x-=10;
    }
    function right(){
        x+=10;
    }
  • ボタンが画面の上のほうにあると操作がしにくいので、画面の下のほうに出るようにしてみましょう。
    x=100;
    y=300;
    bx=[0,100,200,300,400];
    by=[0,10,20,30,40];
    move("right",300,400); // メインループの前にボタンの位置をmoveで動かす
    move("left",100,400);  // 左ボタンも同様に動かす
    score=0;
    onClick("right",right);
    onClick("left",left);
    while(true) {
        move("neko",x,y);
        moveBall(0);
        moveBall(1);
        moveBall(2);
        moveBall(3);
        moveBall(4);
        wait(50);
    }
    //以下略
  • ネコがボールとぶつかると、ゲーム画面からは消えますが、ボールが落ちるたびにスコアが増えてしまいます。ボールがぶつかると、y=-100 が行われるので、スコアを加算している個所を、「もし、yが-100でなければ、スコアを加算する」というプログラムにしてみましょう。
    // moveBall関数を抜粋
    function moveBall(i) {
        move("ball"+i,bx[i],by[i]);
        by[i]+=10;
        if (by[i]>400) {
            by[i]=0;
            bx[i]=rnd(400);
            if(y!=-100){ // スコアの加算部分をyが-100でないとき、というif文で囲む
                score+=10;
            }            // if文を閉じる
            setText("score",score);
        }
        if (bx[i]>x-30 && bx[i]<x+30 && 
        by[i]>y-30 && by[i]<y+30) {
            y=-100;
        }
    }

powered by Quick Homepage Maker 5.1
based on PukiWiki 1.4.7 License is GPL. QHM

最新の更新 RSS  Valid XHTML 1.0 Transitional