フロントエンドを極めよう【JS PRIMARYから学ぶ!】
こんにちは、うったむです。
JavaScriptはフロントサイドもバックサイドもどちらもできる言語ですね。幅広くいろいろと作れることから、学ぶことにキリがありません。
だから毎週、JS PRIMERという名書を読みながら、気になったこと、使いたいことをnoteでまとめていくことにしました。どうぞ、みなさんも一緒に読みましょう!
第一章:基本文法を学ぼう
JavaScriptって何?
JavaScriptを学ぶにあたり、ECMAScriptというものを理解しておかないといけません。ECMAScriptとは何でしょうか?
簡単にいうと「共通の部分」です。
読み方はエクスマスクリプトと言います。JavaScriptと同義語として最初は覚えてきましょう。もちろん詳細がありますが。仕様の一つで、どの実行環境でも共通な動作のみが定義されているものです。どの実行環境でも同じ動作をすることがポイントです。
またオブジェクト(何かを一つにまとめたもの)が理解できると、JavaScriptがよりわかるようになります。
下記のポイントを覚えておくことも良いですね。
・大文字と小文字は区別される
・予約語
・セミコロンで文を区切る
・ScriptとModule
うーん、最初ですが難しい点がたくさんありますね。しかもJavaScriptもECMAScriptどちらも更新されたり新しい構文や機能が付けられるので、学ぶことがたくさん。覚えようとするのではなく「ふーん、こんなこともできるんだ」という見方を持ちましょう。また「こんな機能の実装がしたいな」と思ってから知らなかった構文を使うということで良いですね。
ぜひ、最初で躓かないで頑張りましょう!(執筆2020年11月14日)
コメントを使おう
特に目立ったことがありませんが、「コメントを使おう」ということが載せられていうました。
● 一行コメント
● 複数行コメント
上記の二つがありますね。
ところでコメントはなぜ使うのでしょうか?
「ソースコードに書かれていることの説明」であるコメントは、ソースコードをメンテナンス(保守)する人に情報を伝えるものです。自分も含めて将来多くの人がコードを読んですぐに理解できるようにするものですね。
ですから、コメントとして「ここにはどのようなことが書いてあるのか」また「なぜこのようなコードを書いたか」を記述すれば、後日読んでもわかりやすいですね。
ぜひ皆さん、コメントを活用しましょうね!(執筆2020年11月22日)
変数とその宣言を理解しよう
変数とは、データを保存しておくための箱のようなものですね。
変数を使わずとも、コードを書いて開発することはできますが、ごちゃごちゃして見にくいです。整理して書こうとしてもコードが長くなりますし、他の人が見たら、何が書いてあるのか理解しづらいです。
そんなことを解決するために「変数」を利用します。
文字列や数値などのデータに名前をつけて箱のように保存すれば、後に同じことをしたいと思ったら変数(箱)を再度使えば良いので、大変スッキリしたコードになります。
変数は複数を同時に宣言をすることもできます。
宣言する方法は以下の三つあります。
・const
・let
・var
constは再代入と再定義ができない変数を宣言する時に使います。定数ではありません。 再代入しようとするとエラーが起きます。再代入はバグを引き起こす原因となりかねないので、constを使って変数を宣言することは良いですね。
const kitchen = "包丁";
const kitchen = "まな板";
kitchen = "フライパン";
// 再代入も再定義もできない
逆にletで宣言した変数は何度でも再代入できます。しかし再定義はできません。
let kitchen = "鍋";
let kitchen = "お玉";
// 再定義はダメ
let kitchen = "フォーク";
= "スプーン";
// 再代入はok
varは再定義も再代入もエラーが出ずに開発ができます。
結論から言うと、「可能な限りconstを使って、お手上げの時にはletを使う。varは出来る限り使わない」です。ある方は「varを使ったら負け」とおっしゃっていました...
コードは厳密な方がバグが起きにくく、見やすくなります。だからconstを使うことが勧められているのですね。
ぜひあなたも書籍から学んでアウトプットしてみましょう。(執筆2020年11月29日)
この記事が気に入ったらサポートをしてみませんか?