師匠と私-Season1_ch.8☆ラクダの背中でJavaScript

ー前回までのあらすじー
kintoneプラグインをつくるプロジェクト
🐬イカル☆プラグイン
修行は続きます…。

ここで、ちょっと気になっていたことを聞いてみました。

いぜん師匠にコメントしてもらったところで
var searchButton = document.getElementById("btn");
という記述がありました。
師匠はsearchButtonという変数を作成しています。

変数名は”ｘ”でも”foo”でもなんでもいいはず。
（厳密には決まりはありますけど）好きな名前を付けられます。

意味を付けてる？
なぜ長い名前？
師匠に質問すると…。

「入力フィールドとか、例えばキャンセルボタンとか、いろんな変数が登場してもそれだとわかる名前を付けたほうが良いのじゃ。」

「あとJavaScriptの変数は「キャメルケース」でつけるのが慣習じゃぞ！
名前見ただけでボタンの要素なんだな、とか検索用のボタンなんだなとわかる名前が良いのじゃ。」

「もしかするとsearchButtonElementのほうがより良いかもしれぬ。
プログラムが長くなってくると変数に一体何が入ってるかわからなくなってくるのじゃよ。」

なるほど！
キャメルってらくだのこぶみたいに凸凹することですね。

なるほど！
短い方が間違えないのでは？って考えちゃいましたが、意味をもたせる詳細な名前をつけることで、長くなるけどその分なにをいってるのかわかりやすいってことですね！

「そのとおりじゃっ。
長い名前であっても、変数名の指定ミスはエディターで指摘してくれるし、最後まで打たなくてもサジェストしてくれるのじゃよ。
最終的にはちょっと長くても問題なくなるのじゃよ！」

わかりました！例えばこういうことですね。
おやつは
var oyatsuBulbonButtercookie = "ブルボンのバタークッキー"

「そうじゃ。そしてこうじゃ！」
oyatsuBourbonButterCookie

おお！ブルボンのスペルも直されている、さすがです！

「…スペルミスはわしが直したのじゃ！」

※余談ですがvarという変数宣言、ちょっと調べたらけっこう詰まってました💦いつかどこかでちゃんと読みたいと思います。

var - JavaScript | MDN

それから。
いろんな解説をみてるなかであることに気づきました。
変数宣言のときにvarって使ってない？
いくつか種類があるのはなんとなく聞いたことがあります。
師匠に質問してみました。

「constを使うのが今風じゃ！」

「変数の宣言方法に
- var
- let
- const
があるのじゃが、varは非推奨じゃ！ワシはletもあまり使いたくない。
constは変更されることが無いので安全なのじゃ！
小規模プログラムで問題が起こることはあまりないが、とりあえず let 使っておけば不便はないのじゃよ。」

const：書き換えダメ！一番偉い
let：しかたないから書き換えしたいときは使って
var ：いまどきダサイ💦
って感じでしょーか？

「…だいたいあってるぞ」

【JavaScript】var / let / const を本気で使い分けてみた - Qiita

ーvar/let/constを本気で使い分けてみたー
こちらの記事で、さらにわかりました。
「だいたいあってるぞ」の師匠のコメントを理解！

🐟JavaScript変数宣言のざっくりイメージ

var：何回でも言い直しOK
var 好きなのは = りんご
var 好きなのは = みかん　←みかんが好きなんですね🍊
｛｝外からでもわかる！

let：宣言は一回だけ
    let 好きなのは = りんご
✖ let 好きなのは = みかん←２回目はダメ
    好きなのは = みかん　←言い直しOK。みかんが好きなんですね🍊
｛おうちの中｝しかわからない！

const：宣言は一回だけ
　const 好きなのは = りんご
✖ const 好きなのは = みかん←２回目はダメ
✖ 好きなのは = みかん　←リンゴが好きって言いましたよね！🍎
｛おうちの中｝しかわからない！

「そしてなぜconstが推奨されるかというと、
最初に"りんご🍎"と定義したらその後どこかで勝手に書き換えされないから安心なのじゃ！
varだと、お家の外で書き換えられる可能性もあるので、そこに何が入ってるかわかりにくくなるのじゃよ！」

それにしてもさんざんvarを駆使してコーディングしてきたのに。
いままでツッコミなかったですよね。
「細かいことは後でいいのじゃよ！」
…そうでした。細かいことよりも手を動かしてとりあえず完成させる！が師匠流の教えでした。
ダサイと思われてた？ことだけがショックです💦

const - JavaScript | MDN

正規表現の話
前回Split関数を教えてもらったときに、正規表現という言葉がでてきました。
「おぬしにはまだ理解は難しいぞ」
そういわれると調べてみたくなります！
（師匠の作戦かも？）

正規表現 - JavaScript | MDN

(;ﾟДﾟ)　わからない～！💦
師匠から理解はむずかしいと言われてたから当然でしょうね。
マンガで解説しているものがありました。

マンガで分かる JavaScriptプログラミング講座

『正規表現』は、文字列の検索や置換を行うための、特殊なルールです。
いまのところの理解は、これで良しとします🍎

…ch.9へ続く