目前在 React 中，我正在使用它array.map(function(text,index){})来遍历数组。但是，我将如何使用 map 同时迭代两个数组？
编辑
var sentenceList = sentences.map(function(text,index){
return <ListGroupItem key={index}>{text}</ListGroupItem>;
})
return (
<div>
<ListGroup>
{sentenceList}
</ListGrouup>
</div>
);
就像，在这里我希望在每次迭代前都添加图标。我计划将这些图标放在另一个数组中。所以，这就是迭代两个数组的原因。
两个数组的长度是否相同？如果您打算以某种方式将两者结合起来，则可以执行以下操作。
array.map(function(text,index){
return text + ' ' + array2[index]
})
在你的情况下：
var sentenceList = sentences.map(function(text,index){
return <ListGroupItem key={index}>{text} <img src={icons[index]} /i> </ListGroupItem>;
})
return (
<div>
<ListGroup>
{sentenceList}
</ListGrouup>
</div>
);
请注意，如何分配 Icon src。这个想法是访问具有相同索引的图标数组以获得相应的图标。
如果可能的话，我建议将文本与图像一起存储在一组对象中，例如：
const objects = [{text: 'abc', image: '/img.png' }, /* others */];
这样你就可以遍历数组并同时选择两个成员，例如：
objects.map(item => (<Component icon={item.image} text={item.text} />) )
如果这是不可能的，那么只需映射一个数组并通过当前索引访问第二个数组的成员：
sentences.map((text, index) => {
const image = images[index];
return (<Component icon={image} text={text} />);
});
你不能用内置Array.prototype方法来做到这一点，但你可以使用这样的东西：
function map2(arr1, arr2, func) {
return arr1.map(
(el, i) => { return func(el, arr2[i]); }
);
}
（当然，arr1并且arr2预计长度相同）
通常，您要寻找的是一个zip函数，例如 lodash 提供的函数。很像真正的拉链，它将两个相同长度的东西合二为一：
const zipped = _.zip(sentences, icons);
return (
<div>
<ListGroup>
{zipped.map(([sentence, icon], index) => (
<ListGroupItem key={index}><Icon icon={icon} /> {text}</ListGroupItem>;
))}
</ListGroup>
</div>
);
请注意，这会进行比技术上需要的更多的迭代。如果性能是一个问题，您可能需要一个有点智能的解决方案（虽然不在您的问题范围内）。