时间戳

首页 > 解决方案 > 如何仅将字符串插入循环的第一次迭代？

javascript - 如何仅将字符串插入循环的第一次迭代？

问题描述

好的，所以我有这个动态的对象数组。它100内部可以有对象，也可以只有one. 我一直在通过遍历数组从服务器端渲染 html。那部分工作正常，但我想做的是我想插入一块string到first iteration唯一的。这意味着我希望 power 的值出现在第一次迭代中，也就是说，我希望 powerSteve Rogers的值出现在td锚标记之前的第一个迭代中。

请再次注意，arr可以有任意数量的对象。

这是代码：

const arr = [ 
    {
        "name": 'Steve Rogers',
        "age": 90,
        "bio": 'https://www.boomboom.com'
    }, 
    {
        "name": 'Natasha Romanoff',
        "age": 30,
        "bio": 'https://www.bambam.com'
    }
];

const power = 'Super-Strength <br><br>';

const arrMap = arr.map(el => {
    return `
        <td>
            <a href="${el.bio}">Bio</a>
        </td>
        <td>${el.name}</td>
        <td>${el.age}</td>
    `;
});

预期结果是两个字符串块的数组：

[
  '<td>
       Power: Super-Strength <br><br>
       <a href="https://www.boomboom.com">Bio</a>
   </td>
   <td>Steve Rogers</td>
   <td>90</td>',

   '<td><a href="https://www.bambam.com">Bio</a></td>
   <td>Natasha Romanoff</td>
   <td>30</td>'
]

标签： javascripthtmlarrays

解决方案

干得好：

var arr = [ 
    {
        "name": 'Steve Rogers',
        "age": 90,
        "bio": 'https://www.boomboom.com'
    }, 
    {
        "name": 'Natasha Romanoff',
        "age": 30,
        "bio": 'https://www.bambam.com'
    }
];

var power = 'Super-Strength <br><br>';

var arrMap = arr.map((el,i) => {
    return `<td>${i==0 ? "Power: "+power : ""}<a href="${el.bio}">Bio</a></td><td>${el.name}</td><td>${el.age}</td>`;
});
console.log(arrMap)

推荐阅读