オンラインプログラミングスクールのドットインストールで独学するJavaScript!
プログラミングスクールには様々なものがありますが、独学の補助として使うといったこともできます。
丁寧に誰かに教えてもらうというのもアリなのですが、自分のペースで勉強したい方には独学メインという方法も全然アリでしょう。
独学なら冗長さを感じることも無ければ講義が早いと感じることもありません。
今回は独学の心構えについて触れつつ、ドットインストールでJavaScriptを実際に勉強していきましょう!
学習する際の重要なポイント
私達は人間であり、人間には共通した仕組みが備わっています。
その仕組みを知ればより効率的に学習を進めることができるでしょう。
といっても簡単な話なので身構える必要はありません。
記憶は感覚記憶・短期記憶・長期記憶に大別することができます。
感覚記憶とは瞬間に目に付いたものを記憶する感覚的なもので、ほとんど意識することはありません。
感覚記憶の中でも特に集中して意識を向けたものが短期記憶となって意識することになります。
短期記憶は短いものでは数秒で消滅するいわばメモリのような記憶です。
そして短期記憶は一気に記憶できることが少なかったりします。
例えば電話番号やメールアドレス、パスワードなどを口頭で記憶しようとしても難しいものです。
こうした短期記憶の中でも重要と思われるものが最終的に行き着くのが長期記憶。
長期記憶は長いものであれば一生覚えていることができます。
幼少のころの印象的な記憶を忘れられないのはそれが長期記憶化しているからだといえるでしょう。
学習をする際にはどうにかしてこの長期記憶へと覚えたいことを保存すれば良いということになります。
ではどうすれば長期記憶化するのかというと、繰り返し覚えれば良いのです。
何度も復習していれば忘れないという単純な話なのでした。
記憶は使わなければ忘れる
私達の記憶について全ては解明されていませんが時間経過によって忘れていくことはまず間違いありません。
昨日の夕飯はぎりぎり覚えていたとしても30日間の夕飯を全部覚えているかというとそんなことは無いものです。
色んな知識や体験、技術はそのままにしていると次第に衰えていきます。
ですが私達はトイレの使い方や箸の使い方、それから毎日使っているパソコンやスマートフォンの使い方は決して忘れません。
それどころか慣れたものでほぼ無意識でも使えてしまうほど。
そして使えるということは記憶が無ければ成立しない現象です。
そのため独学をするときにも毎日の復習は大事といえます。
復習しておけばそのうち自然にプログラムを書けるようになるはずです。
継続は力なりという言葉もあるように、常に勉強するよう心がけましょう。
まずは基礎からマスター
オンラインプログラミングスクールのJavaScript入門講義は全部で24個あります。
基礎的なものからやや特殊なものまで揃っているのでじっくりと取り組んでいきましょう。
特に基礎は他のプログラム言語にも応用できるのでみっちりやることをおすすめします。
差しあたって14番目の講義までは基礎となりますし、また配列を扱っている16も基礎に含まれるといえるでしょう。
変数の概念や扱い方、条件分岐式と繰り返し式などプログラム独自の文法がみっちり詰まっています。
とりあえずこのあたりは自由に扱えるぐらい理解しておくことが重要です。
JavaScriptの特殊な面
基礎が終わったらJavaScript特有な部分へ触れることになります。
といっても基礎部分にもある程度含まれているので今更かもしれません。
JavaScriptでは変数の有効範囲(スコープ)が広すぎたり、変数宣言のvarに限っては変数名の重複が認められたりしています。
このあたりが開発にあたって混乱を引き起こすのですが、現在では変数宣言をletにすれば大体の問題は解決できるでしょう。
というわけで変数宣言にはletを使うことをおすすめします。
また、JavaScriptではオブジェクトという特殊な概念が用いられています。
さらに入門講義には含まれていないもののクラスという似た概念が存在し、こちらも他の言語とは少し扱いが難しいもの。
JavaScriptは知れば知るほど首をかしげるような問題に直面し、理解が難しくなっている言語といえるかもしれません。
ただ入門講義にある内容を活用すれば色々なことができるようになることは確かです。
FPSを実現するタイマー処理
ドットインストールのJavaScript入門講義の第15回目にタイマー処理について書かれているのでこれを勉強してみましょう。
動的な処理をする上で重要なものがタイマー処理です。
例えば画面上をスライドする画像を実現する場合、一定間隔でページを更新し続けなければいけません。
難しそうな話に思えるかもしれませんが分かれば簡単な事です。
時速120Kmで走る車があるとして、これをプログラム上でどう実現すれば良いのかを考えてみましょう。
この車が映る瞬間がモニターに映し出される場合、1時間に1回更新すれば0Km地点から次の更新時には120Km先に車が出現します。
1時間に1回画面が切り替わるようではシミュレーションとして使えません。
分速に直して考えてみます。
時速120Kmは60分で割ると2なので分速2Kmとなります。
というわけで1分間に1回画面が切り替わると2Km先の車を描画できそうですが、まだ間隔が開きすぎです。
では秒速ではどうかというと、60秒で2Km/minを割ると33.333…≒33mが秒速となります。
1秒後には33m先にいる車ですがこれではまるでコマ撮りアニメ。
もっと短くしてみましょう。
さらに60で割ると0.555…≒0.5mとなりました。
このとき、プログラムは1秒間に60回更新をすることになり自然な形で時速120Kmの車を再現することができるようになります。
コマ撮りアニメのようなカクカクしたものではなく、スムーズにリアルタイムな感覚を見るものにもたらすでしょう。
そしてこの1秒間に更新する回数のことを「FPS:Frame Per Second」というのです。
映像作品やゲームは通常FPSが30から60となっています。
そんなFPSを実現する機能こそが「タイマー処理」なのです。
setTimeoutとsetInterval
JavaScriptではタイマー処理をする関数として「setTimeout」と「setInterval」が用意されています。
setTimeoutは処理が「終」わった後に指定時間後、指定関数を実行するという関数。
setIntervalは処理が「始」まった後に指定時間後、指定関数を実行しかつループするという関数になります。
なおsetIntervalはsetTimeout関数で処理を解放してあげないかぎりずっとループする形です。
setIntervalの場合は処理が終わっていない内に次のループに入ると負荷が高まりブラウザを落とす可能性があるので扱いには注意が必要です。
それよりも処理後に時間を測るsetTimeoutの方が使いやすいといえるでしょう。
このタイマー処理をぐるぐる回して映像やゲームの描画処理がされていくわけです。
どこまで理解するかが鍵
JavaScriptの仕様は調べれば調べるほど難しいものと感じてしまうかもしれません。
先述したスコープ範囲の問題やthisが何を指しているのか、オブジェクトやプロトタイプの概念など理解するのは一筋縄ではいきません。
どこかで探求に線引きをしておくのも学習を進める上で有効は判断といえるでしょう。
有料サービスで質問
ドットインストールでは月額980円を支払うことで講師に質問をすることができます。
もしどうしても分からない事や、分かっているのに引っかかるような事があるならこのサービスを利用して質問してみましょう。
僅かな金額で悩みが吹き飛ばせるなら安いものです。
まとめ
オンラインプログラミングスクールのドットインストールを参照しながら勉強してみました。
独学の補助をするようにプログラミングスクールのサイトを活用するのは良い方法です。
ドットインストールでは必要最低限のことが簡単にまとめられているので理解できるまで何回も復習してみましょう。
基礎講義を全部終えたらもう何かしら作れるようになっているはずです。
簡単なものでも良いのでぜひ自分の作品を完成させてみてください。