Progate WEB系転職 スキルアップ プログラミング ホームページ制作・WordPress

【勉強ノート】Progate⑤ JavaScript学習コースⅢ(有料コース)学習で、できる事、調べた事 まとめ

異業種からITエンジニア、ブロガー転換を目指す40歳おじさんの勉強ノート。

スキル書き溜めとして、簡潔まとめ。

レッスン内容

関数を学ぼう

関数とは(1)、(2)

アロー関数

引数とは

複数の引数を受け取る関数

戻り値とは

戻り値の活用

スコープ

総合演習

Progate JavaScript学習コースⅢ より

身につくスキル(これが出来る)

  • 関数の定義と実行
  • 引数と戻り値を用いた関数の扱い
  • スコープの理解(重要)

勉強になったこと

① アロー関数

  • function()を用いるよりコードをシンプルに書ける。
  • 関数は基本的にアロー関数で記述する。

② 戻り値

  • 数値以外にも真偽値を返すこともできる。
  • returnで戻り値を返すが、returnが実行されるその時点で関数内の処理が終了されることに注意。

③ 関数の中の定数:スコープ

  • 「関数の引数」や「関数内で定義した定数や変数」はその関数内でしか扱えない。
  • それぞれの定数や変数が使用できる範囲のことをスコープという。
  • 関数外で定義した定数や変数は関数の中でも外でも扱える

レッスン文法:これだけ覚えよう

① 関数の定義

文末の中括弧に「 ; 」の付け忘れ注意

// 関数の定義
const introduce = functin() {
	console.log("こんにちは");
	console.log("今日も楽しく勉強しましょう");
};
// 関数の呼び出し
introduce();

② アロー関数による関数の定義

function()の記述が不要で、コードをシンプルに書ける。

// functionを用いるよりシンプルに書ける
const introduce = () => {
	console.log("こんにちは");
	console.log("今日も楽しく勉強しましょう");
};

③ 引数の使い方

// 引数の使い方
const introduction = (program) => {
	console.log(`今日は&{program}を勉強しましょう`);
};
console.log("Java");

// 複数の引数を受け取る場合(引数をコンマで区切る)
 const 定数名 = (引数1,引数2,・・・) => {
	// 処理
};

// 例文
 const add = (num1,num2) => {
	console.log(num1+num2);
 };
 add(10,8);

④ 戻り値の扱い方

「return」を使って戻り値を返す。

// 戻り値(returnを使う)
const add = (a,b) => {
	return a+b;
 };

const half = (number) => {
	return number/2;
};
const result = half(180);
console.log(`180の半分は${result}です`);

// if文のような条件式をreturnで返すと真偽値を返す
const check = ( number ) => {
	return number % 2 === 0;
};
console.log( check(6) );
console.log( check(7) );

// returnは関数の処理を終了させる
// 下記の場合、console.logは実行されない
 const add ( a, b ) {
	return a + b;
	console.log("計算しました");
};

勉強不足だと思ったこと、調べたこと

補足で調べたことは特になし。

引数や戻り値の扱いはエクセル関数を扱っているので感覚としては掴みやすかった。

スコープを意識した変数・定数の取り扱いが要注意だけど、逆にスコープを意識したら変数や定数を上手に扱えることがあるのか、今後の勉強でも注意してきたいところ。

-Progate, WEB系転職, スキルアップ, プログラミング, ホームページ制作・WordPress

© 2020 中堅サラリーマン・コツコツ頑張るブログ