我有各种不同屏幕尺寸的变量:
ST.screen_x_small = 480;
ST.screen_small = 768;
ST.screen_medium = 992;
ST.screen_large = 1200;
我想为每个变量声明一些要加载的项目。因此,例如,如果 x_small 我想加载 10,如果小,则加载 20,依此类推。
我已将每个尺寸放入字典中:
ST.content_per_load_dict = {'480' : 10, '768' : 20, '992' : 30, '1200' : 40};
然后:
var pageWidth = $(window).width();
if(pageWidth < ST.screen_x_small)
{
ctx.contentPerLoad = ST.content_per_load_dict[ST.screen_x_small];
}
else if(pageWidth < ST.screen_small)
{
ctx.contentPerLoad = ST.content_per_load_dict[ST.screen_small];
}
else if(pageWidth < ST.screen_medium)
{
ctx.contentPerLoad = ST.content_per_load_dict[ST.screen_medium];
}
else
{
ctx.contentPerLoad = ST.content_per_load_dict[ST.screen_large];
}
我的问题是:
有更好的方法吗?
有没有更高效的字典声明方式?理想情况下,我只想在 ST.screen_x_small var 中声明 480 而不是在字典中再次声明。
最佳答案
基于 pax162 的回答,您甚至可以进一步简化此操作。
// Order matters.
var ST = [ {name: 'x-small', width: 480, items: 10}, {name: 'small', width: 768, items: 20} ];
// ST.sort(function(a,b) { return a.width > b.width } )
ST.some(function (d) {
if(pageWidth <= d.width) {
ctx.contentPerLoad = d.items;
return true;
}
});
将您的维度和相关数据放入数组中的对象中,必要时进行排序,然后迭代该数组,这样您就不必为任何新项目输入额外的条件。
关于javascript - 字典和声明变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19686340/