JavaScriptでおみくじを作ろうの受講が完了しました。
#ドットインストール
JavaScriptでストップウォッチを作ろうの受講完了前回と同じくまずは自分で作ることをチャレンジしたけど、日付の計算がうまくでなくて自分では完成できなかった。
答え合わせで動画見たら自分が難しく考えすぎてたことが分かってすっきり。#駆け出しエンジニアと繋がりたい— じゅに💻脱サラに命かける人 (@Jyu210) December 27, 2019
学習内容
「JavaScriptでストップウォッチを作ろう」は有料会員のみが受講できるレッスンとなっています。
スタート、ストップ、リセットの3つのボタンを備えたストップウェッチが成果物です。
これを12本の動画で作り上げることになります。
僕は「JavaScriptでおみくじを作ろう」と同じように動画を見ながら進めるのではなく最初の完成イメージを見て、最初は自分で作成して動画で答え合わせを行うという形式で進めました。
つまずいたポイントなど
日付の計算につまずきました。
僕はタイマーでカウントアップさせたものを表示するのかなと想像していましたが、実際はDate関数を使った計算で実装可能でした。
Date関数
Dateは日付や時刻を扱うことができるオブジェクトです。
またDateオブジェクトは日付や時刻であることをあまり気にせず計算することも可能な便利なオブジェクトです。
代表的な使い方はPaiza.ioで書いてみました。
UTCとは
UTC（協定世界時）とは日付を扱う上では避けてとおれないものです。
要は世界の記述となる時間ですね。
UTC（協定世界時）に+9時間することで日本時間になります。
現地の時間でシステムを構築しているとサマータイムがある国では時期によって時間が変わってしまうので、UTC（協定世界時）でシステムを構築することが重量になります。
経過時間の計算
ストップウォッチの経過時間は以下のように求めます。
経過時間 = 現在時間 – Startボタンを押した時間
変に難しく考えなくて良いんですね〜。
あとは、一旦Stopさせてからの再開の計算と、ボタンへのクラスのつけ外しで各種状態で押せるボタンのコントロールを行えればOK。
感想
経過時間の計算方法を根本的に間違い（ループさせてカウントアップさせようとしていた）以外は自分で実装できました。
もちろん動画のほうが効率の良い書き方をされている部分もあったので、そのあたりは吸収して次にいかしていきます。
にしてもJavaScriptは時間の計算が特に変換とか必要ないんで楽で良いですね。
自分が今の会社で使っている超マイナー言語は時間の計算がめんどくさいんでうれしいです。
