コーディングは知見を共有!デザインは勉強中のブログです!

JavaScriptプログラミング学習初期に引っかかっていたたった一つの事

JavaScript/jQueryの学習初期に引っかかっていたたった一つの事

今回はシンプルな記事です。
ただこれをしっかりと理解する前にjsの学習をしていた際、全然頭に入らず難しかったことを覚えています。

いまでもこれを指摘してくれた方には感謝しています。

単純で当たり前のことなんですけど初学時にはこれをしっかり頭に叩き込めないのです。
なので関数関連以降の学習でその先の学習に苦労します。

それはなにかを下記トピックで記載していきます。

関数はfunction(引数){~~return}までセット

いきなりですがjs初学者の皆さんは関数をしっかり理解していますか?

僕は曖昧なままjQueryの学習を始め、肝心な部分の理解力が足りていなく、その後の学習がさっぱり頭に入らなかったのを覚えています。

よくプログラミングの学習は「6,7割程度理解すれば先に進み、完全に理解しなくても良い」という言葉を聞きます。

これはあながち嘘ではないと思います。
そのときにしっかり理解できなくても、巡り巡って理解につながることも実体験としてあるので一つの事実です。
しかし僕の経験上この理解を差し置いて先に進めないものがあります。

それが「関数」です。

関数

数学が得意な人は馴染みがあるかもしれませんが、関数はプログラミングでは避けて通れないものであり、何をするにしても関数を作ってどうのこうにしていくといったことに尽きる部分があります。

ただ関数って学習過程でそんなにじっくりやらなくないですか?
なんとなくの形を学んであとは実習みたいな感じだと思います。

でも僕はこの過程をそのまま踏んだことで困ったことになりました…
何をするにしてもわけがわからないことが続くのです。
できたりできなかったり、できるはずのことにつまずき、そもそも関数の書き方が間違っている等のミスが多発しました。

その際言われたのが。

「あざみさんは関数ってどういうもの(形)なのかしっかり理解していますか?」

という言葉でした。
その時の僕は…

「えっfunction云々〜〜〜ってやつじゃないんですか?」
くらいの答えをしていたと思います。

その時に教えていただいたことです。
プログラミングを生業としている方からすれば当たり前かもしれません。今学習されてる方からしても当たり前のことかもしれません。しかし僕と同じようなしっくりこない状況で学習されている方の一助になればと記載しておきます。

それは…

関数
function(引数, 引数2, 引数3){
  return 戻り値;
}

これが基本の形だということです。

全てにおいて関数はこの形が基本だということ。
もう少し深掘りしますと

関数
kansu = function(hoge, fuga, aqua){
  return 'azamiaqua';
}

すべて文字列で引数1にhoge、引数2にfuga、引数3にaqua、returnに「azamiaqua」
さて上記の関数を実行した場合どうなりますか?

もうちょっと言えばなにが返ってきますか?

と質問され、しどろもどろになった記憶があります。
そう。僕は関数というものをちゃんと理解していませんでした。

答えはazamiaquaが返ってきます。
そう、途中経過で何があろうと引数になにが設定されていようと関係ありません。
関数はreturnでの戻り値を返します。
そしてもう一度いいますが引数に何が設定されていようと関係ないということです。

これが当時の僕には衝撃的で、かつとてもガッテンした!記憶があります。

引数ってあるからには何か使ったり意味があると思うじゃないですか。
実際は意味がなければ置かないと思いますが、特に使わなくてもいい場合があるなんて思わなかったのです。

さらに言えば実際の関数は必ずしもreturnがあるとは限りませんが、学習のベースとして上記の理解はようやく足が地についたような…たしかな手応えがありました。

関数
kansu = function(hoge, fuga, aqua){
  console.log(hoge);
  return 'azamiaqua';
}

と、途中でどんな処理が挟まれようがazamiaquaを返します。

これを踏まえて学習するとみるみる理解力が高まったので
関数の理解に躓いている方は参考にしてみてください。