Help us understand the problem. What is going on with this article?

正規表現を使った処理で、いい感じの場所に区切り文字を入れる

モチベ

繋がってしまった文字列でいい感じのところに区切り文字を入れたいことってありますよね(?)
自分の場合は繋がってしまった時間帯の表記を、1区間ごとにカンマで区切りたいなーっていうタイミングがありました。
処理前 13:00~15:0017:00~22:309:00~23:00
処理後 13:00~15:00,17:00~22:30,9:00~23:00

区切りたいところに特定の文字があれば、JSだったらreplace()とかsplit()を使って簡単に区切り文字を入れ替えたり、配列にしたりできます。

まず思いついた方法

今回の場合、上記なような考え方ができないため他の方法をとる必要がありました。
3つ以上数字が並んでいる場所の2文字目のあとに、カンマを入れるという感じでいけそうです。
最初に書いたコードがこちらです。

// timeDurations → "13:00~15:0017:00~22:309:00~23:00"
function formatTimeDurations(timeDurations) {
  let array = timeDurations.split(/[0-9]{3,4}/g)
  if(array.length < 2) return timeDurations

  let bridgeArray = timeDurations.match(/[0-9]{3,4}/g)
  let formatted = ""
  for(let i = 0; i < bridgeArray.length; ++i) {
    formatted += array[i]
    formatted += bridgeArray[i].substring(0,2) + ',' + bridgeArray[i].substring(2)
  }
  formatted += array[array.length-1]
  return formatted
}
// formatted → "13:00~15:00,17:00~22:30,9:00~23:00"

細かい説明は省きますが、先述したように3つ以上数字が並んでいる場所の2文字目のあとに、カンマを入れるという処理をしています。

正規表現をもっと上手に使った方法

上記の処理でも十分良かったのですが、正規表現についてさらに調べているとさらにいい方法があることに気がつきました。
正規表現を()で囲むとその正規表現に該当する文字列をグループ化して、変数のように再利用することができます。

function formatDurations(durations) {
  return durations.replace(/([0-9]{2})([0-9]+)/g, '$1,$2')
}

ここでは、数字が3つ以上連続しているところから、最初の2つを$1、その後に続くものを$2として、"$1,$2"を表示するという処理をしています。

参考にさせていただいたサイト

正規表現チートシート的な
該当文字列を用いた置換

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away