在Javascript if语句中动态生成多个条件

在React组件的.map（）函数中，我有一个if语句，需要包含由| |运算符分隔的多个条件。问题是，

this.state.insights

是一个数组，根据从我的服务器中提取的json数据由不同的长度组成

document.getElementById("adMaskid" + this.props.id).innerHTML = audio_data
    .map((sample, i) => {
        let rectOpacity = 1
        if (i > this.state.insights[0].start && i < this.state.insights[0].end || /
            i > this.state.insights[1].start && i < this.state.insights[1].end) {
            rectOpacity = 1;
        } else {
            rectOpacity = 0;
        };

        let sampleWidth = 100.0 / audio_data.length;
        let sampleHeight = sample * 50.0;

        return `<rect style="transform: scaleY(.9); opacity: ${rectOpacity};"
                x=${sampleWidth * i}
                y=${(25 - sampleHeight)}
                width=${sampleWidth}
                height=${sampleHeight} />`
    )}

不必更改一堆底层代码，有没有办法做到这一点？我读过关于使用eval语句的文章，但这样做使我倾向于希望有一个更好、更安全的解决方案。非常感谢您的见解。非常感谢。

this.state.insights.some（{start，end}）=>i>start&&i this.state.insights.some(({ start, end }) => i > start && i < end )

只需迭代

insights

数组，根本不需要

eval

。

this.state.insights.some（{start，end}=>i>start&&i

只需迭代

insights

数组，根本不需要

eval

 this.state.insights.some(({ start, end }) => i > start && i < end )