javascriptで正規表現でマッチした複数の対象を再帰的に処理する方法

この記事は1分で読めます。

今日、javascriptを書いていて「あれ?」と手が止まった事があったのでメモ📝

<div>
  <hr>
  <ul>
    <li>foo</li>
    <li>bar</li>
  </ul>
</div>

これらをjsで要素の最後>の手前にhogeみたいな文字列を加え、既にhogeが書かれて居る場合はスキップする、といった事をしたい。

正規表現で/(<.*?)(>)/gとかした後に、マッチした全ての対象を再帰的に処理したい。.replaceで正規表現でマッチした対象を置換はさっと思いついたのだけど、.replaceの第2引数にコールバック関数を使えば簡単に処理できる事が分かった。

function addHoge(){
  let el = //上記のhtml
  el.replace(/(<.*?)(>)/gm, function(){
    if(!arguments[0].includes(' hoge>')){
      return arguments[1] + " hoge" + arguments[2]
    }else{
      return arguments[0]
    }
  }
}

ちょっと雑に書いたけど、第2引数にコールバック関数を使い、auguments[0]でマッチした文字列を取り出せる。また、auguments[1]で1つ目のパターンマッチ、auguments[2]で2つ目のパターンマッチなどを使える。

auguments[3]などで他にも取り出せる情報があるので、console.log(auguments)などで都度調べると良さそう。

t4traw

いつか学んだ知識や技術で人の役にたつ事を目標に日々勉強しています。音楽とウイスキーとRubyが好きです。最近はキャンプと釣り(ライトソルトルアー)も好きです。

コメントください🙋

わかりにくい所や、共感していただける事がありましたら、お気軽にコメントください✋ ブログのコメントでもTwitterなど、どこでも反応します👍

comments powered by Disqus
rss facebook twitter github gitlab youtube mail spotify lastfm instagram linkedin google google-plus pinterest medium vimeo stackoverflow reddit quora quora