【無料講座】初心者向けWebエンジニア養成講座はこちら

JavaScript基礎文法編

リンクが無い学習コンテンツに関しては「Front Hacks」にて公開しております^^

「約350本以上の解説動画(エクササイズの解説動画含む)」「スライド解説」「質問無制限」という内容で学習サポートをしております^^
(学習コンテンツは今後も随時追加予定)

JavaScriptの実行方法

JavaScriptの実行方法に関しては文法とは直接の関係はありませんが、JavaScriptの文法の学習をする上で必須の知識となるので、まずはこちらでJavaScriptの実行方法を覚えておきましょう。

  1. デベロッパーツールでJavaScriptを直接実行する方法
  2. JavaScriptとHTMLを連携させてJSを実行する方法

プリミティブ型と変数

  1. JavaScriptのプリミティブ型とは
  2. JavaScriptの変数を覚える
  3. JavaScriptで値を確認する方法(デバッグ方法)
  4. 【エクササイズ】プリミティブ型・変数・デバッグ方法を復習

コントロールフロー

  1. JavaScriptでBooleanを取得する3つの方法
  2. JavaScriptでif-elseを使った条件分岐
  3. 【エクササイズ】入力内容に応じてalertメッセージを切り替える
  4. JavaScriptでループ処理をする【Whileループ】
  5. 【エクササイズ】Whileループの演習課題
  6. JavaScriptでループ処理をする【forループ】
  7. 【エクササイズ】forループの演習課題

関数(Function)

  1. JavaScriptでの関数宣言の書き方
  2. JavaScriptの関数を変数に代入する【関数式】
  3. JavaScriptのアロー関数を覚える
  4. JavaScriptの引数の使い方
  5. 関数の戻り値(返り値)とは
  6. 【エクササイズ】JavaScriptで3つの関数を作る
  7. JavaScriptの変数のスコープを理解する
  8. JavaScriptのコールバック関数と高階関数を理解する
  9. JavaScriptの即時関数を理解する
  10. 【エクササイズ】JavaScriptのスコープ・高階関数・即時関数の理解度チェック

配列(Array)

  1. 【JavaScript】配列とは
  2. JavaScriptでの配列の作り方
  3. JavaScriptでの多次元配列の作り方
  4. JavaScriptの配列の組み込みメソッドを使ってみる
  5. 【エクササイズ】JavaScriptの配列の理解度チェック
  6. JavaScriptの配列でイテレーション処理をする
  7. 【エクササイズ】JavaScriptで簡易Todoアプリを作る
  8. 【エクササイズ】JavaScriptのイテレーションメソッドを関数として自作する
  9. JavaScriptの配列で参照を理解する【オブジェクト型の動き】
  10. 【エクササイズ】JavaScriptの配列を引数にした関数を作る【参照の理解度チェック】

オブジェクト(Object)

  1. 【JavaScript】オブジェクトとは【入門】
  2. 【JavaScript】オブジェクトの作成方法【2通りの作り方】
  3. 【JavaScript】オブジェクトの値を取得・追加・削除する
  4. 【エクササイズ】JavaScriptのオブジェクトで猫を作る
  5. 【JavaScript】オブジェクトと配列を入れ子にする
  6. 【エクササイズ】JavaScriptの配列とオブジェクトでタイムラインを作る
  7. JavaScriptのオブジェクトを使ってメソッドを作成する
  8. 【JavaScript】オブジェクトのthis【アロー関数に注意】
  9. 【エクササイズ】JavaScriptのthisとメソッドを使ってイテレーションメソッドを自作する

classを使ったオブジェクト指向プログラミング

クラスを使ったオブジェクト指向プログラミングを学習しなくても、「【学習コンテンツ】JavaScriptフロントエンド編」の学習に進むことも出来ます。

オブジェクト指向プログラミングはJavaScriptに限らず、大きめのWebサービスやアプリを作る際に便利な概念(機能)となるので、必要に応じてこちらの「オブジェクト指向プログラミング」を参考に「オブジェクト指向とは何か？」について学習していただけたらと思います。

  1. オブジェクト指向とは
  2. 【オブジェクト指向】クラスとインスタンスの概念・関係を理解する
  3. 【JavaScript】クラスとインスタンスを作成する
  4. 【エクササイズ】JavaScriptで人間クラスを作成する
  5. 【JavaScript】インスタンスメソッドを定義する
  6. 【エクササイズ】キッチンタイマーをクラスで作る【JavaScript】
  7. 【JavaScript】クラスメソッドを定義する
  8. 【エクササイズ】クイズデータを取得するクラスメソッドを実装する【JavaScript】
  9. 【JavaScript】クラスの継承 ~extendsを使う~
  10. 【JavaScript】superを使う ~クラス継承の1機能~
  11. 【エクササイズ】クラスの継承とsuperの理解度をチェックする【JavaScript】
【3つの特典付き】Webエンジニアに必要な基礎スキルを体系的に効率良く身につけたいですか？

LINE登録で無料特典を受け取る

次のような方向けに、学習をサポートするコンテンツを無料プレゼントしています。

  • Webエンジニアになりたいけど何から学習を始めれば良いかわからない
  • 今まで独学で頑張ってきたけど、独学に限界を感じてきた
  • プログラミングは出来るけど、大きめのコードが書けない

「プレゼント詳細が知りたい」「プレゼントを受け取りたい」といった方は、以下のボタンをクリックして詳細ページをご確認ください。

無料特典を受け取る