概要
エッセイ・ポエムです。1年間必死にJavaScriptを勉強して特に理解しづらかったことを絞りに絞って3つにまとめました
スペック
- プログラミング初心者
- 用途LPのコーディング
- フレームワークjQuery
- 独学
初心者がプログラミングを勉強するときどんな箇所に苦しむのかを楽しんでいただく記録しておくのが主な目的。
ちなみに、各苦しみに対するインテリジェンスな解決法はサポート外です。
- 技術書を読む（理解できなくても読み進めないといけないので辛い作業。頑張ろう！）
- 他人のコードを読む（時間をかけていい作業。謎構文が頻出するので都度調べる。）
- コードを書いてみる（最初は写経でいい。何回か書いているとインプットした知識と知識がつながり合っていく感覚を味わえるはず。）
という力技で苦しみながら覚えました。
つまづいたこと3選
1. 関数？変数？？引数？定数？？？
JavaScriptの文法を勉強していたときに一番パニくっていた箇所。
初心者からみるとみんな同じような言葉に見えるんです。
僕みたいな低スペ初心者に教えるときは、図解で教えてあげてください。
独学者の人は鉛筆とノートを持って丁寧に理解しながら勉強すると覚えやすいですよ。
ES5とES6の書き方の違い
今のJavaScriptを初言語として学ぶのはプログラミング初心者にとってはちときつい理由。Google先生で調べたときに情報が混在しているのでとても困る。初心者は情報の取捨選択ができない。
（引数のことずっとインスウって呼んでて赤面したのは僕だけじゃないはず）
2. 返り値？戻り値？
関数とは、コンピュータプログラム上で定義されるサブルーチンの一種で、数学の関数のように与えられた値（引数）を元に何らかの計算や処理を行い、結果を呼び出し元に返すもののこと。
関数（ファンクション）とは - IT用語辞典 e-Words
返すって何？戻す？返す？（＾＾ω＾＾）？？ってパニくる。
function add (x, y) {
var result = (x + y)
return result
}
add(1,2) // 3
なるほど、なるほど1と2を受け取ってreturnで計算結果を返してるんだな。φ(｀д´)ﾒﾓﾒﾓ...
function helloWolrd () {
console.log('Hello World!')
}
helloWolrd() // Hello World!
// undefined
？！？！returnしてないけど文字返ってるんじゃないの？コレ？！しかもundefinedって何？！しかも、値何も受け取ってない？！？となるわけです。もうテンパりまくり、次に説明されることなんて頭に入ってきません。
3. 関数の呼び出し
初心者の頭というのはプログラムの実行順序を基本的に追いきれません。なぜなら理解に必要な知識がまだないからです。
最初は形から覚えろという言葉通り、とりあえず真似しながら書いていくと思います。
そこでパニクリ案件へと化すのが関数の呼び出し方、指定の仕方です。
function helloWorld () {
console.log('Hello world!')
}
helloWolrd() // Hello World!
// undefined
関数を書いたぞ・・・！唸れhelloWorld・・！helloWorld()！！！とカッコをつけて関数を使うのです。
そう、初心者は関数は使うときは関数名のお尻にカッコをつけるのだ。と覚えました。しかし、、、
function helloWorld () {
console.log('Hello world!')
}
$('#button').on('click', helloWorld())
ボタンをクリックしても何も起きません。。。
なんということでしょう。リファレンスで言われた通り関数を指定したのに何も起こらないじゃないですかー！
ボタンにクリックイベントを追加したいのでしょうが、コレでは動きませんね。
初心者はなんとか見様見真似でカッコを外すことで実行できるようになりましたが理解までは及んでいません。
おわりに
関数はとてもパワフルで面白い機能ですが理解するのって結構難しいんですね。私もまだまだ理解できてません。一応保険をかけておくと、これはポンコツ初心者の私がわからなかったことなのでご承知おきください。
Googleで検索したときに出てくるSEOつよつよサイトが一番勉強の邪魔になったりする。と思ったり・・w
一緒に勉強頑張りましょう！
Follow me!!