javascript - 在递增/递减时将整数限制为数组 indeces

Question

考虑以下代码(keyCode 用于向后兼容):

/**
 * Navigate through the items.
 *
 * @param {Event} event
 * @return void
 */
navigate(event) {

    if (event.keyCode === 38 || event.key === "ArrowUp") {
        this.active = this.active + 1 > this.items.length ? 0 : this.active + 1;
    }

    if (event.keyCode === 40 || event.key === "ArrowDown") {
        this.active = this.active - 1 < 0 ? this.items.length : this.active - 1;
    }

}

如果上面的内容不清楚，我正在尝试执行以下操作:

• 递增this.active时，确保其不大于this.items的长度，如果大于，则返回0
• 递减this.active时，确保其不小于0，如果小于，则返回到this.items的长度

上面的代码工作得很好，但我知道它可以做得更好、更有效。例如，调用 this.active -1 两次效率低下。

有没有办法使用Math.min和Math.Max之类的东西来优雅地实现这一点？

Answer 1

我会使用模运算符:

navigate(event) {
    const { length } = items;
    if (event.keyCode === 38 || event.key === "ArrowUp") {
        this.active = (this.active + 1) % length;
    } else if (event.keyCode === 40 || event.key === "ArrowDown") {
        this.active = (this.active - 1 + length) % length;
    }
}