Javascript Newb：如何将var实例化为“ blah.1”和“ blah.2”？

Question

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

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

带有ID的func是这样的：

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;来简化功能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实际上是指具有文字键 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;
};

Answer 2

你不能 的. 是变量标识符的无效字符。

不过，您可以在对象属性中使用它。

var sliders = {
    "slider.1": document.querySelector('#slider_1'),
    "slider.2": document.querySelector('#slider_2')
};

然后使用成员运算符的方括号版本访问属性。

alert( sliders["slider.1"].id );