Array to string (DOM)

Array to string (DOM)

Array of object :

const users = [{
id: 1,
name: "Sakura Miko"
}, {
id: 2,
name: "Usada Pekora"
}];

 

Convert to DOM :

const html = `<ul>
${users.map(user => `<li>${user.name}</li>`).join("")}
</ul>`;
console.log(html);

// 
<ul>
<li>Sakura Miko</li><li>Usada Pekora</li>
</ul>

 

.join(“”)を忘れないようにしましょう。

Array.map(callback)はブラウザが読み込む際に、自動的に.toString() を実行して”,”区切りのStringにしてしまいます。

DOM生成時、”, ”は入れたくないので、自分でglueを””に指定して文字列にします。

JavaScriptカテゴリの最新記事