JavaScriptプログラミング

JavaScriptとは?人気No1言語 JSの特徴や種類などを解説

JavaScript
この記事は約11分で読めます。

今や人気のJavaScriptですが、JavaScriptとはどのようなプログラミング言語なのかを解説します。

JavaScriptは、エンジニアであれば必ず習得しておきたい言語で、フロントエンドエンジニアだけでなく、サーバーサイドのこともでき、万能な言語へと発展しています。
そんなJavaScriptは、よくJavaと似ている言語や、同じ言語といった勘違いがありますが、JavaScriptとJavaの違いも含めてご紹介します。

JavaScriptとは?

JavaScriptとは、HTMLとCSSを組み合わせることで動きのあるリッチなウェブサイトを作るためのプログラミング言語です。HTMLとCSSだけでは静的で簡素なウェブサイトになりますが、JavaScriptによって様々な機能を付け加えることができ、今やウェブサイトを作成する上でJavaScriptは必須の言語となりました。

例えば、ボタンをクリックするとボタンの色が変化したり、フェードアウトで消えるといったことも簡単にできますし、マウスをホバーしたときに何かを変化するなどもできます。

このようにHTML、CSS、JavaScriptの3言語を使って、クライアントサイド(フロントエンド)が作り込まれています。
またJavaScriptは、フロントサイドに動きを加えるだけでなく、サーバーサイド(バックエンド)のタスク処理もできるNode.jsもあります。
数あるプログラミング言語の中で、JavaScriptの人気度1位を獲得しています。理由はNode.jsによってサーバーサイドの技術発展が後押ししています。Node.jsが出るまでは、JavaScriptは単なるクライアントサイドにちょっとした動きを加える言語という認識で、全然イケてない言語ということで人気がありませんでした。しかし今やNo1の人気ということなので、JavaScriptはエンジニアになる人であれば必ず学んでおいたほうがいいプログラミング言語となります。

プログラミング言語の人気ランキングはこちら

初心者にオススメのプログラミング言語人気ランキング
プログラミングを始めてみようという初心者の方にオススメの言語をランキング形式でご紹介。アメリカで人気のランキングや、日本で就職しやすく現場で使われている言語、高速に処理する言語など幅広い視点での順位になっています。どの言語から始めたらいいかわからない人向けにとても参考になります。

JavaScriptのライブラリとフレームワークの種類

JavaScriptを使ってゼロからコーディングをする事は現場ほぼなくなっています。ライブラリやフレームワークを使うことでコーディングが楽になり構築の時間短縮が可能となるため、ほとんどのエンジニアやプログラマーは利用していることでしょう。
そこでJavaScriptのライブラリとフレームワークの種類についてご紹介していきますが、まずはライブラリとフレームワークの違いを簡単に説明します。

ライブラリとは

ライブラリとは「図書館」という意味があるが、使いたい機能(部品)が入っている箱のようなもの。つまり、細かい出来上がった部品(プログラムのコードの集まり)があるため、0から自分で作らずにその部品を使ってコーディングを短縮することができる。
例えば、車を作りたい時に「タイヤというライブラリ」、「ハンドルというライブラリ」といったイメージ。

フレームワークとは

フレームワークは、ライブラリと違ってもっと大元の箇所の部分を表しており、プログラム全体の処理のルールが実装されている。その中で自分が必要なものを嵌め込めるようなシステムテンプレート
例えば、車を作るときに車のシステムテンプレートが車のフレームワークとなり、エンジニアは必要な機能をつけたい場合は、そのルールにしたがって作っていくことができる。つまり、フレームワークというシステムテンプレートとライブラリを組み合わせることでエンジニアやプログラマーは従来より簡単に車を作り上げることができます。

JavaScriptから派生したプログラミング言語の種類

JavaScriptは1つの種類だけでなく、今やエンジニアにとって必須の言語と言っても過言ではないぐらい人気です。そのため、1つだけでなく以下のように色々な種類が生まれているため各々ご紹介していきます。

  • Node.js:ウェブサーバーで動作するJavaスクリプト実行エンジン
  • TypeScript:大規模アプリの開発の向けのプログラミング言語
  • CoffeeScript:JavaScriptの代替え言語で、シンプルに記述できる
  • Dart:モバイルアプリ開発ではFletterが人気
  • Google Apps Script:GoogleのVBAで、自動化にオススメの言語

