知道何时使用循环或映射

Question

尝试通过编码 (React) 学习，我的问题是：React 到处都使用 map() ，所以我们可以用 map 替换每个循环，例如 for 循环吗？什么时候用 map 什么时候用 for loop 好？在下面的示例中，我使用了 for 循环，我应该使用 map 吗？

如何将其更改为地图？:

 const links = currentLinks;
      for (let i = 0; i < links.length; ++i) {
        let border = links[i].boundary.points;
        drawPath(canvas, ctx, border, '#AA1111', '#AA1111', 0.2);
      }
      
      
      
      -----------------
      
      links.map(() => (
      ?
      
      ));

Answer 1

这是一个偏好问题，但在我看来，大量使用循环意味着某人经验不足。主要区别在于，在使用循环时需要保持 state。当你使用 state 时，你需要为它想一个名字——不管你信不信——这有时是最难的部分。另一方面，.map()、.filter()、.reduce() 等只是表达式。

使用你喜欢的任何东西，但要明智地使用它。

话虽这么说，但有时使用循环更有意义。经验法则是，每当您的代码产生某种 副作用 时，使用循环更合乎逻辑。考虑这两个例子：

for (const fruit of fruits) {
    draw(fruit);
}

// or:

fruits.forEach(
    fruit => draw(fruit) // makes sense
);

// vs.

fruits.map(
    fruit => draw(fruit)
);

所有人都会工作并做同样的事情，但最后一个是相当业余的。它 return 是一个包含任何 draw() return 的数组，并且从未使用过 return 值，因此失去了使用表达式的目的。

总结一下：

表情？使用 .map()
副作用？使用循环

Answer 2

map => 用于转换或投影 - 它提供了一个新集合

loops => 用于执行某些操作（在集合本身或一般情况下）- 它不会 return 任何东西

例如

const data = [1, 2, 3, 4, 5]

您想获得数组中每个数字的双倍数

const doubled = data.map((number, index) => number * 2);

//-- Output 

[2, 4, 6, 8, 10]

如果项目介于 2 和 5 之间，您想调用一些方法（或执行一些操作）

data.forEach(number => { 
    if(number > 2 && number < 5){
        //call some method
    }
    else{
        //..... do some other work
    }
}

或

for(let i=0; i< data.length; i++){
    const number = data[i];
    if(number > 2 && number < 5){
        //call some method
    }
    else{
        //..... do some other work
    }
}

我知道这些例子是做作的，不是很好，但我希望你能明白我的意思。如果您有任何疑问，请在评论中告诉我

更新对于您的情况，您可以使用如下地图

links.map(link => {
  let border = link.boundary.points;
  drawPath(canvas, ctx, border, '#AA1111', '#AA1111', 0.2);
});

Answer 3

首先也是最重要的，如果你知道你需要早点突破，那么你需要使用循环，因为你不能 return 早点使用 forEach 和 map（不使用过滤器之类的东西）。

同样针对 React，如果状态或属性发生变化，您将获得 re-render。使用 map 将创建一个新数组（至少是对数组的引用），这将为您提供通常需要的 re-render。

知道何时使用循环或映射

knowing when to use a loop or map

html

javascript

loops

for-loop

reactjs