Javascript Newb : How do I instantiate a var as "blah.1" and "blah.2"?

Question

我目前有一个像这样定义一些变量的 block

var slider_1  = document.querySelector('#slider_1');
var slider_2  = document.querySelector('#slider_2');
...

获取 ID 的函数是这样的:

function updateFromInput(id){               
    if(id==1){
        var x = input_1.value*1;
        x = Math.round((x*ratio)-offset);     
        slider_1.x.baseVal.value =  x/scale;
    }else if(id==2){
        var x = input_2.value*1;
        x = Math.round((x*ratio)-offset); 
        slider_2.x.baseVal.value =  x/scale;
    }
};

我正在尝试重构一下。
我在想，如果我可以的话，用点而不是下划线来实例化我的变量

var slider.1  = document.querySelector('#slider_1');
var slider.2  = document.querySelector('#slider_2');

然后我就可以更好地利用已经传递到我的函数中的 ID 并消除大量重复。
我希望通过一次调用 slider.id.x.baseVal.value = x/scale; 来简化我的函数。而不是必须在 每个 IF/ELSE 条件中都有该代码。

不过，当我尝试这样做时，我收到一条错误消息“Uncaught SyntaxError: Unexpected number”。
应该怎么做？

Answer 1

您不能在对象中使用纯数字键。

不过你可以这样做:

var slider = {};  // or = [], if array syntax is more appropriate
slider[1] = ...
slider[2] = ...

此外，如果键实际上是一个变量而不是文字标记，则不允许使用您建议的语法。

在你的例子中 slider.id实际上指的是带有文字 key id 的对象，而不是变量的任何值 id恰好有。

您必须将变量放在方括号内，即 slider[id] ，所以你的函数会这样写:

function updateFromInput(id){               
    var x = +input[id].value;
    x = Math.round((x*ratio)-offset);     
    slider[id].x.baseVal.value =  x/scale;
};