【问题标题】:How to loop through an object and match a number in a range of numbers in a object?如何循环遍历对象并匹配对象中一系列数字中的数字?
【发布时间】:2017-02-25 22:05:14
【问题描述】:

我的对象 这是我的对象

obj = [
    {
        a: [1, 91]
    }, 
    {
        b: [91, 399]
    }, 
    {
        c: [399, 409]
    }
]

我正在跟踪用户鼠标并存储在一个变量中:

userMouse = event.clientX;

如何检查 clientX 是否在某个对象元素范围内以及是否要给出该对象的索引?

请在纯 JS 中执行此操作,不要使用任何库。

【问题讨论】:

  • 数字范围是什么意思?它们是 X 坐标值吗?
  • 我有 div,我对鼠标输入的 div 感兴趣。根据鼠标在 div 中进入的位置,我会显示效果。
  • 我已更新问题以更具体地了解解决方案。
  • 但是要知道div,可以使用document.elementFromPoint(x, y);

标签: javascript loops object


【解决方案1】:

您可以使用findIndex,因此对于给定的x,您可以这样做:

idx = obj.findIndex(({ elementRange: [low, high] }) => low <= x && x < high);

但是如果目标是为某个x、y找一个元素,那么看elementFromPoint

elem = document.elementFromPoint(x, y);

【讨论】:

  • 问题不在于DIV,而是如何遍历对象元素并将变量与每个元素的范围进行比较并返回与范围匹配的元素索引。
  • 我没有说div,但是由于您的问题提到了鼠标坐标,因此您肯定是在引用屏幕上与鼠标指针位置相关的元素。这只是一个建议,因为您的问题没有详细说明。关于范围搜索,findIndex 应该是您所需要的。
【解决方案2】:

其实太简单了,我只需要在每个对象的最小数量和最大数量之间进行设置。但不明白为什么我需要将 [0] 放在过滤器函数的末尾。

  var object = obj.filter(function(obj) {
                return event.clientX > obj.a[0] && event.clientX < obj.a[1];
                    })[0];

【讨论】:

  • filter 返回一个数组,所以通过 [0] 你说给我第一次出现。
【解决方案3】:
//setting variable  
let bj = [{
  elementRange: [1, 91]
}, {
  elementRange: [91, 399]
}, {
elementRange: [399, 409]
}]
let x = 10

//function you are looking for [should work everywhere (browsers)]
function getIndex(bj,x){
  //iterate
  for (let i in bj) {

    if ( (bj[i].elementRange[0]<x) && (bj[i].elementRange[1]>x)){
      //return index if match
      return i;
    }
  }
  return -1;
}

//Test
console.log(getIndex(bj,1))

console.log(getIndex(bj,100))
console.log(getIndex(bj,10))

Live Demo

【讨论】:

    【解决方案4】:

    如果我真正了解你,你想找出数字在哪个元素范围之间:

    var num=100;
    
    for(var i=0; i<obj.length; i++)
    {
       var rangeFirst = obj[i].elementRange[0];
       var rangeSecond = obj[i].elementRange[1];
       if(num>rangeFirst && num <=rangeSecond)
       return obj[i].elementRange
    }
    

    【讨论】:

    • 我用 .filter 搞定了
    • 这意味着你只想要过滤任务?你说例如如何使用过滤器
    • 我已经使用过滤器了。但我仍然不明白如何检索对象索引。我目前可以返回匹配的数据,但不能返回 obj 中该元素的索引。
    • Frazin,你也忘了一个';'长度后:)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-02-22
    • 2021-02-07
    • 2012-05-08
    • 2021-11-07
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多