Coffeescriptから変換されるforが汚いので対処した話

Coffeescriptのfor文について

coffeescriptのfor文は例えば下記のように書きます。

for.coffee

for i in [0...10]
  console.log i

これを変換すると、下記の様になります。この時点で _i 無しでいいのに、と思います。

for.js

var i, _i;

for (i = _i = 0; _i < 10; i = ++_i) {
  console.log(i);
}

なんで _i が付くのか？？

どうもfor文のデフォルトのループ変数は_iのようだ(※ネストが深くったり、_iが使えない状況では、_j, _kとなっていく)。なので先ほどのfor文は下記の様に書ける。

for.coffee

for [0...10]
  console.log _i

変換すると、変数がひとつの綺麗なfor文になる。

for.js

var _i;

for (_i = 0; _i < 10; _i++) {
    console.log(_i);
}

綺麗になるが、変換してみないと そのループの変数が_iになるかはわからない ので、結局最初の方法を取らざるを得ない。

汚くなってしまう配列のループ

元々、Javascriptで下記の様に書いていたコード。

array.js

var arr=[0,1,2];

for(var i=0, len=arr.length; i<len; i++){
    console.log(arr[i]);
}

同じ感覚でcoffeescriptで書くと、

array.coffee

arr=[0,1,2]

for i in [0...arr.length]
  consolr.log arr[i]

これを変換すると恐ろしいコードになる。下記である。

array.js

var arr, i, _i, _ref;

arr = [0, 1, 2];

for (i = _i = 0, _ref = arr.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
    console.log(arr[i]);
}

_iが付いてしまうのは先程の例の通りだが、arr.lengthの符号を判別する術が無いためどちらでも動作するコードが生成された結果、上記のようなコードになってしまうのである。

綺麗な配列ループ

そもそも配列の場合、下記の様に書く。

array.coffee

arr=[0,1,2]

for x in arr
  consolr.log x

array.js

var arr, x, _i, _len;

arr = [0, 1, 2];

for (_i = 0, _len = arr.length; _i < _len; _i++) {
  x = arr[_i];
  console.log(x);
}

配列を逆から処理したい場合は、by -1を付ける。

array.coffee

arr=[0,1,2]

for x in arr by -1
  consolr.log x

array.js

var arr, x, _i;

arr = [0, 1, 2];

for (_i = arr.length - 1; _i >= 0; _i += -1) {
  x = arr[_i];
  consolr.log(x);
}

_i-- にならないのが気になる。情報求む。