Node.jsとは?

Node.js(ノードジェイエス)とは、JavaScript開発では欠かせない高速実行環境のサーバーサイドプログラミング言語です。JavaScriptは元々ウェブサイトに動きをつける言語として登場し、フロントエンドの言語だっだのですが、Node.jsが登場したことでバックエンドにも対応して万能な言語へと成長しました。

ウェブアプリケーションの作成に用いられることが多く、Expressといったウェブフレームワークが最も有名です。ウェブブラウザ向けのJavaScriptのプログラムを整えたり、CLIツールとしても利用されています。また豊富なライブラリーを活かしてバッチ処理にも利用されていたりします。

Node.jsは、性能の高さ・効率の良さに加えて、ブラウザ側のプログラムとサーバー側のプログラムの両方をJavaScriptで記述できることもメリットです。またパッケージマネージャーはnpmや、Yarnがあります。npmなどのパッケージマネージャーには、パッケージを共有・取得する機能があります。

TypeScriptとは?

TypeScript(タイプスクリプト)とは、JavaScriptの上位互換された大規模アプリの開発の向けのプログラミング言語です。ウェブのフロントエンド開発で人気が高く、定番の言語となりつつあります。TypeScriptは、JavaScriptの静的型付け版言語で、JavaScriptにトランスパイル(変換)して使います。

元々JavaScriptは、JavaやC#のような大コボな開発で用いられることが多い静的型付けの機能を持っていなかったですが、TypeScriptはこの部分を補うために開発されて、JavaScriptと文法が近い言語です。

CoffeeScriptとは?

CoffeeScript(コーヒースクリプト)とは、短く手軽に記述できるJavaScript代替え言語で、シンプルに記述できるのが特徴です。

CoffeeScriptは2011年頃から注目をあび、JavaScriptの使いづらい箇所を改善できていたため、様々なプロジェクトで用いられるようになりましたが、2015年のES6が発表されて以降、JavaScript自体に強力な機能が追加されていくことでコーヒースクリプトのメリットがなくなり人気は落ちています

Dartとは?

Dart(ダート)とは、JavaSciptの置き換えや、Flutterのモバイルアプリ開発まで幅広く、UI構築が得意なプログラミング言語です。Dartが出た当初は、JavaScriptの置換を狙っていましたが、JavaScript自体の進化も凄かったため、現在はパフォーマンスと生産性を両立したクライアント向け言語へと進化しています。スマートフォンのアプリ開発だけでなく、ウェブ開発もできるのが特徴。

Google Apps Scriptとは?

Google Apps Script(グーグルアップススクリプト)とは、Googeが提供するオフィスアプリケーション(Googleドキュメント・Googleスプレッドシート・Googleスライドなど)を自動化するためのJavaScript互換のプログラミング言語で、GoogleのVBAと考えると分かりやすいです。通称:GAS(ガス)とも呼ばれており、VBAと違ってサーバーを用意しなくてもコードを実行できるため、GASを使うことでTwitterのBotなどAPIを連携してパソコンを起動せずとも自動化することができます。

JavaScriptとJavaは全く違う言語

非エンジニアの方には、JavaScriptとJavaの違いを全く理解していないですし、そもそも同じ言語だと思っている人も多いです。

私が同僚のマーケターに「これはJS(JavaScript)で書かれている」というような話をした際に、同僚が「Javaならちょっと勉強したけどわからなかった」と言っていました。

私もJavaScriptを勉強するまでは同じように、Javaと似ている言語という認識でした。実際に自分でプログラミングをするようになってからは、全くもって違う言語だと知ったときには驚愕したことを今でも覚えています。

JavaScriptは元々ウェブサイトに動きをつけるためのクライアントサイド(フロントエンド)側の言語でした。しかしJavaは、システムやアプリケーションを構築するための言語です。もしこれを聞いてもあまりピンときてない方には触ってみないとわからないかもしれません・・・。

