Question

我有一个值数组，特别是某种元素的像素偏移量。

假设它们位于数组arrScroll[]中，其值为[5, 10, 15, 50, 100, 250]。

如果我的窗口滚动超过5像素但不超过10像素，我得到索引0.如果我的窗口滚动超过15像素但不超过50像素，我得到索引2.如果它滚动回到10像素以下但不是低于5，我再次得到指数0。

我正在尝试做的是找到一种优雅的方式（而不是每个可能范围的大量条件，因为范围的数量可以改变）总是得到滚动范围的两个索引中的较低者am in，除了0到arrScroll[0]的范围，在这种情况下，我传递的值不同于索引。

另一个例子：如果我在arrScroll[3]和arrScroll[4]的范围内，那么我将获得索引3.只有当我通过较高索引号的位置时才能得到它的索引。 / p>

这与排序无关，因为值已经从最小到最大排序。在滚动事件监听器上，我只想获取包含索引的两个值中较低者的索引。

组织它的最佳方法是什么，以便它可以用于任意长度的数组？

更完整的示例：

我的颜色是红色，蓝色和绿色。我有一个值为[100, 200, 300]的数组。当我的窗口滚动超过100像素但不超过200像素时，我会有类似$(element).css('background-color', colorArr[index])的内容，其中索引0处colorArr[]的颜色为红色。

然后，如果窗口滚动超过200但不超过300，我运行相同的代码片段，但索引现在为1，颜色为蓝色。

如果我向下滚动到200像素以下但不低于100像素，则索引再次为0，并且传递的颜色为红色。

如果已知数组的长度，使用if语句创建这是微不足道的，但我不知道如何为任意长度的数组执行此操作。

Answer 1

如果我没弄错，你是在寻找基于价值的指数吗？

let arr = [5, 10, 15, 50, 100, 250];
let colorArr = ["red", "blue", "green", "yellow", "orange", "black"]
//fake listener
let scrollListener = (pixelScrolled) => {
   let index = (arr.findIndex((element)=>pixelScrolled<element)+arr.length)%(arr.length+1);
   $(document.body).css('background-color', colorArr[index])
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="(()=>scrollListener(9))()">fake scroll toggle : 9</button>
<button onclick="(()=>scrollListener(49))()">fake scroll toggle : 49</button>
<button onclick="(()=>scrollListener(250))()">fake scroll toggle :  250</button>

Answer 2

我会从开头开始迭代你的arrScroll值，假设你的偏移量总是以增长的顺序排序，并且一旦你的测试位置大于测试的索引就会中断

＆＃13;

var test = function (position, offsets) {
    for (var index = 0; index < offsets.length - 1; index++) {
      if (position < offsets[index]) break;
    }
    
    return index > 0 ? index - 1 : 'something';
}

// will return index 1 cuz 4 is bw 1 and 5
console.log(test(4, [0, 1, 5, 10, 20, 42]))

// will return 3
console.log(test(12, [0, 1, 5, 10, 20, 42]))

// would return 0, but would return "something" since this is your special case
console.log(test(16, [20, 100]))

＆＃13;

这样你只能迭代部分偏移数组，尽快退出

某些行为是否发生在数组值之间的范围内？

2 个答案: