JavaScript tips - Number に times メソッドを追加して Ruby ライクに使えるようにしよう

phi phi on javascript

今回は, phina.js で実装している, コア機能拡張の一部を抜粋して紹介したいと思います.

Ruby にある times を, JavaScript で使えるようにする tips です.

times とは?

Ruby には, Integer クラスに times という便利な関数が標準で用意されています.

times は渡された関数を, 自身の数値回繰り返し実行することができるメソッドです. まぁようは, for 分の代わりにループ処理に使えるメソッドです.

Ruby だとこんな感じですかね.

5.times do |i|  
  print i, " "
end  
#=> 0 1 2 3 4

今回は, これを JavaScript で使えるようにする方法を紹介します.

慣れると for 文で書くよりも可読性も上がりますし, JavaScript の場合, 普通の for 文だとクロージャの罠にかかるリスクもあるので, できるだけ forEach や今回紹介する times でループを回すことをオススメします.

Runstant Demo

今回のサンプルです. times によるループ処理が行われて console に結果が出力されているのが分かるかと思います.

Define

Number.prototype.times の実装方法です. 今回下記のような形で定義しています.

Object.defineProperty(Number.prototype, 'times', {  
  value: function(fn, self) {
    self = self || this;
    for (var i=0; i<this; ++i) {
      fn.call(self, i);
    }
    return this;
  }
});

Object.definePropertyNumber.prototypetimes メソッドを追加しています.

こうすることであたかも Number クラスのメンバ関数のように 気持よく times を使うことが出来ます.

実装内容はシンプルで, for 文で自身の数値回ループして 渡された関数を実行しているだけです.

Usage

使い方ですはこんな感じです.

// times
var n = 3;  
n.times(function(i) {  
  console.log(i); // 0, 1, 2
});

括弧で囲めばそのまま数値に対して使うこともできます.

// times
(5).times(function(i) {
  console.log(i*2); // 0, 2, 4, 6, 8
});

便利ですよ♪