JavaScriptとは?初心者向けプログラミング体験もできる!

web開発

2017/08/17

web開発

プログラミング言語のJavaScriptとは何かについて、Web開発経験のある筆者がわかりやすく解説します。

本記事では、「プログラミング言語JavaScriptとは何か」「JavaScriptで出来ることや特徴」などについて解説していきます。

最後には、実際にJavaScriptのプログラムを書いて動かしてみる体験も用意しました!

プログラミング初心者でも理解できるようにわかりやすく解説しているので、ぜひ最後まで読んでJavaScriptとは何かを理解してください。

プログラミング言語JavsScriptとは?

まず、プログラミング言語JavaScriptとは何かについて解説します。

JavaScriptとは、ブラウザに作業をさせるためのプログラミング言語です。

もっと、簡単にいうとWebページに「動き」のあるページを作成するための言語です。

Webページを見ていると「画像のスライドショー」、「ボタン」や「申込みフォームの入力」などをみることがあります。

画像のスライド時のエフェクトやユーザーの入力に応じた処理などをJavaScript言語で実現できます。

いつも見ているWEBページでもどこかでJavaScriptが使われているかもしれません。

そう考えると、とても身近なプログラミング言語なんです。

プログラミング言語は、たくさんあります。

C言語、C++、PHP、Perl、Python、Java、JavaScriptなどです。

「Java」と「JavaScript」では、語呂が似ていますが全くの別物なので注意しましょう。

JavaScriptについて

JavaScriptはスクリプト言語の1つでもあります。

通常の言語(JavaやCといったプログラミング言語)プログラムを実行するためにコンパイルという手続きが必要です。

人が書いたソースコードを機械が読み取れるように変換をすることで初めて実行ができます。

しかし、JavaScriptのようなスクリプト言語では以上のような手続きが不要なのでJavaやCに比べてプログラミングが手軽にできます。

JavaScript言語では、記載したソースコードをブラウザが理解しその内容を実行してくれます。

 

プログラミング言語JavaScriptの特徴と出来ること

本章では、プログラミング言語JavaScriptの特徴と出来ることについて解説します。

動的なWebページ&Webアプリケーション(フロントエンド)の作成

JavaScriptで作成できるものとしては以下の例があります。

  • 画像のスライドショー
  • ボタンを押したら次の画像を出力
  • ボタンを押したらデータを計算する
  • メニューボタンを押したら滑らかに該当項目へ移動

JavaScriptを使うことで、上記のような処理が可能です。

但し、特定の動作や演出効果を出す命令をまとめたライブラリ(jQueryやBootstrapなどが代表的)が存在しています。

近年では、そういったライブラリを使っての開発を行うことが多いです。

最近では、ほとんどのWebページが何かしらのJavaScriptを読み込んでいます。

 

サーバーサイドの開発「Node.js」

JavaScriptの解説

サーバーサイドの開発といえば「php」「perl」「ruby」などの言語で開発するのが一般的でした。

最近では,サーバーサイドJSと呼ばれるものがでてきており、

サーバーサイド(バックエンド)をJavaScript言語で開発できるようになりました。

代表的なものでは「Node.js」が有名です。

フロントエンドをJavaScriptで開発し、バックエンドもJavaScriptで開発ができるので、

開発効率の向上が見込めます。

 

本格的なゲーム開発「Unity」

Unityの統合開発環境の画面

Unityの統合開発環境の画面(JavaScriptファイルを作成時)

最近のiPhoneやAndroidゲームは、「Unity」と呼ばれるゲームエンジンで作られるケースが増えています。

「Unity」では、統合開発環境を提供しており、3D/2Dのゲーム開発が可能です。

この中で使えるプログラミング言語の一つとして、JavaScriptが採用されています。

 

実際にJavaScriptを書いて動かしてみよう!

では、実際にJavaScriptのソースコードを記述してみて、プログラムを書いてみましょう!

開発環境などの設定は不要なので、プログラミングをしたことない人でも大丈夫です。

まずは以下のサイトにアクセスしてください。

https://paiza.io/projects/new

そして、左上の緑色の枠から「JavaScript」を選択してください。(デフォルトでは「Swift」になっていると思います。)

JavaScriptの使用画像

そして、黒の画面の箇所に以下のソースコードを記述してみてください。

JavaScriptの使用画像

そして、左下にある緑の「実行」ボタンを押します。

JavaScriptの使用画像

すると、下の「出力」という欄に先ほど書いた「Hello JavaScript」が表示されました。

JavaScriptの使用画像

いかがでしたか?

プログラミング言語JavaScriptを体験できましたか?

目的別!最先端ITスキル講座

海外の人気講師によるWeb制作のベストセラ―講座

【世界で30万人が受講】フルスタック・Webエンジニア講座(2017最新版)
【世界で30万人が受講】フルスタック・Webエンジニア講座(2017最新版)

ウェブデザインの基礎、サーバーサイドプログラミング、モバイルアプリ開発、APIプログラミングなどを網羅的にマスターできる

最新!iOS11アプリ開発講座

【6日で速習】iOS 11 Swift 4アプリ開発入門 決定版 20個のアプリを作る ARKit,CoreML,NFC
【6日で速習】iOS 11 Swift 4アプリ開発入門 決定版 20個のアプリを作る ARKit,CoreML,NFC

地図検索、ARなど20個以上のアプリを作って学べる実践講座

日本を代表するデータサイエンティスト辻真吾氏による人気講座

【世界で5万人が受講】実践 Python データサイエンス
【世界で5万人が受講】実践 Python データサイエンス

データ解析の基本、可視化、統計、機械学習などデータサイエンスに関するあらゆる実践的なスキルがPythonで身に付く!

初級者から学べる人工知能講座の決定版

みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習
みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習

初心者向けの人工知能と機械学習のコース。文字認識や株価分析なども実施

  • シェア
  • ツイート
  • Poket
  • はてなブックマーク
  • フォロー
  • シェア
  • ツイート
  • Poket
  • はてなブックマーク
  • フォロー

関連記事