質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

5回答

2351閲覧

変数を単一のアルファベットで命名することは正しいか

miyoshi_work

総合スコア69

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2017/09/27 04:36

編集2017/09/27 07:28

お世話になっています。

単一アルファベットでの変数の命名方法は正しいのでしょうか?
自分は、何をしているかわかるような英単語で命名するのですが、皆様のご意見いただきたいです。


とある外注より上がってきたjsファイルを改修しているのですが、
改修するjs全ての変数の命名法が単一のアルファベット(+ a)という書き方です。(例: a , b , c , d, aa , ba ,ca … )

文で例として挙げると下記の感じです。
処理、クラス名等はごまかしてますが変数名は変更せずこんな書き方です。

javascript

1var a = function (a, b) { 2 3var c, d, e, f g, h, i, j, k, l, m, n, o = this, 4ca = '.hoge', 5da = '.hogehoge', 6e = '.hogge + ' + ca 7}, 8A = function (a, c, d) { 9 処理 10} 11B = function () { 12 処理 13} 14C(c).click(function(event) { 15 B() 16} 17

こういった組み方をしていたため、
別の部分で i でeach文を回そうとしたところ、
i がすでにべつの処理で使われていたためにエラーが起きました。

また、js内にGoogle Analyticsのタグを埋め込んだところ、
gaという変数が使われていたためエラーになりました。


↑のような事案が何度か発生しているし、
何をしているかわかるような命名方法に変えて欲しいといったように頼んだところ、
この方がファイルも軽くなるしスマートだ、変えるつもりはないとの意見でした。

確かに、何度も同じ変数を使用する、コードも長いjsなので、ぱっと見綺麗です。
しかし単一アルファベットなため検索も難しく、読み解くのにかなり時間がかかります…

ただ、この単一アルファベットでの変数のつけ方ですが、
外注のjsだけでなくどこかのjsプラグインだったり拾い物のファイルでも何度か確認しました。

単一アルファベットでの変数の命名方法は正しいのでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答5

0

ほぼ全てに渡ってそのような変数名を付けているコードは、おそらく人間が直接書いたものではありません

ふつうの変数名で書いたコードを、UglifyJSClosure Compilerなどのツールを使って、変数名を短縮するなどする、といった最適化手法が存在します。

手をいれるのであれば、圧縮前の元のコードを編集するのが適切です。

投稿2017/09/27 04:47

maisumakun

総合スコア145183

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyoshi_work

2017/09/27 06:31

そんな最適化手法があったのですね!知りませんでした。 ただ今回の件は外注にも確認したところ自分で作ったものとのことでしたのでこちらは使用してなさそうです。 勉強になりました。ありがとうございます
maisumakun

2017/09/27 13:15

今回の件のは別だったみたいですが、「どこかのjsプラグインだったり拾い物のファイル」で短い変数になっているのは、ほとんどが自動圧縮によるものです。
guest

0

ベストアンサー

短い変数名を使うこと

まず、「正しい」「間違っている」の二面性で考えるのは止めましょう。
「正しさ」を解釈するには考えるべき要素が複数あり、「不変的な正しさ」というものは存在しません。
長所と短所をリストアップし、総合的に判断するようにしてみて下さい。
そして、重要なのは「~が正しい」の結論ではなく、その理由(長所/短所)です

長所短所
タイプ数が短い、サイズが小さい可読性が低い、保守性が低い

「サイズが小さい」は圧縮ツールを使えば、同様の事が可能な為、この書き方を好む人は次のような人です。

  • 出来るだけ短いタイプ数で気持ちよくコーディングをしたい人
  • 書いたコードを保守する場面を考慮しない人
  • 自分がコードを分かれば良い人(他人がコードを読む配慮がない)

端的にいって、ショートコーダーが好む書き方ですね。
(初めは「実は、質問文のコードは圧縮ツールで圧縮されているのでは」と考えましたが、ツールで圧縮した場合は ca, ga 等の二文字の変数名が残る理由がないので、人間が書いているコードだと思いました。)

変数名の競合

別の部分で i でeach文を回そうとしたところ、
i がすでにべつの処理で使われていたためにエラーが起きました。

これは別の問題です。
スコープが正しく分割されていれば、別スコープ上にある変数 i と同じ変数名で変数宣言しても、別の変数 i として扱われるので、何の問題もないはずです。

JavaScript

1var i = 'foo'; 2 3jQuery.each([1,2,3], function (i) { console.log(i); }); // ここで使われる変数 i は上位スコープの変数 i とは別物なので影響を受けない

また、js内にGoogle Analyticsのタグを埋め込んだところ、
gaという変数が使われていたためエラーになりました。

js内にタグを埋め込むという事ですが、HTMLタグの文字列を jQuery#html で埋め込んでいるのでしょうか。
状況が良く分かりませんでした。
(html/css/jsの全てで文字列に対して「タグ」という名称を使う方がたまにいらっしゃいますが、用語は正しく使わないと正確に伝わらないと思います)

Re: mimoshi_work さん

投稿2017/09/27 06:03

編集2017/09/27 06:21
think49

総合スコア18162

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yambejp

2017/09/27 06:09

可読性が低いのが短所であれば裏返せば 難読性が高いというのは長所になるかもしれませんね 外注にやらせているなら少しでも納品物を難解にして 依頼主に自力で拡張させないようにしたいのかも
think49

2017/09/27 06:17

確かに、圧縮する事を「難読化」と称しているサイトがいくつかありますね。 ただ、納品物が難読化されているのはともかく、実際にコーディングする対象まで難読化されていると、工数が増えて費用がかかりますが…。(それが狙い?w)
miyoshi_work

2017/09/27 07:59 編集

ご回答ありがとうございます。 — >(初めは「実は、質問文のコードは圧縮ツールで圧縮されているのでは… コードを作った外注曰く、ツールでなく自分で名付けた変数だとのことです。(本当かはわかりかねますが…) > スコープが正しく分割されていれば、別スコープ上にある変数 i と同じ… これはその通りですよね… iの変数を変えたら動作したのでまた変数がダブってるせいか、と特に気に留めてませんでした。おそらく別のところで原因があったと思われます > js内にタグを埋め込むという事ですが、HTMLタグの文字列を jQuery#html で埋め込んでいるのでしょうか。 埋め込むという表現自体が正しくなかったです。 ``` $(c).click(function() { ga('send', 'pageview', location.pathname + ‘?hoge’); } ``` クリックされたらアナリティクスにデータを送信といったような 作業がやりたかった際に上記を打ち込んだところ、`ga`がすでに定義されているというようなエラーが出ました。(元の`ga`という変数名を変更して解決しました) — 外注が変数名を直すならば新たにお金を取ると言っていたので↑2つのコメントの狙いもありそうです。 改修するjsであると伝えたのですが… 主流であるというわけではなさそうだったので自分は今まで通りの組み方をしていこうと思います。 ありがとうございました。
think49

2017/09/27 13:39 編集

> 埋め込むという表現自体が正しくなかったです。 「埋め込む」はいいのですが、「タグ」が誤解を招いているように感じました。 そこに書かれているコードは「タグ」ではないです。 https://markezine.jp/article/detail/19187 > 元の`ga`という変数名を変更して解決しました それでもいいですが、Google Analytics側のグローバル変数を変更すると手間が少ないと思います。 コード上でグローバル変数を初期化しているようなので、コードを書きかえれば変更する事も可能です。 https://developers.google.com/analytics/devguides/collection/analyticsjs/?hl=ja > 外注が変数名を直すならば新たにお金を取ると言っていたので↑2つのコメントの狙いもありそうです。 保守を考えないスタイルが根付いている会社のようですね…。 コード量次第では、出来上がっているコードを修正するより、現在のコードは全て破棄して、一から作り直した方が早そうな気がしました。
miyoshi_work

2017/09/28 03:58

なるほど、弊社でこの作業をやる際は「gaタグを埋め込む」という言い方をしていたので非常に勉強になります!「トラッキングコード」ということで認識あってますかね? そしてグローバル変数変更できたのですね!知らなかったです。 外注については、今後ここを利用しないほうが良いというように上に持ちかけました。そもそも上がってくるのもそんな早い訳ではなかったですし…。
guest

0

ごめん、最初に一言突っ込ませて

とある外注より上がってきたjsファイルを改修しているのですが

お前がメンテするんかい!!
作った人がメンテするべきでしょ!明らかに間違ってるでしょ!


さて、質問者さんの立場としてアドバイスするよ。

複数人の作業者でプロジェクトを作るのであれば、
後から他人が触るようなコードの場合、保守性を考慮したコードでなければ納品物として認めない。
と言うふうな取り決めをするべきだろうね。

特に新規開発と保守するメンバーが違うなら、なおさら保守するメンバーを守るような取り決めをしておくべき。
まぁ、どっちに向きすぎても駄目だからバランスは重要だけどね。

この方がファイルも軽くなるしスマートだ、変えるつもりはないとの意見でした。
確かに、何度も同じ変数を使用する、コードも長いjsなので、ぱっと見綺麗です。

その意見は中途半端、それを今から証明しよう。

後からminifyやuglifyみたいなツールをかければ最小かつ難読化されたコードを誰でも何時でも簡単に変換出来る。
(Gulpのような登録さえしておけばワンコマンドで出来るようなタスクランナーツールもある)
本当にファイルサイズを気にするなら、まずは改行コードとインデント全部取り払って1行にまとめた方がいい。
手作業でそのレベルの最適化出来る?絶対無理だよ。

もし簡素な記述にこだわりたいなら、記述量が半分以下になるAltJSも検討すべき。
CoffeeScriptやLiveScriptといった言語が代表例だね。
素のJSでやってる限り、AltJSには絶対に敵わない、徹底できてない。

そして変数a, b, c...ab!?
状態変数はあればあるだけ思考の邪魔になるから、そんなに沢山用意するのは明らかにスマートじゃない。
LodashRamdaのような関数型プログラミング用のライブラリも併用してみたら?
不要な状態変数めっちゃ減るから慣れてくると思考の邪魔をされずにスイスイ読み書き出来るようになるよ。


まぁ、ツールを上手く使うっていうネタがあるよって話だね。
素のJSだけで頑張って変数名を省略したりするのは限界がある。
現に保守担当の質問者さんが被害を受けているわけだし、こういったアプローチで提案してみてはどうかな?

投稿2017/09/27 12:59

編集2017/09/27 13:56
miyabi-sun

総合スコア21158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

think49

2017/09/27 13:54

「保守はやりません」な契約になっていると、面倒そうですね(そんな契約があり得るのかは分かりませんが)。 > 手作業でそのレベルの最適化出来る?絶対無料だよ。 「絶対無理」で編集リクエストを送ります。無料でやったら、大変な事に…。
miyabi-sun

2017/09/27 13:57 編集

> 無料でやったら、大変な事に…。 しまった!修正しました!
miyoshi_work

2017/09/28 03:44 編集

ご回答ありがとうございます! > 作った人がメンテするべきでしょ!明らかに間違ってるでしょ! あまり身バレしないように伏せつつだったので後出しで恐縮ですが… 外注に頼んだ時点で、案件の依頼元がやりたい事が増えそうとのことだったので、新規で増えた事に関しては弊社でやります。現段階で決まっている仕様を満たしたものを作成してください。 といった契約を外注としたそうです。 そのやりたい事が増えたので、js触ろうとしたところこのような仕上がりでした。外注側は保守はやりません、てなことになってるかもですね…確認します… >後から他人が触るようなコードの場合、保守性を考慮したコードでなければ納品物として認めない。と言うふうな取り決めをするべきだろうね。 まさにこれですね —— たくさんの参考サイトありがとうございます! 圧縮ツールにもたくさんあるんですね…uglifyくらいしか使用したことがありませんでした。勉強になります。
guest

0

正しいのでしょうか?

選択肢が真か偽しかないなら、回答は「正しい」です。
なぜなら予約語と競合するなど発生しておらず
文法上間違ったことをしているわけではないからです。

もちろん適正かどうかという意味では「適正ではありません」

投稿2017/09/27 05:21

編集2017/09/27 05:23
yambejp

総合スコア114777

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyoshi_work

2017/09/27 06:44

正解かどうか?という質問は間違っていたかもしれません。 確かにエラーは出てないですし間違いじゃないですよね これが主流であるだとか、良いものという回答が多ければ、 早いうちから自分もこの命名の仕方を練習していかねばーと思いたっての質問でした。 ご回答ありがとうございました。
guest

0

何度も同じ変数を使用する、コードも長いjs

変数名の長さよりも、同じスコープで使いまわしてるなら、こっちのほうが地獄だと思います。
たとえ別のスコープでも、「変数の巻上げ」があるjavascriptで外のスコープと同じ名前の1文字変数とか、うっかりvarを書いた|忘れただけでうんざりすることになるはず。バグを作るためにやってるとしか思えません。



はるか昔のプログラミング言語は、変数名が比較的短い長さに制限されていたので、2文字ぐらいの変数名が当たり前でした。長い変数名はむしろバグの元になることも。
おそらく、その時代の人なのでしょう。

投稿2017/09/27 13:21

Lhankor_Mhy

総合スコア36074

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyoshi_work

2017/09/28 03:28

そうですね既にうんざりしてます… 読めない保守できないかと言われるとそうでもないんですが… そういえば試験勉強の時に見た昔の例文なんかは1文字とかだったような気がしてきました(うろ覚えですが) ご回答ありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問