JavaScriptで、もう連想配列の最後のカンマに悩まない！(※追記あり)

2012/05/02

~~末尾に要素を増やしたい、または減らしたいときに問題が起こります~~
例えば" c : 3 "の行を~~単純に削除するとバグるので~~削除したいときに、" b: 2,"のカンマを削除する必要があります。
また、" d : 4 "を追加したいときに、" c : 3 "の後にカンマを入れる必要があります。
これは面倒くさいですね。

(エンバグについてはjslintなどのツールで防げばよいという指摘があったので修正しました。）

より良いやりかた

var x = {
 a : 1,
 b : 2, 
 c : 3,
 dummy : null
}

このように最後に "dummy : null" というダミーの要素を書いておきます。
こうすれば、プロパティa, b, cはどれもカンマ付きで平等になります。

ぜひ一度試してみてください。
(もしかして常識だったらすみません。あとこの手法は for in で走査したいときはよくないかもしれません。)

私のおすすめ

クラスのプロトタイプ定義でこのテクニックを使うのがおすすめです。

var MyClass = function(){  };

MyClass.prototype = {
 doFoo : function() {} ,
 doBar : function() {} ,
 doBuz : function() {} ,
 dummy : null
};

prototypeをfor in するのは継承のときぐらいで、" dummy : null "を継承しても問題にならないのではないでしょうか。

参考

連想配列の最後にカンマを入れてはいけない言語もある - すぎゃーんメモ

追記

はてぶでたくさんのご意見をいただきました。
反響の大きさにびっくりしています。
ご意見ありがとうございます！！

みんな普通にやってるテクニックかと思っていたら、「バッドノウハウだ」「気持ち悪い」という意見が結構あってびっくりしました。

以下、ご紹介します。

「lengthが変わってしまうじゃないか」

確かめてみましたが、連想配列にlengthは（自分で定義しない限りは）ないので問題ありません。

「気持ち悪い」

これは見た人がどう感じるかですね。
私はIEのためだけにカンマに配慮しなきゃいけないのが気持ち悪いと思いました。
宗教論争かもしれません。

「バッドノウハウである」

そうかもしれません。
しかし、IEのJS仕様がバッド仕様なので、毒をもって毒を制すのもありかなと思いました。

「前カンマの方がよい」

var x = {
  a : 1
 ,b : 2 
 ,c : 3
}

SQLでよくやる書き方ですね。
JSでこれをやるというのは斬新ですね。
「先頭の要素はめったに変わらないので問題ない」というのも同意です。

ありかもしれませんね。

「IE無視すればよい」

う、うらやましい・・・

「知らずに全部カンマつけてた」

そんな人もいるんですね。

「{ .., reserved :null}ならアリ」

"dummy"という名前じゃなければいいんですかね。

「これで納品されたら2度と頼まないと思うw」

すいませんでした。
そんなに悪いことだとは思ってませんでした。

Perlモジュールの最後に1;と書くぐらいの感覚でいました。

「たたかれてるのがおもろい信念貫いて変なプログラマーになるのが楽しみ」

ありがとうございます。

そんなに変ですかね・・・
普通に考えたらこうなっただけなんです。

「一瞬だけ良いなと思ったけど、すぐ辞めた。」

なんで辞めちゃったんでしょう・・？

「JSで慣れてしまって、Perlで最後の要素にカンマある方が違和感あった。今は使い分けてる。」

たしかPerlのリャマ本かアルパカ本で、「最後にカンマつけましょう」と書いてた気がします。

「ちなみにGo言語は最後のカンマが無いと逆にエラーになる素晴らしい言語です」

素晴らしい！！

「俺と同じ事を考えている人がいた。よかった、俺は一人じゃないんだ。」

おおー！

「ないわー」

ないですかねー。
ダメな理由をおしえてほしいです。

追記２

引用元のすぎゃーんさんが追加記事を書いてくださいました。

JavaScriptで、もう連想配列の最後のカンマに悩んでないので

~~Node.jsで~~ECMA Script 5で副作用が出る
書き手は楽だとしても読み手を混乱させる
エディタやツールでチェックすべき

わざわざありがとうございます。
なるほど。

追記３

サーバサイドJS ならむしろ「最後もカンマつける」にしてしまえばいいのにと思いました。
でもサーバサイドjsとクライアントサイドjsでスタイルが変わるからNGなんでしょうか。

追記４

ツイッターをみた感じでは、９９％ぐらいの人が { , dummy : null }については否定的でした。

「気持ち悪い」
「ない」
「ひどい」
「ひどすぎる」
「醜い」
「美しくない」
「IEは悪くない」
「不要なデータを入れるべきではない」

一日でこれだけ多くの人に批判されるというのは実に貴重な体験でした。
本当にありがとうございました。

「気持ち悪い」については、「主観」「宗教論争」と割り切ることもできますが、
「不要なデータを入れるべきではない」については反論の余地がなさそうです。

delete obj.dummy ;　で回避するというさらなるバッドノウハウを思いつきましたが、やめておきます。

追記５　アンケートにご協力お願いします。

結局「何がベストか」については意見が割れているように思いました。
はてな人力検索でアンケートを作成してみたので、もしよろしければご回答をお願いします。

JavaScriptの「連想配列の末尾カンマ」についてアンケート
（※べつに多数決で一つのスタイルに決めるべきと考えているわけではありません）

追記６

この問題について「ケツカンマ問題」という名前が誕生しました。
JavaScriptの「ケツカンマ問題」まとめ

追記７

記念にドメインとりました。　→　ケツカンマ.com

ご意見をTwitterで教えていただけると幸いです。
ハッシュタグは #ケツカンマ　です。

カテゴリ: JavaScript