はじめに
Webページを制作する上で、HTML・CSSとともに欠かすことができないのがJavaScriptかと思います。
でも、HTMLやCSSといった「マークアップ言語」と違い、JavaScriptってちょっと難しそう……と思っている人も多いのではないでしょうか。
JavaScriptは意外とシンプルで、基礎的な部分は他のプログラミング言語と同じところも多いかと思っています。
そこで、Javascriptを学習してみよう！と思っている方に少しでもお役にたてればいいな。。。と考えて、自身の開発で知識で得たノウハウ的なものを備忘録として残しておこうと思いました。
Javascriptって？
Javascriptは、いくつもあるプログラミング言語の一種で、Webページに様々な動きや機能を付加することができます。
JavaScriptはフロントエンド言語(クライアントサイド言語)の一種で、サーバーをとおすことなく、ブラウザだけでプログラミングを実行することが可能です。
Javascriptは、あらゆるWebページ、サイトで使用されていますが、他の言語と比較してセキュリティ面で甘いと指摘されています。理由としては、HTML、CSSのソースコードと同様に、Javascriptのソースコードもブラウザ機能を使用して閲覧できてしまう点にあります。
Javascriptの強み
サーバーで処理する場合、ユーザーが送信ボタンをクリックして、サーバーがそのデータを受け取ります。そしてサーバーがプログラムによって判別してエラーをブラウザに返す、といった一連の処理が発生してタイムラグが発生します。
Javascriptの場合、フロントエンド側で処理を行うので、フィードバックが早いです。「即時性」がJavascriptｍｐ強みと思います。
Javascriptの記述方法
Javascriptの読み込み方法や記述場所について、説明します。
Javascriptは、書いたソースコードをそのまま読み込んで動作する「インタプリタ型言語」です。
ちなみに、C言語のようにコンパイルして動作する言語は「コンパイラ型言語」といいます。
インラインで記述する場合は、scriptタグの中に記述します。
<script>
// この部分にJavascriptの処理を書きます。
</script>
外部ファイルで読み込む場合は、scriptタグにsrc属性をつけてその値にファイルパスを記述します。
例えば、test.js というファイルを読み込む場合、以下のように書きます。
<script src=" test.js "></script>
記述場所は、HTML内のどこに記述してもよいことになっています。以下場所が主な場所になります。
- 「head」要素の中
- 「body」要素の中
- 「body」タグの閉じタグの直前
場合によっては、ページを読み込ませる前にJavascriptを読み込ませる必要があります。
Javascriptの変数や演算子
他のプログラミング言語と同様に、変数や演算子などを使用することができます。
変数とは、データの出し入れすることができる箱のようなものです。Javascriptでは変数を使用する場合は、事前に変数宣言が必要です。
変数 a を定義します。
var a;
複数同時に宣言したり、代入しながら宣言できます。
変数a 、 b、 str を宣言して、それぞれに1、２、文字列test を代入
var a = 1, b = 2 , str = 'test';
変数名は、予約語 (if , for , class , var など）以外であればどのようにでも付けられます。
データ型の宣言（整数型、日付型、文字列型など）は、必要ありません。
演算子は、足す＋、引くー、掛ける＊、割る／、余り%といった演算子、以上＞＝、等しい＝＝といった比較演算子、AND＆＆、NOT！といった論理演算子が利用できます。
Javascriptの関数
他の言語と同様に、関数を使うことができます。
関数とは、入り口と出口のある機械のような動きをするものです。
例）数字に１を足すという関数 （add1)
function add1(x) {
var y = x + 1 ;
return ｙ ;
}
function と 半角スペースに続き、関数名を付けます。関数名の横にある(x) は、関数の入り口でここに関数用の変数を宣言します。
これを引数といいます。引数は複数宣言ができます。
また、関数の始まりは｛、終わりは ｝で囲います。
return は、値を返すためのもので、例では、ｘ＋１した値＝ｙを返すという関数になります。
もっと詳しく学習したい。。。という方へ おすすめ学習書
自身もJavascriptを学習するあたり利用したおすすめの学習書を掲載します。
「広告」
 | 1冊ですべて身につくJavaScript入門講座 [ Mana ] 価格:2794円 |
 | 価格:3520円 |
 | 確かな力が身につくJavaScript「超」入門 第2版 [ 狩野 祐東 ] 価格:2728円 |
 | いちばんやさしいJavaScriptの教本第2版 ECMAScript 2017（ES8）対応 人気 [ 岩田宇史 ] 価格:2420円 |
「広告」
しっかりと講師から学びたい方は、自宅でも現役エンジニアから学べる「テックアカデミー」がおすすめです。
Javascriptの説明と基本的な使い方について、まとめてみました。
Javascriptをこれから学習したい、学習している方のお力に少しでもなれれば幸いです。
以下 ↓ サイト も参考になればと思います。