细数那些“合法但有病”的JS操作，看看有几个你中招了？

“合法但有病”:顾名思义就是,你这行为虽然合法,但是多少有点大病的意思。这个梗起源于抖音上的短视频博主。写这篇文章的初衷，是为了纪念我最近在做“代码重构”的过程中，所见到的“谜之操作”，我尊称为“合法但有病”之JS操作系列。来看看有几个你中招了？

一、Array.prototype.map()

因为 map 生成一个新数组，当你不打算使用返回的新数组却使用 map 是违背设计初衷的，请用 forEach 或者 for-of 替代。

二、使用Math.random()做React/Vue列表组件的key

<div>
{
  [1,2,3].map((_d)=>{
    return <div key={Math.random()}>{_d}</div>
  })
}
</div>

key是节点的唯一标识，react基于key识别节点，做diff算法。

我曾经很暴力的替同事改过一个echarts 渲染错乱的bug，用Math.random()作为key，控制强制更新组件，真的很有用。但是不建议用。

未完待续......