ドットインストール - 3分動画でマスターできるプログラミング学習サービス

PREMIUM

JavaScriptでストップウォッチを作ろう

JavaScriptでシンプルなストップウォッチを作る方法について学んでいきます。
0%

このレッスンをはじめる前に

このレッスンを進めるには前提知識が必要です。先に以下のレッスンを完了しておきましょう。

JavaScript入門 基礎文法編

JavaScript入門 基礎文法編 (全27回) PREMIUM

PREMIUM
0%
JavaScript入門 関数編

JavaScript入門 関数編 (全12回) PREMIUM

PREMIUM
0%
JavaScript入門 データ構造編

JavaScript入門 データ構造編 (全27回) PREMIUM

PREMIUM
0%
JavaScript入門 DOM編

JavaScript入門 DOM編 (全22回) PREMIUM

PREMIUM
0%
JavaScript入門 日時操作編

JavaScript入門 日時操作編 (全8回) PREMIUM

PREMIUM
0%
JavaScript入門 文字列操作編

JavaScript入門 文字列操作編 (全7回) PREMIUM

PREMIUM
0%
JavaScript入門 タイマー編

JavaScript入門 タイマー編 (全10回) PREMIUM

PREMIUM
0%
#01 ストップウォッチを作ってみよう
VS Code の色を動画と同じにしたいです
2022年1月27日
#02 画面のマークアップをしよう
Windows のショートカットキーが知りたいです
2022年1月27日
全体をブロックで囲うのはなぜですか？
2022年1月27日
#03 カウントアップ機能を実装しよう
このコードは再帰呼び出しでコールスタックが膨大にならないのでしょうか？
2023年4月30日
カウントアップの仕組みがよくわかりません
2022年2月18日
Date() と new Date() の違いがわかりません
2022年1月27日
setTimeout を countUp の外に出すと console.log が一度しか実行されないのは何故でしょうか？
2022年1月27日
なぜブロック外でstartTimeを宣言しているのですか？
2022年1月27日
Date.now()とgetTime()は同じですか？
2022年1月27日
setTimeout()を使っている理由について教えて下さい
2022年1月27日
コンソールの結果が10ミリ秒間隔にならないのはなぜですか？
2022年1月27日
なぜ1ミリ秒ごとではなくて10ミリ秒毎に処理しているのですか？
2022年1月27日
経過時間がどう計算されているのかわかりません
2022年1月27日
let startTimeで値を設定していないのはなぜですか？
2022年1月27日
Date.now()とnew Date()の違いがわかりません
2022年1月27日
startTimeはなぜ初期化しないのですか？
2022年1月27日
startボタンを押してもカウントが開始されません
2022年1月27日
startのイベントでcountUp();が必要なのはなぜですか？
2022年1月27日
setTimeoutでのcountUpの表記について混乱しています
2022年1月27日
コンソールでカウントが始まらない
2022年1月27日
setTimeout(countUp, 10);ではだめですか？
2022年1月27日
#04 タイマーを表示させよう
なぜ new Date とするのですか？
2022年11月20日
timer.textContent の記載でエラーがでてしまい、前にすすめません
2022年1月27日
100 分の 1 秒までの表示にするにはどうしたらよいですか？
2022年1月27日
CountUp() と CountUp の違いがわかりません
2022年1月27日
constを使って値が再代入できるのはなぜですか？
2022年1月27日
setTimeoutとsetIntervalどちらが良いですか？
2022年1月27日
start をクリックすると 30 分経過した状態から始まります
2022年1月27日
new Date()に渡すのは年月ではないのですか？
2022年1月27日
Cannot set property 'textContent' of null ...と出ます
2022年1月27日
newを使うにもDateクラスがないのでは？
2022年1月27日
インスタンス化しないとメソッドは使えないのですか？
2022年1月27日
「const d = new Date(Date.now() - startTime);」は何をしているのですか？
2022年1月27日
setTimeout(countup(), 10); だとエラーになるのはなぜですか？
2022年1月27日
時間まで取得した場合に09:00:00からカウントが始まる
2022年1月27日
new演算子を使うときと使わないときの違いは？
2022年1月27日
'${m}:${s}.${ms}'がそのまま表示されてしまいます。
2022年1月27日
padStartとsliceはどちらがいいのでしょうか
2022年1月27日
#05 停止､リセットの機能を実装しよう
なぜ timeoutId を別の関数内で使うことができるのですか？
2022年8月23日
timeoutId をコンソールで確認するにはどうしたらいいですか？
2022年2月10日
setTimeout() の動作がよくわかりません
2022年1月27日
timeoutId に setTImeout を代入した後でも、setTimeout() が動くのは何故でしょうか？
2022年1月27日
const で宣言するとエラーになるのでは？
2022年1月27日
CountUp()内で無限ループしないのでしょうか...？
2022年1月27日
timeoutIdはreturnする必要はないのですか？
2022年1月27日
なぜsetTimeoutが実行されるのでしょうか？
2022年1月27日
timer.textContentはtimer.valueではだめですか？
2022年1月27日
startTimeとtimeoutIdには値を代入していないのですが意味があるのですか？
2022年1月27日
ストップウォッチがなぜか30:00:000からスタートします
2022年1月27日
Startの次にResetはなぜ押せないのでしょうか？
2022年1月27日
timeoutIdは宣言しなくていいのですか？
2022年1月27日
timeoutIdがよくわかりません。どういう仕組みでsetTimeoutがキャンセルされるのですか？
2022年1月27日
#06 タイマーを再開できるようにしよう
elapsedTime += Date.now() - startTime は経過時間を足して再代入しているのですか？
2023年4月4日
elapsedTime を足し上げる処理が理解できません
2022年11月20日
startTime のスコープ外でも startTime が使用できるのはなぜですか？
2022年6月1日
elapsedTimeはなぜ0で初期化するのですか？
2022年1月27日
+=に書き換えるとうまくいくのはなぜですか？
2022年1月27日
「elapsedTime += Date.now() - startTime」の意味が理解できない
2022年1月27日
elapsedTimeの動きがわかりません
2022年1月27日
startTimeとtimeoutIdを宣言するときに値を代入しないのはなぜですか？
2022年1月27日
#07 タイマーの問題点を把握しよう
なぜタイマーがいくつも起動するのですか？
2022年1月27日
#08 ボタンの有効/無効を切り替えよう
なぜ `start.disabled` という書き方が成立するのでしょうか？
2022年10月28日
disabled = trueにすると操作できなくなるのはなぜですか？
2022年1月27日
setButtonStateInitial( )をstart.addEventListener()の前に書くのはなぜですか？
2022年1月27日
#10 タイマーのスタイルを整えよう
ボタンに button タグを使ってもいいですか？
2022年8月23日
上下中央揃えにしたいときにheightプロパティは必要ですか？
2022年1月27日
buttonをdivで代替するようなケースは他にもありますか？
2022年1月27日
Ctrl + Alt + 下矢印をしたら画面がひっくり返りました
2022年1月27日
#11 ボタンのスタイルを整えよう
user-select で none 以外を設定することはありますか？
2022年1月27日
height と line-height の違いはなんですか？
2022年1月27日
ベンダープレフィックスとはなんですか？
2022年1月27日
#12 ストップウォッチを完成させよう
Date.now() とnew Date().getTime() との違いを教えてください
2023年4月18日
start ボタンを連打すると、countUp 関数が２回実行されるのでしょうか？
2023年6月14日
start の addEventListener 内の return で何が起こっているのかわかりません
2022年11月20日
ボタンが無効化される処理はどこで行っているのですか？
2022年10月28日
contains で inactive がついているかどうか調べているのですか？
2022年7月23日
return falseでも問題ないでしょうか？
2022年1月27日
disabled プロパティが使用できるのはどのような時でしょうか？
2022年1月27日
=== trueは必要ないのでは？
2022年1月27日
inactiveの有無がどこで判別されているのかわかりません
2022年1月27日
inactiveクラスに「pointer-events: none;」ではだめですか？
2022年1月27日
getHoursを使うと「9」が表示される
2022年1月27日
inactiveがなぜbtnクラスに反映されるのかわかりません
2022年1月27日
returnでどこにundefinedを返すかわかりません
2022年1月27日
returnを書くとボタンが無効になるのはなぜですか？
2022年1月27日
elapsedTimeの加算タイミングがわかりません
2022年1月27日

サービスメニュー

ご利用にあたって

プログラミング勉強会

ソーシャルメディア

更新情報

Copyright © 2011-2024 dotinstall.com. All Rights Reserved.