+ JavaScript の質問用スレッド vol.126 + [転載禁止]©2ch.net (742ﾚｽ)
上下前次1-新
286: 2022/08/03(水)20:22 ID:??? AAS
false === false は真だろ
287: 2022/08/03(水)20:23 ID:Nj6BOTMG(4/13) AAS
お。
288: 2022/08/03(水)20:27 ID:??? AAS
そっかー。ありがとう。これに２時間悩んでたww
289: 2022/08/03(水)20:32 ID:Nj6BOTMG(5/13) AAS
いや。解決してない。
290(1): 2022/08/03(水)20:36 ID:Nj6BOTMG(6/13) AAS
＜script＞
var playing_flag = false;
if (playing_flag === false){
$('#button').click(function() {
console.log('ボタンが押された');
console.log(playing_flag);
$('#button').val('演奏中止');
playing_flag = true;
console.log(playing_flag);
// run();
省9
291(4): 2022/08/03(水)20:48 ID:Nj6BOTMG(7/13) AAS
＜input type="button" value="再生" id="button">
＜script>
var playing_flag = false;
const btn = document.getElementById("button");
var run = () => {
console.log(playing_flag);
console.log("再生中");
playing_flag = true;
};
var reset = () => {
省13
292(3): 2022/08/03(水)20:52 ID:Nj6BOTMG(8/13) AAS
ちょっと訂正。
var reset = () => {
console.log(playing_flag);
console.log("停止");
playing_flag = true;
};
↓
var reset = () => {
console.log(playing_flag);
console.log("停止");
省2
293: 2022/08/03(水)20:53 ID:??? AAS
その2回通ると思い込んでるif文はイベントハンドラでも何でもないんだからボタン押される前の１回しか通らないよ
294: 2022/08/03(水)21:00 ID:Nj6BOTMG(9/13) AAS
え。意味がよくわからない。イベントハンドラじゃないから、１回しかとおらない。。？？
295: 2022/08/03(水)21:13 ID:Nj6BOTMG(10/13) AAS
ずっとコードを眺めてみたら、
>>290のコードは確におかしいことは分かってきた気がする。
296: 2022/08/03(水)21:37 ID:??? AAS
>>291,292のコードも、イベントリスナー使ってますけど。
２回クリックしてもelse文にはならず、if文を２回実行しているのでしょうか？
297(2): 2022/08/03(水)21:56 ID:Nj6BOTMG(11/13) AAS
playing_flag = false;
var run = () => {
if(playing_flag === false){
console.log(playing_flag);
console.log("再生中");
playing_flag = true;
}else{
reset();
}
};
省11
298: 2022/08/03(水)22:04 ID:??? AAS
納得いかない、ねえ？
開発者ツールでどういう順番でどの行の処理がされるか確認したらいいんじゃないかな
299: 2022/08/03(水)22:07 ID:Nj6BOTMG(12/13) AAS
あ。そうですね。アドバイスありがとうございます。
300: 2022/08/03(水)22:12 ID:??? AAS
>>297
むしろ、>>291でフラグ立ててイベントハンドラ振り分けてるのが最高に意味不明なんだが
イベント駆動について勉強してみたら？
301(2): 2022/08/03(水)22:42 ID:Nj6BOTMG(13/13) AAS
よくわかってなかったようだ。
下の認識でOKですか？雑ですが。。
「Javascriptはブラウザが開いたとき、上の行から下の行へ基本一回だけ実行する。
しかし、イベントが起きたら例外的にその箇所を実行する。」
302(1): 2022/08/04(木)02:45 ID:??? AAS
>>301
HTMLスクリプト要素のdefer属性(DOMContentLoadedからの実行)とasync属性(HTMLScriptElement#onloadからの非同期実行)
303: 2022/08/04(木)03:10 ID:jGEKnkMs(1) AAS
>>302ありがとうございます。詳しく調べてみます。
>>291,292を
開発者モードでトレースしてみたのですけど。
ボタンをクリックすると、直前の条件の評価をせずに、
いきなりrun()の中を実行はじめました。
カレントの変数を無視して、初回時の条件が適応されているようです。
多分。疑問に思う方が変なのかもしれませんが、これは慣れですかね。。
304: 2022/08/04(木)03:13 ID:??? AAS
例えば、HTMLスクリプト要素にasync属性が指定してあると、次の二つは共に実行されない。
new Promise(addEventListener.bind(this, 'DOMContentLoaded')).then(e => console.log(e));
await new Promise(addEventListener.bind(this, 'DOMContentLoaded')).then(e => console.log(e));
例えば、次は1回クリックしたら次は無い。
new Promise(document.addEventListener.bind(document, 'click')).then(e => console.log(e));
>>301
これら当たり前過ぎる例を説明できますか？
今のJSは巨大なフレームワーク、1997年レベルから2022年レベルにするの大変だろうけど頑張ってね。
305: 2022/08/04(木)23:22 ID:??? AAS
>>297
>var playing_flag = false;
>if (playing_flag === false){ 処理 }
playing_flag が真偽値・bool 型なら、単にこう書けば？
if ( playing_flag )
基本、boolを比較してはならない。
すでに、boolになっているから
上下前次1-新書関写板覧索設栞歴
あと 437 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 1.326s*