title
Design

Javascript修行

こんにちは!新人森田です。
エイプリルフールというイベントもありつつ、今日からいよいよ新年度ですね。
今年度はがっつり活躍するのが私の目標です。
その為にも修行あるのみ!

コーディングの修行をいくつかやったところで、Javascript(以下js)の勉強を再開しました。
というのも、流行っている内に一度はパララックス作ってみたいんです。
いまだに私のjsコードは師匠からのアドバイス9割で出来ているので、少なくとも今の自分のhtmlやcssの知識くらいに、試行錯誤しながら作っていけるレベルにはなりたいところ。

師匠に色々教わった中でも、今回は基礎中の基礎である“jsを書く時の注意点”をまとめてみます。
これを絶対守らなければだめだという訳ではなく、こういったことに気をつけると見やすいコードになるよという目印ですね。
ブログが練習ノートみたいになってますすいません。

Javascriptを書く時の注意点

コーテーション

0401_01

htmlでは<div class=“”>のようにダブルコーテーションを使うのが一般的ですが、たとえばRubyではダブルコーテーションには特別な意味があったりします。様々な言語に共通して使えるという面もあり、特別な理由がない限りはシングルコーテーションを使うと無難そうです。
ただし文字列の中にコーテーションが使われる場合はダブルコーテーションで囲います。例:“I’m …”

オブジェクト

0401_03_03

{}で囲われるオブジェクトは、中身が複雑化しがちなため括弧の内側にスペースをあけて見やすくします。
また、オブジェクト内に複数の要素が入る場合はカンマで区切ったあとにスペースをあけて次を記述します。

配列

0401_05

一方、[]で囲われる配列にはスペースを使わずに記述します。
複数の要素を書く場合はオブジェクトと同じです。

引数

ここではif文の引数という形で見てみます。
関数(function)の時も同じです。

0401_07

ifと()の間にはスペースをあけて、()と{}の間は続けて書くことが多いです。
引数、つまり()内はスペースをあけません

0401_09_09

ifの後にelse ifを書く場合、if(){…}に続いていることを明確にするため}の隣にスペースをあけて書き始めます。

また、条件定義する時に同じ項目を使う場合は左項にまとめたりすると見やすいです。
≦≧はそれぞれ“<=”、“>=”と書きます。

キャメルケースとスネークケース

0401_11

関数定義に使う名前はキャメルケース(上の行)、それ以外の定義ではアンダーバーでつなげるスネークケース(下の行)を使います。

0401_15

また、戻り値が真偽値の時は“is~”という形式でキャメルケースを使って名前を付けます。

計算式

0401_13

計算式を記述する場合は、数字と記号の間にスペースをあけて書きます。
このとき記号は、足す“+”、引く“-”、掛ける“*”、割る“/”を使います。
通常の数式と同じで掛け算割り算が優先して行われるので、足してから掛けたい場合は()でくくります。

まとめ

細かい部分ではありますが、細かい部分が疎かになっているとコードが膨大になった時に散々な目にあうかも知れません。
私が高校大学でやってきた弓道でも、どんなに的に当たっても型が疎かではいけませんでした。
出来る人っていうのはそういう部分からしっかりしてるから結果的に出来てるんじゃないかなと思ったり。

あとjsが思った以上に計算地獄で、もともとない数学の頭をフル稼働してしんどいです。
でも書いたものが稼働してるのを見るとそんなの吹っ飛んじゃうんですけどね!
早くコードがすっと頭に入ってくるようになりたいです。押忍!

標準