こんにちは！やこです。今回はプログラミング言語「JavaScript」の解説をプログラミング未経験者でもわかるように説明したいと思います！
JavaScriptってそもそも何？
JavaScriptはどうやって実行するの？
以上のような悩みをこの記事で解決いたします！
この記事は「JavaScript」の紹介をした後に、実際にJavascriptでプログラミングを体験してもらい、プログラミングの理解を深められる内容となっています！
JavaScriptとは？
JavaScriptはプログラミング言語の一種で、主にフロントエンド開発で使用されている言語となります。フロントエンドとは、ユーザーが直接的に操作できるWebサイトの部分のことを指し、フロントエンド開発ではその部分をプログラムで作成しています。
一方で、サイトやアプリなどの見える部分ではなく、見えない部分（サーバやデータベース）などを扱う部分をバックエンドというよ！
JavaScriptは様々な場面で使われています。中でもフロントエンドはJavaScriptを中心とした開発が盛んになっており、ライブラリやフレームワークなども豊富な言語であることから、現在でも多くのプログラマーやエンジニアに使われている優秀な言語です。
補足 ライブラリとフレームワークとは
ライブラリとはプログラミングでよく使う機能をまとめたもの。
フレームワークとはプログラミングでよく使う機能をまとめて枠組みにしたもの。
一見ライブラリと同じに見えるけど実はちょっとした違いがある！ライブラリは単なる頻出機能をまとめたものだけであるけど、フレームワークはどんなものの開発にも必ず必要な機能をまとめた土台のようなもので、アプリなどを開発する時のひな型となるんだ！
有名なJavaScriptのライブラリ・フレームワーク一覧も書いておくよ！
「jQuery」・・・ 2006年に開発された古参で、今でも結構使われている。サイトに動きをつける操作が得意。
「React」・・・ ２０１５年に生まれた新参者。しかしかなり優秀なフレームワーク（ライブラリ）であり、多くの有名サイト（Facebookなど）で使われている。
「Vue.js」・・・ シンプルさが売り。とても簡単なコードで様々な処理ができる。
「Angular」・・・ Googleさんによって開発された。Reactと並び、多くのwebアプリで使われている。
JavaScriptはプログラミング初心者の方でも覚えやすい言語であるので、プログラミングを学んでみたいという方にとてもお勧めです！
初心者にお勧めな理由としては、JavaScriptは実際にコードを書いて動かすという動作までが初心者でも簡単にできちゃう言語だからです。
今回は実際にJavaScriptでプログラミングを体験してもらいます！
JavaScriptを使ってみよう！
JavaScriptを簡単に実行するには？
JavaScriptを実行するために必要な物を説明します。必要なものは以下の通りです。
| コードエディター | プログラムを書く場所のこと（Visual studio codeなど) |
|---|---|
| ブラウザー | Chrome,Safari,Microsoft EdgeのどれでもOKです。 |
| 開発者ツール（ディベロッパーツール） | ブラウザーに搭載されています。 |
必要なものは３つ（開発者ツールはブラウザーにあるので実質２つ）ですが、これら（特にコードエディター）を扱うのはプログラミング初心者にはちょっと難しいです。なぜならJavaScriptの他にもHTMLの知識などが必要になってくるからです。
HTMLの知識がある人はこれら３つを使って学習を進めてほしいけど、今回はプログラミングを経験してもらいたいという話だからもっと簡単にプログラミングを体験できる方法を紹介するよ！
ですので、今回はもっと簡単にプログラミングを体験できるツール「JSFiddle」を使っていきます！
「JSFiddle」はJavaScriptをめちゃくちゃ簡単に実行できる初心者の方にお勧めなツールです！（HTMLの知識も必要ありません！）ログインなしで利用できるのでぜひ使ってみてください！
「JSFiddle」はこちらから→JSFiddle – Code Playground
JSFidlleでJavaScriptを実行する準備を整える
JSFiddleのページに飛ぶとこのように表示されるはずです。
左上にHTMLのコード、右上にCSSのコード、左下にJavaScriptのコードを打つことができます。
今回はコンソールと呼ばれる自分が書いたプログラムが実行されたかどうかを確認できる場所に文字を出力するコードを書いていきます。
そのために、まずはコンソールを表示させます。「JSFiddle」ではコンソールは一番右下の「Console [beta]」と書いてあるところをクリックすると表示されます。
上の写真では、コンソールが右下に表示されていることがわかりますよね！
ここからいよいよコードを入力していくよ！
JavaScriptを実行する
では、いよいよコードを書いていきましょう！
今回書くコードはこちらのたった一行です！（セミコロン（;）はJSFiddleではつけなくても動きます。）
console.log(“文字列”)
このコードを簡単に説明すると「（）の中に表示している文字列をconsole（コンソール）に表示してくださいよ」という命令になります。プログラミングとはコンピューターに命令してあげることです。そして、命令をきちんと伝えるにはコンピューターができるような言語で話さないといけません。そのコンピューターが理解できるような言語がまさしく今回のJavaScriptのようなプログラミング言語となります。
ちなみにプログラミングで文字列（ひらがな、漢字、英字など）はダブルクォート（”）かシングルクォート(‘)で囲ってあげないといけません（”文字列”か’文字列’のみ、”文字列’、’文字列”などはできない）。このことは他のプログラミング言語（PHPやPython）なども共通するのでぜひ覚えてください！
では、さっそくコードをかいてみましょう。（文字列の場所はなんでも書いていいです。）
拡大するとこんな感じ
今回私はconsole.log(“こんにちは！”)と入力したので、「こんにちは！」とコンソールに表示されるはずです。
実行（Cｔｒｌキー押しながらＳを押すと実行できます。）してみると・・・
このようにコンソールに表示されています！これでプログラムを実行できたことになります！
もちろん文字列を変えればその変えた文字列がコンソールに表示されます。
プログラミングとは、このように自分でPCに、PCが理解できる言語で命令を伝え、その命令の結果をPCが返すまでの動作のことを指します。
今回はコンソールに出力するだけの命令でしたが、JavaScriptではこのほかにも多くの命令ができるので、それらを組み合わせてアプリやサイトなどの構造を作っているのです。
まとめ
今回はJavaScriptの紹介とJavaScriptでのプログラミングを実際に体験してもらいました！
JavaScriptはアプリ開発やゲーム開発、Webサイト制作など、様々な部分で使われている言語だから将来プログラマーになりたい方はぜひ習得しておこう！
なお、他にもIT系関連の記事を投稿しているのでそちらもよろしければご覧ください！
