ベストアンサー

１から始まってクリックするたびに1増えるようにした

2017/04/26 14:29

下記の式をイベントリスナーに入れて１から始まってクリックするたびに1増えるようにしたいのですが二度目からNaNになります。 let i ; let stage = ++i; console.log(stage); 再宣言のiが何度も実行されるのがまずいのでしょうか？

htmlcss123
お礼率66% (194/293)

JavaScript
回答数5
ありがとう数4

みんなの回答 （5）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

amanojaku1
ベストアンサー率54% (265/488)

2017/04/27 17:11 回答No.5

>回答No.4　amanojaku1 >var stageNum = 0； ↑申し訳ございません、全角文字が入ってました(「；」が全角文字)。とりあえず下記のように変更してみて下さい。 (() => { const startBtn = document.getElementById('js-start-btn'); var firstClick = true; var stageNum = 0; startBtn.addEventListener('click', ()=> { if(firstClick) { グローバル宣言 firstClick = false; } // iが+1された後の値が入る stageNum++; }); })();

質問者

お礼 2017/04/27 19:06

https://okwave.jp/qa/q9322322.html ありがとうございました。再質問にした方が良いかと思い上記に再質問しましたので、よろしければ見てみてください。グローバルにすることで確かにundefunedにならなくなりました。ただ新しい課題ですが、 var speedBase = 2000;というスピードを決める値をクリック数が上がるごとに0.8をかけ続けてどんどん短くしていくなどができません。ずっとスピードが2000のままです。クリック二度目はこうするとクリックごとに0.8倍をかけて徐々に数値を小さくすることはできないのでしょうか。今はクリック二度目であると条件式で使えるような値を取得することができないのでしょうか？

その他の回答 (4)

amanojaku1
ベストアンサー率54% (265/488)

2017/04/27 17:01 回答No.4

>変数をイベントリスナーの外(そと)でグローバル宣言(又は無宣言)する必要がある訂正です、変数をイベントリスナーの外(そと)でグローバル宣言は「var」付きの設定、又は「var」無しの設定のどちらかでグローバル変数を設定して下さい。 >繰り返し処理はすべてiを使わないといけないと思っていたのですがそうではなくfor文内で使う時だけiを使えばいいのですね。「i」などの1文字変数はループなどやループ以外でも局所的な処理に使用される事が多いです(絶対と言う程でもないのですが、基本ローカル変数で使用されると思って下さい)。ですから(前述した通り)下記の「stageNum」をグローバル宣言して頂かないとウマくいかないのですが？、「++stageNumDefault」の処理も変です。 let stageNum = ++stageNumDefault; 恐らく下記ページのJSのソースはわりと最新のシンタックスだと思われます(当方は古いJSしかしりませんがJavaに類似しているようです)。 https://codepen.io/anon/pen/VbPpby とりあえず下記のように変更してみて下さい。 (() => { const startBtn = document.getElementById('js-start-btn'); var firstClick = true; var stageNum = 0； startBtn.addEventListener('click', ()=> { if(firstClick) { グローバル宣言 firstClick = false; } // iが+1された後の値が入る stageNum++; }); })();

amanojaku1
ベストアンサー率54% (265/488)

2017/04/27 05:45 回答No.3

変数「i」も「countClick」にしては如何でしょうか？それはさて置き、グローバル変数なら下記のようにイベントリスナー内で「var」を使ってはいけません。 >var i = 0; >var firstClick = false;

質問者

お礼 2017/04/27 09:05

ありがとうございます。繰り返し処理はすべてiを使わないといけないと思っていたのですがそうではなくfor文内で使う時だけiを使えばいいのですね。ないしはわからないのですべてiを付けなくても良いのでしょうか？またご回答の問題は再宣言になっているからで再代入にしないといけなかったという事ですかね？

質問者

補足 2017/04/27 10:23

stageNumDefault の二度目クリック時に数値が増えていかずNaNになってしまいます。 https://codepen.io/anon/pen/VbPpby に再現しておきました。

amanojaku1
ベストアンサー率54% (265/488)

2017/04/26 18:40 回答No.2

>回答No.1　amanojaku1 >再宣言のiが何度も実行されるのがまずいのでしょうか？訂正です、ローカル宣言(let)なので、letで何度も宣言しても、シンタックス的には問題ないように思われます(この場合、当然プロセスとして間違ってます)。ローカル宣言(let)ではなく、変数をイベントリスナーの外(そと)でグローバル宣言(又は無宣言)する必要があると言う事です。

質問者

お礼 2017/04/26 19:33

また他の質問で恐縮ですが、二度目からはvar i = 0;を行わずにiがクリックごとに増えるようにしたいのですが、下記ですと何度も初期化されてしまい困っています。 var firstClick = true; if(firstClick) { var i = 0; var firstClick = false; } これもvar firstClick = true;をイベントリスナー外で実行するべきという事でしょうか？

質問者

補足 2017/04/26 19:47

var firstClick = true;をグローバルに移動してみましたが今度はなぜかundefinedになってしまいます。なぜイベントリスナー外に出すとundefinedになってしまうのでしょうか？ trueを0にしてもやはりundefinedになってしまいます。

amanojaku1
ベストアンサー率54% (265/488)

2017/04/26 18:31 回答No.1

>再宣言のiが何度も実行されるのがまずいのでしょうか？そのとおりです。ローカル宣言(let)ではなく、変数をイベントリスナーの外(そと)でグローバル宣言(又は無宣言)して下さい。他の変数名とコンフリクト(衝突、競合)しないように注意して下さい(変数名を長くするとか、分かりやすい事も重要です)。

質問者

お礼 2017/04/26 19:25

一度クリックしたときにlet i ;と宣言できていれば次にクリックしたときはすでに宣言済みになり、そんな変数はないとならないのですね。またイベントリスナー外にあればもう一度クリックしたときに再度宣言のみの部分を読まないのでNaNにならないという事でしょうか？再宣言でかつ何も代入しないとNaNになりエラーとなる仕様なのでしょうか？

関連するQ&A

JavaScriptの問題に関して教えてください。
下記問題の解き方および答えが考えても全然分からず、お教えいただきたいです。お願いいたします。以下のプログラムを読んで、どういったプログラムなのかを説明してください。 let change = 0; let change_sum = 0; const data = [ 31, 41, 59, 26, 53, 58, 97, 93, 23, 84 ]; console.log("並べ替える前"); for (let i = 0; i < data.length; i++) { console.log(data[i] + " "); }// for console.log("\n"); console.log("***********************************"); console.log(""); for (let i = 0; i < data.length - 1; i++) { for (let j = i + 1; j < data.length; j++) { if (data[i] > data[j]) { let a = data[i]; data[i] = data[j]; data[j] = a; change++; }// if }// for(内側1) console.log((i + 1) + "回目"); console.log(`${change}回`); for (let k = 0; k < data.length; k++) { process.stdout.write(data[k] + " "); }// for(内側2) console.log("\n"); change_sum += change; change = 0; }// for(外側) //最終結果の表示 console.log("***********************************"); console.log(""); console.log(`${change_sum}回`); console.log("最終結果"); for (let i = 0; i < data.length; i++) { process.stdout.write(data[i] + " "); }// for console.log("");
- 締切済み
- ブラウザ
Javascript について質問です
Javascriptで下記のような文章を書きました。 for(var i=0;i<3;i++){ console.log("T"); }; i=0; while(i==2){ console.log("i=0です"); i++; }; なんで実行結果に、0が入るのでしょうか？またwhile文についてですが、実行されておりません。条件式をi<2にしたら動きました。理由が分からないので、教えてください。実行結果 T T T 0
- 締切済み
- JavaScript
クローンすべてをクリックしたときにリスナーが実行
下記のようにクローンすべてをクリックしたときにリスナーが実行されるようにしたかったのですが、同じクラス名の要素にはなっているもののおそらく配列の順番が違うので結局別要素と判断されてクローンをクリックしても実行されません。クローンをクリックしても実行できるようにするにはどうすればよいのでしょうか。イベントリスナーの対象要素を複数してする方法があるのでしょうか？ let createElement = document.createElement('div'); document.body.appendChild(createElement); let className = createElement.className = 'game'; createElement.style.position = 'fixed'; let clone1 = createElement.cloneNode(true); document.body.appendChild(clone1); clone1.style.position = 'fixed'; let clone2 = createElement.cloneNode(true); document.body.appendChild(clone2); clone2.style.position = 'fixed'; createElement.addEventListener('click', ()=> { ~
- ベストアンサー
- JavaScript
JSについて教えてください。
// FizzBuzz let i = 0; while(i < 100) { i++; if(i % 3 === 0){ console.log('Fizz'); continue; } if(i % 5 === 0){ console.log('Buzz'); continue; } if(i % 5 === 0 && i % 3 === 0){ console.log('FizzBuzz'); continue; } console.log(i); document.getElementsByClassName('js-test210')[0].innerHTML = i; } ・上記のように作成したのですが、 if(i % 5 === 0 && i % 3 === 0){ console.log('FizzBuzz'); continue; } の部分を一番上にもっていかないとこちらがうまくいかない理由がわかりますか？・ continue; はこれ以下の処理は実行しないようにするという意味のようですが、 if内の記載以下の処理を実行しないようにするということなのでしょうか？ただそれだともともとそれ以下に何もないですよね？？？
- ベストアンサー
- JavaScript
クリックするたびにテキストを1個ずつ表示させる
マウスクリックをしてテキストを1個ずつ表示させたいです。 stage.addEventListener(MouseEvent.CLICK, mc); function mc(event:MouseEvent):void{ var text1 : TextField = new TextField(); text1.text = "Hello World"; this.addChild(text1); } を実行すると、クリックするたびテキストが1つずつ増えていきます。これを前回のを消去して新たに表示というような形で1つずつ表示させることはできないでしょうか？
- ベストアンサー
- Flash
Javascript について質問です
for(var i=0;i<3;i++){ console.log("it"+ i); i++; }; 上記の実行結果が下記のようになり、i=1が表示されません。すいませんが、教えてください。
- ベストアンサー
- JavaScript
(JavaScript)変数や文字列難しい
JavaScript 第1問目 // [変数 - 右辺が変数を使った式1] // ---------------------------------------- // 変数sに、変数piの値に変数rの値を2回掛け合わせた値を代入してください let pi = 3.14; let r = 5; ×let s = ; console.log("円の面積は" + s); ※×は間違い。第2問目 // ---------------------------------------- // [文字列 - 大文字に変換1] // ---------------------------------------- // 変数cの文字を大文字に変換して出力してください let c = "p"; ×console.log（toUpperCase+()); ※×は間違い。第1問目 ×let s = ;のところですが、let s = (3.14*5)+(3.14*5);でも間違いです。変数sに、変数piの値に変数rの値を2回掛け合わせた値の計算方法やコードは何でしょうか？第2問目 ×console.log（toUpperCase+());のところですが、console.log（toUpperCase+("p"));やconsole.log（toUpperCase+("c"))は違います。console.log{toUpperCase+}も違います。大文字に変換するコードは何でしょうか？
- 締切済み
- JavaScript
javascriptで歪度と尖度を求めるコード
サイトを参考に不偏分散から歪度と尖度を下記のコードで求めることが出来たのですが、 <!DOCTYPE html> <html lang="ja"> <head> <meta charset=utf-8 > <title>unbiased_Variance</title> </head> <body> <script> const arr = [70,71,70,74,75,73,72] // 平均値を計算 let sum = 0; arr.forEach((x, i) => sum += x) const ave = sum / arr.length; // 分散を計算 let dist = 0; arr.forEach((x, i) => dist += (x - ave) ** 2) const unbiasedVariance = dist / (arr.length-1); //不偏分散 const SD = Math.sqrt(dist / (arr.length-1)); // 歪度と尖度を計算 let sum3 = 0; let sum4 = 0; for (var i in arr){ sum3 += Math.pow((arr[i] - ave)/SD, 3); sum4 += Math.pow((arr[i] - ave)/SD, 4); } const skew = sum3*arr.length/(arr.length-1)/(arr.length-2); const exKurt = arr.length*(arr.length+1)/(arr.length-1)/(arr.length-2)/(arr.length-3)*sum4 - 3*(arr.length-1)*(arr.length-1)/(arr.length-2)/(arr.length-3); console.log(unbiasedVariance); console.log(skew); console.log(exKurt); </script> </body> </html> javascriptはコピペで使用が主なので複雑な計算方法の書き方は分かりません、そこでこんな形のコピペのコードが出来上がりました。配列から歪度と尖度を求めるコードをもっとすっきりした形になればと思い質問しました。もし宜しければご教授お願います。
- ベストアンサー
- JavaScript
iがクリックごとに増えるようにしたい
二度目からはvar i = 0;を行わずにiがクリックごとに増えるようにしたいのですが、うまくいきません var firstClick = true; const startBtn = document.getElementById('js'); startBtn.addEventListener('click', ()=> { if(firstClick) { var i = 0; firstClick = false; } ~ stageNumDefault の二度目クリック時に数値が増えていかずNaNになってしまいます。 https://codepen.io/anon/pen/VbPpby に再現しておきました。
- ベストアンサー
- JavaScript
Buttonを配列とすることができるでしょうか
swingをつかってJFrameに多数のJButtonをつくりました。どのボタンがクリックされたかを知りたいのです。そのためにJButtonを配列として、宣言したところ、コンパイルは通るようですが、実行時にエラーとなります。 JButton[] button; と宣言してリスナーを次のように登録し、使いたいのです。 int i; for(i=0;i<80;i++){ button[i].addActionListener(new ActionListener(){ public void actionPerformed(ActionEvent e){ loc=i; } } } このようにすれば、クリックされたときに、iの値をしらべれば、どのボタンがクリックされたかわかるとかんがえたのですが。実行時にエラーとなってしまいます。なにか良い方法はありませんか。
- 締切済み
- Java

１から始まってクリックするたびに1増えるようにした