JavaScriptを利用する上でのJS用語

JavaScriptは日々進化していますが、JSを利用する際によく使われるライブラリや技術の頻出用語をご紹介します。

  • DOM(ドム):JavaScriptでHTMLの要素を操作するための仕組みで、JSを利用する上で必須。
  • Ajax(エイジャックス):非同期処理を行い、必要な部分だけのデータをやり取りすることができる。ページ全部の読み込みをせずとも情報の更新ができる技術を利用され、Google Mapsが最も有名。
  • jQuery(ジェイクエリ):JavaScriptのライブラリーで簡単に機能を追加でき、0からコードを書く必要がなくほとんどのウェブサイトに使用されている。
  • JSON(ジェイソン):テキストベースの軽いデータ。APIなどデータをやり取りする際によく使用される。XMLよりも軽いためとても人気。

JavaScriptを始めるオススメ学習方法-JS入門

JavaScriptを0から学んでいきたいと思う方は多いと思いますが、どこから始めたらいいのかがわからない、なるべくお金をかけずに初歩を学びたい、近道を知りたいのようなことがあります。
JavaScriptを学ぶ方法はたくさんありますが、私がオススメするオンライン学習サイトや書籍をご紹介します。

JavaScriptのオンライン学習サイトオススメ

ドットインストール

ドットインストールは、かなり有名なサイトでプログラマーの方なら一度は試したことがあると思います。実は私もドットインストールでJavaScriptを学び始めました。しかも無料で入門編をマスターできるのでとてもありがたかったです。

ドットインストールがあったからこそ、JSの基礎を学ぶことができたと本気で思います。

「premium」と記載があるのが有料講座になりますが、「はじめてのJavaScript(全11回)」は無料なので、こちらを受講してみてください。

【JavaScript講座リンク】ドットインストール-JavaScript

Progate

progate(プロゲート)は、ここ数年でかなり人気になってきているオンラインの学習サイトです。progateから始めて今では立派なプログラマー・エンジニアになっている人も知っています。

Progateには色々なプログラミング言語の学習ができますが、JacvaScriptだけ全7レッスンがあり、無料で受けることができます。

Progateには有料会員もありますが、基礎であれば無料会員内で十分マスターできます。もしもっと応用力を付けたいのであれば有料会員で学ぶのもいいと思います。

Progateの学習アプリ内で、全て完結するということがかなりオススメです。例えば、node.jsを学習しようと思ったときには自分のPCにjsファイルや、ターミナル(Macの場合)を用意して実行していく必要があります。しかしProgateは、それらの開発環境を用意せずとも手順に沿ってやっていけばいいため、最初でつまづくということがありません。是非、JavaScriptを試してみてください。

【JavaScript講座リンク】Progate-JavaScript

paizaラーニング

paizaラーニングはエンジニアの転職サイトが主な事業となっていますが、転職者のスキルアップのためにオンライン学習講座があります。有料なレッスンが多いですが、JavaScriptであれば無料で入門編を受講できます。

全部で15回に分けられた講座があり、プログラミングとはから始まり、ループ処理やデータの取得などの基礎を学ぶことができます。こちらも実行環境などを揃える必要がないので気軽に始めることができますね。

【JavaScript講座リンク】Paizaラーニング-JavaScript

CodeCamp(コードキャンプ)

CodeCamp(コードキャンプ)はオンラインのプログラミングレッスンですが、現役エンジニアが徹底的に教えてくれます。今までご紹介したオンライン学習は既に作られた動画を元に独学で勉強していく感じですが、CodeCampは先生がいるので理解度や吸収度合いが全然違います。

無料体験レッスンもあり実際の教科書の内容や、先生に直接不明点が聞けるので、本気でプログラミングを学ぼうという方にはオススメです。

今の時代プログラミングを学ぶことで給料が上がっていくので、最初の初期投資だと思って、現役エンジニアにしっかり教わってみるのも悪くないのでしょうか。

【JavaScript講座リンク】CodeCamp-JavaScript



JavaScriptのオススメ書籍



コメント