请问大家一个拿后端数据 遇到这种情况的处理问题

Question

图上面是要显示三条数据，但是后端返回的数据 有多 有少，可能不足三条 可能超过三条，

for(let i = 0; i<3; i++) {

'<span>'+listarr[i].goods_spec+'</span>'
....

}
如果我用for循环直接截取前三条的话，不足三条的时候就会因为找不到属性而报错，
如果我直接遍历这个数组的话，数据又可能非常多，又不能直接用css的超出隐藏去做，

请问这种情况，我只能1、2、3条的去判断它是几条数据，写for循环吗？有没有比较合适的处理方式？

Answer 1

for(let i = 0; i < listarr.length; i++) {
    if (i >= 3) break;
    '<span>'+listarr[i].goods_spec+'</span>'
    ....
}

Answer 2

MDN: for

for (let i = 0;; i++) {
   console.log(i);
   if (i >= 2) break;
}

Answer 3

循环次数 = Math.min(3, listarr.length)

Answer 4

slice

arr.slice(0, 3).reduce((html, item) => {
    return html + '<span>'+item.goods_spec+'</span>'
}, '')

Answer 5

用数组的slice方法。

Answer 6

这种问题就让后端做分页，干嘛非得让前端来做判断进行截取数据，这明显不合理。