※今回は”JavaScriptで何かを作ってみる”ことが目的だったので、
スタイルがスマホ対応していません・・PCでご覧ください。
作ろうと思った理由
- 今の自分の実力で作れるものを作ってみたかった
- 英語の勉強をしている中で出会った本に、「WPS」についての記述があって
それを見た時にビビッときた(こんなサービスが欲しい+今の自分に作れそうだという感覚) - WPSを計算するサイトは調べた限り少なく、もっと使い勝手も良くできるのでは?と思った
入力された文章の単語数を調べる
これは当初からなんとなく「こうすれば実装できるだろうな」という想像がついていたので、
あまり詰まることなく実装できました。
(半角スペースをキーとして配列に単語を格納し、その数を調べる)
ただ、上記の実装だと少し不都合があります。
- !や?の前にスペースがあると、一単語として処理されてしまう
- 改行があった時に単語数が少なくなってしまう
上記については今後余力があれば改修します・・・!
タイマー機能
https://note.affi-sapo-sv.com/js-make-stopwatch_.php
https://qiita.com/ryomaDsakamoto/items/c49a9d4cd2017405af1b
上記のサイトを参考にさせていただきました。
地味にタイマー機能が一番時間がかかった・・・。
最初は「スタートボタンをクリックしたら、1秒ごとに値を+していけば
良いのでは?」と思ったのですが、調べてみるとあまりその方法は良くないとの事。
(1秒ごとに+1するという関数をsetInterval等を使用して作っても、
実際にはミリ秒単位で実行にズレが生じている。そのため、「塵も積もれば~」で
計測にズレが生じ、正確な時間が計測できない可能性がある。)
最終的にはスタートボタンを押した時・ストップボタンを押した時の
時間をそれぞれ取得&引き算をすることで、英語の文章を読むのにかかった時間を算出する方向で実装しました。
難しかったこと
何気に、「変数名・関数名をどうするか?」が難しかったです。
「itemとitemsがあるから・・もう他にいい感じの単語がない(´;ω;`)」
って感じで変数名枯渇問題に悩まされました。
あと、他人から見て何をしている関数・変数なのかわかりにくい
ネーミングになっている・・
軽く検索してみると、動詞+名詞で考えると
枯渇しにくく、他人が見てもわかりやすいネーミングになるらしい。
今回は復習に重きを置いていたし、後半になって「やばい、もうよい単語が思い浮かばない・・!」
という状態になったので、そのまま制作を進めました。
機能的にも詰められていない部分が多いし、記述も冗長かも・・
でも、初めて一人で一から設計・実装してみて
今まで学んだ事を定着させることはできたと思います!
コメント