JavaScript プログラミング

JavaScriptで学ぶべきことと学ぶ順番「初心者~中級者向け」

投稿日:2018年12月12日 更新日:

こんにちは!シミダイ(@shimidai2100)です。

JavaScriptで絶対に学ぶこと学ぶ順番について紹介したいと思います。

JavaScriptはフロントエンドだけでなくモバイルバックエンドでも利用できるため学ぶことも多いです。

出来ることも多いので「初心者の人は何を学べばいいか?」「どんな順番で学べばよいのか?」混乱してしまいます。

また多くの学習サイトや書籍でも技術に偏りがあるため、網羅的に学習することが難しいです。

そんな初心者~中級者に向けて学習のロードマップを紹介したいと思います。


基本構文

まずは基本構文を覚える必要があります。

基本構文とは、

  • コンソール出力
  • 四則演算
  • 変数、配列の利用
  • 条件分岐、比較演算
  • 繰り返し処理
  • オブジェクト操作

基本構文を覚えるのオススメのは断トツでProgateです。

Progateなら開発環境を準備をする必要がなく、ネットにつながっていれば直ぐに始めることができます。

参考Progateはこちら

※ 月額980円かかります。

関数

次に関数を覚えていきましょう。

関数を利用することで何度も利用する機能を再利用することができるようになります。

そのため開発のコストを下げることが可能になります。

またこのタイミングで必ずアロー関数はマスターするようにしましょう。

アロー関数とはES6から実装された記法で、見やすいコードを書くために必須の記法になります。

Progateもオススメですが、さらに関数のイメージが付きやすくなるので、「JavaScript ふりがなプログラミング」もオススメです。

標準ビルトインオブジェクト

関数とオブジェクトをマスターしたら標準ビルドインオブジェクトを学びます。

標準ビルドインオブジェクトとJavaScriptを利用する時に、誰でも利用することが出来る標準のオブジェクトになります。

標準ビルドインオブジェクトで以下のオブジェクトを利用することが出来ます。

  • 文字列操作
  • 正規表現
  • 正規表現
  • 数学計算
  • 日付/時刻

参考標準ビルトインオブジェクト

この辺りはProgateでは学習することが出来ません。

なのでドットインストールの「JavaScript基礎文法徹底マスター」を学習することをオススメします。

完璧に教えてくれるわけではなく、一部の内容をさらった学習できる程度ですので自分で学習する必要があります。

DOM(ドキュメントオブジェクトモデル)

DOMを利用することでHTMLやCSSの内容を変更することが出来ます。

DOMを利用することでHTMLのタグ、属性、値を動的な変更することができます。

いきなり扱い始めると覚えることが多いので始めはJQueryを学習して、イメージを定着させてから、

生JavaScriptで学習することをオススメします。

参考ドキュメントオブジェクトモデル(DOM)

ブラウザオブジェクト

ブラウザ毎の固有の機能を利用するのがブラウザオブジェクトです。

ブラウザを操作するための機能を持ち、各ブラウザで微妙に仕様が異なります。

昔はブラウザ毎の独自仕様に悩まされていたそうですが、近年では互換性が保障されています。

DOMはブラウザオブジェクトに含まれるですが、別々で学習することをオススメします。

ブラウザオブジェクトの学習方法には「W3C School」で学習することができます。

参考:W3C Shcool

イベントハンドリング

イベントハンドリングとはあるイベントに対して、どのような処理をするのか登録することをいいます。

また登録する処理のことを「イベントハンドラ」「イベントリスナ」とも呼びます。

イベントハンドリングを使うことでボタンを押した時にメッセージを送信したり、マウスを動かした時に色を変えたりすることができます。

イベントハンドリングのオススメ学習方法ですが、「W3C School」です。

参考:W3C Shcool

特に「addEventListener」は必須ですので、しっかり覚えましょう。

参考:JavaScript HTML DOM EventListener

Ajax(Asynchronous JavaScript + XML)

ここまで来たら勉強すべきことはAjaxになります。

Ajaxを利用することで何度もHTTPリクエストを送らずに非同期で通信を行うことができます。

Ajaxを利用している技術で有名なのは「GoogleMap」です。

Ajaxを教えてくれるWebサービスはあまりないので、是非書籍を買って学習することをオススメします。

クラス

ここまで来たらクラスを勉強していきます。

ES6からオブジェクト指向プログラミングがJavaScriptでも出来るようになりました。

クラスを利用することで大規模開発を行う時にコードの保守性を高めることが出来、再利用性の高いプログラムを作成できます。

クラスの勉強を行うには「Progate」がオススメです。

参考Progateはこちら

※ 月額980円かかります。

ただクラスを使用したオブジェクト指向プログラミングはかなり奥が深く相当難しいです。

クラスを利用できるようになっても、「どこでこれを使うんだ?」ということになります。

なので「オブジェクト指向でなぜつくるのか」を呼んでオブジェクト指向の全体感を掴むことをオススメします。

 

スポンサードリンク

関連記事

-JavaScript, プログラミング

Translate »

Copyright© shimidai2100 , 2019 All Rights Reserved.