如果语句内部为for循环

Question

我目前正在尝试创建一个响应式滑块，用户可以在其中选择屏幕上显示的项目数量，他可以决定他想要的每个自定义媒体查询中的项目数量。 所以我的想法是用所有媒体查询传递一个obj

$(".slider-container1").slider({
        itemsOnScreen:          5,
        spaceBetween:           20,
        draggable:              true,
        responsive:             {
            "480":      2, // from 0 to 480 display 2 items
            "768":      3, // from 481 to 768 display 3 items
            "1024":     4  // from 769 to 1024 display 4 items
            // the behaviour of the slider NOT ranged here come from the previous property "itemsOnScreen"
        }
});

然后我将它存储在滑块属性mq中，以便我可以轻松访问它

var slider = {
    mq: params.responsive
};

然后是困难的部分 我的想法是在

中创建一个函数

$(document).on('resize', function(){
    beResponsive();
});

其中函数beResponsive（）控制滑块的resposive部分。
我的想法是以这种方式创建一个基于slider.mq的循环

function beResponsive() {
        for(var width in slider.mq){
            if ("width is between two values stored in slider.mq") {"do stuff to do responsive"};
        }
    }
beResponsive();

通过这种方式我无法使其工作，因为我无法找到同时访问obj的两个不同属性的方法（例如480和768）。
任何想法实现这一目标？有关表演的其他想法吗？还有其他更好的方法吗？

EDIT

我是这样做的，看起来很有效，但我不确定这是否正确，因为它可能不是表现好，因为你知道这个每次调整大小都会触发func

function beResponsive() {
        var lowerWidth = 0;
        var inMediaQuery = false;
        for(var mqWidth in slider.mq){
            if (helpers.vw() > lowerWidth && (helpers.vw() <= parseInt(mqWidth))) {
                inMediaQuery = true;
                console.log("I'm between " + lowerWidth + "  and " + mqWidth);
                break;
            }
            lowerWidth = mqWidth;                   
        }
        if (!inMediaQuery) {
            console.log("bigger than anyone");
        }
    }
beResponsive();

EDIT2

实际上我使用控件WHEN对其进行了改进，它更改了媒体查询，这样可以防止在用户调整大小时触发某个函数并且它仍然在同一个媒体查询中

function beResponsive() {
        var lowerWidth = 0;
        var inMediaQuery = false;
        for(var mqWidth in slider.mq){
            if (helpers.vw() > lowerWidth && (helpers.vw() <= parseInt(mqWidth))) {
                if (helpers.currentMq != parseInt(mqWidth)) {
                    // doStuff 
                    helpers.currentMq = mqWidth;

                }
                inMediaQuery = true;
                break;
            }
            lowerWidth = mqWidth;                   
        }
        if (!inMediaQuery) { // i'm not in a declared mediaquery, so go back to default 
            // do stuff
        }
    }
    beResponsive();