31
20

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

想像以上に遅かったtoLocaleString

Last updated at Posted at 2017-07-15

数値を3桁区切りにする方法として、Number.prototype.toLocaleStringがありますが()、これにはいくつかの欠点があります。

  1. ロケールを明示しておかないと、思わぬ表記法になってしまう
  2. Safariが未対応
  3. 遅い

サイトのJavaScriptをプロファイリングしている際に偶然気づいたのですが、toLocaleStringで3桁区切りにするコードは、対応したどのブラウザでも、正規表現で同等なことを行うより、数十倍~ひどいときには1000倍の時間を要します。

  // 想像を絶して遅い
  function test1(val) {
    return (+val).toLocaleString('ja');
  }
  
  // 意外とこっちのほうが高速
  function test2(val) {
        var arr;
        arr = String(val).split('.');
        arr[0] = arr[0].replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,');
        return arr.join('.');
  }

jsPerfで測定してみたところ、ChromeやFirefoxで数倍から数十倍、IEに至っては1000倍の速度差で正規表現で書いたほうが速い、という結果になりました。

結論

toLocaleStringは、本当にロケールに合わせる時以外は不向き

31
20
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
31
20

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?