クライアントサイド、サーバーサイドでのJavaScriptについて

##JavaScriptの特徴
JavaScriptは環境（実行環境のこと、ランタイムとも言う）によって特徴が変化します。

###ランタイム(run time)
開発したコンピュータプログラムを実行する時のこと。
また言語やOSによっては実行時に特定のソフトウェアが必要になることがあり、
これらはランタイムライブラリ、ランタイムパッケージ、ランタイムモジュール、ランタイムエンジンなどに細かく分けて呼ぶことがあるが、それらを略してランタイムと呼ぶことが多い

####ランタイムライブラリ
ライブラリは便利なプログラムのコードを集めたファイルのことを指します。
なのでランタイムライブラリはランタイムを行うためのプログラムのコードを集めたファイルという意味になります。

####ランタイムパッケージ
ランタイムパッケージとは
プログラムを動かす際に関連する様々な要素を一つにまとめたもののことを指します。

####ランタイムモジュール
モジュールとは内部がより単純な複数の要素で構成され、それ自体がある程度まとまった何らかの意味のある機能を有するようなものを指します。
そのためランタイムモジュールはプログラムを実行するための部品のようなものにあたります。

####ランタイムエンジン
エンジンとは何かに特化したプログラムや機械のことを指します。
例えば検索エンジンは検索に特化したプログラムのことを指します
そのためランタイムエンジンはプログラムの実行に特化したプログラムのことを指します。

###パッケージとライブラリとモジュールの違いは？
違いについてはこちらの記事を参考にさせていただきました。

それぞれの部品のまとまりや規模で用語が変わってきます。
モジュールが部品にあたり、モジュールの集まったものがパッケージ、
パッケージをいくつかまとめてインストールできるようにしたものが
ライブラリ＞パッケージ＞モジュールのようになています。

###変化のパターン
####クライアントサイド
ブラウザ上（ブラウザ上で動く唯一のプログラミング言語）でのJavaScript
→スマホやパソコンのスペックが向上したことで利点が大いに生かされるようになった
CSR（Client Side Rendering）が可能になった。

####サーバーサイド
→Node.jsを使用したサーバーサイド側でのJavaScript。
SSR（Sever Side Rendering）で利用されることがある。
※ Node.js上で動かすものとして、、SEO対策でクローラーに向けてデータを返したり、スクレイピング(データを収集した上で利用しやすく加工すること)などで使われるpuppeteerが有名である。

つまりクライアント側で動作するJavaScriptとサーバーサイド側で動作するJavaScriptに分かれており、それぞれの特徴を持っています。

###ブラウザ上（ブラウザ上で動く唯一のプログラミング言語）について
JavaScriptは定義した変数や関数を読み取ることのできる範囲が定められている
→ スコープという

大きく分けて
１、グローバルスコープ
２、ローカルスコープ
の２つに分けることができる。

####グローバルスコープ
グローバルスコープには変数のvarやlet,constが存在するが、厳密にはvarは違う部類に入る。
変数としてvarが存在するが、varはwindowオブジェクト（グローバルスコープ）を通して他のファイルからもアクセスできてしまうため、非推奨となった。
その代わりとしてES6から登場したのがletとcoustであり、これらは厳密にはグローバルスコープではなく、スクリプトスコープに分類される。

####ローカルスコープ
ローカルスコープはブロックスコープと関数スコープがあり、{}の中の変数のことを示す。

また、ある関数スコープが他の関数スコープを含んだ状態のことをスコープチェーンという。

####関数と無名関数との違い
・関数→ホイスティングが発生することにより、後から変数を定義しても呼べちゃう
・無名関数→ホイスティングが発生しない→先に定義付けを行う必要がある

後から定義づけを行う→コードが汚くなり、可読性が下がる

Javascriptはhtmlを直接的に操作することができない
→htmlをDOM（Document Object Model）に変換することで操作可能となる。

##jQuery
・ライブラリ（引用しやすい便利ツールが集まったもの）の一種
・DOM操作を$()で行うことでコードが見やすくなる
・JavaScriptに比べコードが簡潔なので書き手も読み手も見やすいコードを書くことができる

##Vue
・フレームワーク（ライブラリーの一種だが→拘束力が強く主導権をガッツリ握ることが多い）
の一種だが公式は、
「Vueはプログレッシブフレームワークであり、フレームワークではあるがライブラリーのように少しだけ使うこともできる」と言っている。

##jQueryとVueの違い
大きな違いはDOM操作を自動（リアクティブシステム）で行なってくれるか自分で行なう必要があるかどうか
→大規模になるほどVueで書いた方が綺麗で整ったコードになる。