文字列を1文字ずつHTMLタグで囲みたかったので、定義した文字列を配列に変換しmap()でタグを加えてみます。文字列を配列に変換する方法を2種類紹介します。
変換する方法
String.split() を使う
split()に''空文字列を渡すことで文字列を配列に分割することができます。
'あいうえお'.split('')
-> (5) ["あ", "い", "う", "え", "お"]スプレッド演算子を使う
スプレッド演算子（spread operator）を使っても同じように文字列を配列に分割できます。（Typescriptを使用している場合、設定によってはエラー判定になります）
[...'あいうえお']
-> (5) ["あ", "い", "う", "え", "お"]（例）文字列を1文字ずつ特定のタグでラップした JSX を返す
文字列を1文字ずつ<span>で囲んでみます。例は JSX なので、ループ時に必要な key 属性を付与しています。
[...'あいうえお'].map((v, k) => <span key={k}>{v}</span>)
->
<span>あ</span>
<span>い</span>
<span>う</span>
<span>え</span>
<span>お</span>