WEBサイト制作の勉強

WEBサイト制作の勉強の為の解説ブログです。

フェリカテクニカルアカデミー

javascriptとは

f:id:yachin29:20200713193026p:plain

JavaScriptとは、米Netscape Communicationsによって開発されたスクリプト言語です。JavaScriptは主にWebブラウザ上で動作します。クリックすると画像が変わったり、要素が消えたり、現れたりというHTMLやCSSでは出来ない、いわゆるサイトの動的な部分を担当しているスクリプト言語です。
Webサイト・Webアプリ・バックエンド・デスクトップアプリ・モバイルアプリなど、ブラウザからサーバー、デスクトップからスマートフォンまで使用場面は多岐にわたっています。

それどころか、今やJavaScriptは宇宙船のUIにも使用されています。
note.com


JavaScriptと似た名前のプログラミング言語に「Java」というものがありますが、まったく関係がありません。なので混同しないようにしましょう。

スクリプト言語

JavaScriptスクリプト言語です。ではスクリプト言語とはどういうものか?
簡単に言うとスクリプト言語とは簡易版のプログラミング言語で、特に実行環境を整える必要も無く、ソースコードをその場で順を追って解釈する「インタープリタ方式」の言語です。

プログラム初学者にとっては特に難しい設定をしなくて済み、手軽に使えるのがこのJavaScriptです。


なぜJavaScript?

主なJavaScriptフレームワークやライブラリー

AngularJS

f:id:yachin29:20200713193426p:plain

React

f:id:yachin29:20200713193551p:plain

Vue.js

f:id:yachin29:20200713193624p:plain

jQuery


また、サーバーサイドでJavascriptを動かす事が出来る「node.js」やSNSとの通信で使用する「JSON」などjavascriptはとにかく汎用性が高く、便利な言語です。

JavaScriptで出来る事

演算処理

プログラミングの基本である演算処理。単純な四則演算のほか、三角関数や円周率等を使用したり、年齢を算出したり、日数を割り出したりなど、さまざまな用途で使用します

ドキュメント操作

Webページに文字を表示したり、非表示にする。文字や背景の色を指定する。 Webページを切り替える、など、html内のドキュメントを操作する事が出来ます。

マウス等のイベント処理

クリックやマウスオーバー、Webページそのものロード時など、その他様々なタイミングで処理を行わせることができます。
サムネイル画像をクリックすると大きい画像が表示されるようなものから、メニュー項目をクリックすると下の階層のメニューが開くようなナビゲーションまで、このようなイベント処理を行っています。

DOMを使用した処理

DOM(Document Object Model)を使用することで、HTML文をツリー構造のように扱うことができます。
これを上記のイベント処理等と組み合わせて使用することで、サイト内に新しいコンテンツを挿入したり、書き換えたり、削除することが出来ます。


上記以外にも最近ではVR(仮想現実)やブラウザーゲームなどにもjsは使われていて、汎用性はますます上がっています。


ja.monaca.io