JavaScriptでテキストを整形するコードを書く

はじめに

テスト用のJSON形式のデータを作成・確認する時に、お世話になっているエディタのマクロやVisual Studio Codeのフォーマット機能みたいにちょっとしたサンプルデータを整形したい時ってありますよね。今回はJavaScriptでテキストを整形するコードを書いてみました。

このコードでできること

もうすぐクリスマスということでテキストをクリスマスツリー形式に整形します。
こんな感じです

f:id:garusan:20181130145222p:plain
クリスマスツリー形式

材料はこちら

コードはこちら

github.com

整形の時に意識すること

  • 適切なインデント
  • 全角と半角の表示幅の違い
  • 文字コード
  • 神経質にならない

全角と半角について

単純に文字数をカウントすると全角と半角で表示幅が違うのでツリーが残念なことになってしまいます。

f:id:garusan:20181130151917p:plain
残念なツリー
そのため今回は文字数ではなく、文字幅を取得する関数を作ってみました。
それがこちら

//文字幅のカウント
var widthcount = function (str) {
    var len = 0;
    var ch = "";
    for (var i = 0; i < str.length; i++) {
      ch = str.substring(i, i + 1);
      if (ch.match(/^[\u2700-\uff65]+$/)) {
          len += 2;
      }
      else {
          len += 1;
      }
    }
    return len;
}

文字幅はフォントによって違いますが、ここは潔く全角=2byte分、それ以外は1byte分としてます。

ちなみに文字列のバイト数をカウントするためにnode.jsのBuffer.byteLengthでasciiを使ってみたら数を控えめに申告してきます。何ででしょうね。

var countU = Buffer.byteLength('あいうえお','utf8');
var countA = Buffer.byteLength('あいうえお','ascii');
console.log(countU);//15 ←わかる
console.log(countA);//5  ←10じゃないの?

結果

15
5

おわりに

文字列を扱う時に、毎回環境や文字コードの違いに悩まされますね。
今回のコードは利用機会がかなり限られますが、これからも便利になるコードを書いていきたいと思います。