13
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

PLISEAdvent Calendar 2020

Day 24

JavaScript・jQuery 学習のすすめ

Last updated at Posted at 2020-12-23

はじめに

私が JavaScript・jQuery に初めて触れてから 3 年以上が経ちました。
その間、AltJS である TypeScript に触れたり、React などのフレームワーク、npm・webpack・babel などの開発ツールなどにも触れてきました。

もともと C や Java を触っていたこともあり、動的型付けや関数が第一級オブジェクトであることなど新鮮なことがたくさんあり、同時に戸惑いも多くありました。
また、自分自身が非効率な学習法をしていたとの反省もあるので、個人的におすすめの学習法をここに記していきます。

対象

  • 2 つめ以降の言語として、JavaScript を学習したい人
  • JavaScript を触ったことがあるが、改めてしっかり勉強したい人

JavaScript おすすめ勉強法

歴史・言語特性を知る

JS に限った話ではないですが、いきなり文法などから入るより言語が生まれた経緯や、プログラミング言語としてどういった特性があるかなどを学びましょう。

ECMAScript を学ぶ

ECMAScript とは

JavaScript を学ぶにあたって最初に学ぶべきは ECMAScript です。
ECMAScript を初めて聞いた人もいるかと思いますが、これは JavaScript の言語仕様を規定したものです。

JS は各種ブラウザやサーバーで動く(Node.js)ため、それぞれの環境で独自の仕様があります。
例えば、ブラウザでは DOM 操作のための機能があり、Node.js では標準入出力用の機能があります。

ECMAScript は毎年更新されており、それぞれ ES2020 のようにリリース年とともに表されます。ちなみに ES6 と言われるものは ES2015 の別名です。

なぜ

  • どの実行環境や FW でも役立つ知識であり、必要な知識
  • いきなり実践から入ると、基礎が身につかない

どの実行環境や FW でも役立つ知識(・必要な知識)が ECMAScript です。FW やライブラリを使うためには裏側を想像できる方が良く、そのためには JS の機能を知っておく必要があります。
例えば jQuery を触っていると、どこまでが JS 本来の機能でどこからが jQuery の機能なのかわからなくなることもあるかもしれません。

おすすめのサイトと書籍

選ぶ上で重要なのが、ES2015(ES6) 以降に対応していることと、ブラウザでの処理に特化していないことです。
同じ JavaScript の入門書でも、ブラウザ寄りの本とそうでない本があるので注意が必要です。

  • JavaScript Primer

    超絶おすすめ。
    これはある程度学習が進んだ後に読みましたが、ECMAScript の仕様を重点的に説明してあり、余計な解説がなくて良いです。
    また、最新の仕様(ES2020)にも対応しており、かなりおすすめできるサイトです。

  • 初めての JavaScript 第 3 版 ―ES2015 以降の最新ウェブ開発

    こちらは書籍のため最新の仕様には対応していませんが、ES2015 に対応していて選ぶ上での基準は満たしているのでおすすめできます。
    私はこの本で入門しました。

  • MDN JavaScript リファレンス

    リファレンスとして。

基礎への理解を深める

さて、一通り ECMAScript について学びましたが、練習の場が必要かと思います。

そこで気をつけて欲しいのは、Web アプリの作成は JS の基礎の勉強に向かないということです。
いきなり Web アプリを作ろうと思うと、DOM 操作を覚える必要があったり、HTML・CSS の知識が求められるため、JS を身につける上ではおすすめできません。
FW やライブラリを使うとそれらの勉強がメインになってしまいます。せっかくそれらを避けて基礎を勉強したので、基礎が不安定なうちはそれらを避けた方が良いです。

個人的なおすすめは、Node.js で AtCoder や paiza にあるような問題を解いてみるのが練習としてはおすすめです。
私の場合は、大学のアルゴリズムの課題を解いていました。ここで JavaScript の基礎がかなり身についたと感じてます。

関数型プログラミングをかじる

基礎への理解を深めると同時にやりたいことが、関数型プログラミングについて知ることです。

第一に関数が第一級オブジェクトであることに慣れてください。
C や Java 出身だとここで躓くことが多いように感じます。

ここについてはおすすめの学習法は特にないです。
関数型プログラミングで調べて、どのようなものか調べてみると良いと思います。

jQuery

jQuery はネット上に情報が掃いて捨てるほどあるので、ピンポイントで調べても情報が見つかるのですが、ある程度体系的に学んだ方が良いです。
軽く触るくらいなら良いですが、継続的に使う場合は、まとまったドキュメントを読みましょう。
おすすめは下の 2 つです。

  • 初心者向けの jQuery 入門講座

    基本的な使い方がわかりやすいのと、リファレンスの一覧性が良いのでおすすめです。
    リファレンスは何度か全体に目を通すと良いです。

  • 公式

    最新はこちらで。

まとめ

  • 最初に ECMAScript (JavaScript のベース)を抑える
  • 実践しつつ基礎への理解を深める
    • Node.js で paiza や AtCoder にあるような問題を解くと基礎が身につきやすい
    • 関数型プログラミングに触れておく
      • 関数が第一級オブジェクトであることに慣れる
  • jQuery はある程度体系的に学ぶ

JS 自体が動的型付けであり、マルチパラダイムな言語であり、結構自由な言語です。
だからこそ、基礎をしっかり身につける必要があるかなと思ってます。

13
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
13
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?