【学習ログ】MDN JavaScriptチュートリアル - フロントエンド学習記(仮題)

はじめに

この記事は、学習ログの記念すべき第1回目の投稿です。

学習したもの

今回は、MDN にある JavaScript のチュートリアルを学習しました。

JavaScript の学習を始めた背景

まず、JavaScript の学習を始めた背景を説明したいと思います。

私は、将来フロントエンドエンジニアになる事を目標に、現在転職活動や学習をしています。静的なサイトをいくつか自力で（書籍やWebで情報を調べながらでも）作成できるようになった事で、HTML / CSS についての学習が一旦区切りがついた（初心者レベルに達した。たぶん。そうだといいな。）と考え、フロントエンドで利用する技術として重要であると思われる JavaScript の学習に「再挑戦」しようと思い立ちました。

再挑戦。つまり、以前にもJavaScriptの学習をしようとしていたことがあったのですが、残念ながら一度挫折してしまっていました。

以前、JavaScript について学習した時は、

ドットインストールの動画を見ながらコードをそのまま記述して、動かしてみることでおおよその雰囲気をつかむ
JavaScript の書籍を購入して、本格的に学習を進める

という順番で学習したものの、書籍の内容がその時点での自分のレベルにあっていなかった為、難しく感じた事と転職活動などが忙しくなった事で学習を続ける事が出来ずに一度挫折してしまいました。

その後、しばらくした頃、情報収集の為に twitter や Qiita を眺めていたところ MDN や js-primer といったWebサイトに良質なチュートリアルがある事を知り、自分の状況が落ち着いてきた事や HTML / CSS の学習に一区切りついた事もあり、もう一度挑戦してみようと考え JavaScript の学習を始めました。

MDN と js-primer どちらを先に学習しようか迷っていたところ、（たしか twitter で） MDN → js-primer の順番に学習すると良いとの意見を見かけたので、MDN から始める事にしました。（我ながら単純）

ブログ投稿前に学習済みの箇所

JavaScript の学習自体は、ブログ開設前から進めていたのでチュートリアルの途中からの記録になります。中途半端で申し訳ありません。

学習済みの箇所は下記になります。

チュートリアル内、「完全な初心者向け」コーナー
- JavaScript の第一歩（この中にも項目があるのですが冗長かと思われるので省略します）
- JavaScript の構成要素
  - コード内で決定を下す　条件
  - ループコード
  - 関数　再利用可能なコードブロック

今日学習した対象箇所へのリンク(ここから下が本題)

概要

チュートリアルで習った事の概要は下記の通りです。

1. 独自の関数を構築する

ボタンを押下するとページ内にメッセージカードを表示させることが出来る関数を作成する方法を学びました。

2. 関数の戻り値

入力欄に数値を入れると、入力された値を正方形や立方体の数、階乗した数値を返す事が出来る関数を作成する方法を学びました。

分かった事

シンプルなカスタム関数の書き方、関数を呼び出す時に引数で処理を分岐させる考え方、関数内に条件付きテストを入れる考え方が分かりました。

分からなかった事

チュートリアルに従って記載すればそれで動きましたし、解説が丁寧なのであまり分からないという感じはしませんでした。

たぶん、チュートリアルが秀逸で初心者にそう感じさせないように配慮されているのでしょう。作成者・協力者の方に感謝！

ただ、「関数の戻り値」で最後に平方根・立方根・円周率を求める関数を追加するよう記載があり、数学について結構忘れていたので「やばいかも、、、。」と感じました。

まとめ

今日は関数と関数の戻り値について、学習しました。ここまで学習してみて、MDN のチュートリアルは最初から基本や細かいところをみっちりやるのではなく、おおまかな感じで学習してから細部を詰める方針なのかなと感じました。

あと、以前から書籍やドキュメントを読んだときに薄々感じてはいたのですが、数学や英語のリーディングあたりの知識が自分には全然足りていないと再認識しました。今後の課題として、よく考えていきたいです。

最後までご覧頂きありがとうございました。これからもコツコツと学習を進めていきます！