Javascript 根据键分配JS数组中变量的值

我有一个变量，它的值来自当前对象的ID属性，它看起来总是像filtercolor红色：

我还有一个数组，列出了可能的ID和相应的十六进制代码：

var activeFilterBg;
var filterBgColor = [];
filterBgColor = {
    filtercolor-black:      '#171710',
    filtercolor-blue:       '#4C94B6',
    filtercolor-brown:      '#50443D',
    filtercolor-gold:       '#F6D069',
    filtercolor-green:      '#96B14D',
    filtercolor-grey:       '#A8AAA5',
    filtercolor-orange:     '#DB5E46',
    filtercolor-pink:       '#E78EB1',
    filtercolor-purple:     '#59547E',
    filtercolor-red:        '#D22200',
    filtercolor-silver:     '#EBEBEB',
    filtercolor-white:      '#FFF'
};

我想做的是从

filterbcolor

中获取

activeFilterBg

并从

filterBgColor

中分配适当的十六进制代码。我可以用

开关
来实现这一点，但这似乎有点草率，而且在将来会有很大的出错空间

我是否可以选择以某种方式查找正确的键，然后根据该键分配变量？
首先使用
hasOwnProperty
检查对象-如果该属性存在，请使用它

$('.facet-options-list li input[id*=filtercolor]').each(function() {
    var filterColor = this.id; //$(this).attr('id');
    var color;
    if (filterBgColor.hasOwnProperty(filterColor) {
        color = filterBgColor[filterColor];
    } else {
        color = "#FFF"; //not found
    }
});

首先使用
hasOwnProperty
检查对象，如果该属性存在，请使用它

$('.facet-options-list li input[id*=filtercolor]').each(function() {
    var filterColor = this.id; //$(this).attr('id');
    var color;
    if (filterBgColor.hasOwnProperty(filterColor) {
        color = filterBgColor[filterColor];
    } else {
        color = "#FFF"; //not found
    }
});

将id映射到颜色应尽可能简单

var filterColor = $(this).attr('id');
var hexCode = filterBgColor[filterColor];
//then do whatever with the hexCode

将id映射到颜色应尽可能简单

var filterColor = $(this).attr('id');
var hexCode = filterBgColor[filterColor];
//then do whatever with the hexCode

那不是数组，那是对象。将数组指定给变量，然后立即用对象替换该数组。一个对象可以很好地处理这个问题，所以只需跳过该数组即可。（但请注意，正如Jordan所指出的，参数名称在包含破折号时必须被引用。）

可以使用括号语法使用变量访问对象属性：

var activeFilterBg;
var filterBgColor = {
    'filtercolor-black':      '#171710',
    'filtercolor-blue':       '#4C94B6',
    'filtercolor-brown':      '#50443D',
    'filtercolor-gold':       '#F6D069',
    'filtercolor-green':      '#96B14D',
    'filtercolor-grey':       '#A8AAA5',
    'filtercolor-orange':     '#DB5E46',
    'filtercolor-pink':       '#E78EB1',
    'filtercolor-purple':     '#59547E',
    'filtercolor-red':        '#D22200',
    'filtercolor-silver':     '#EBEBEB',
    'filtercolor-white':      '#FFF'
};

$('.facet-options-list li input[id*=filtercolor]').each(function() {
    var filterColor = $(this).attr('id');
    activeFilterBg = filterBgColor[filterColor];
});

那不是数组，那是对象。将数组指定给变量，然后立即用对象替换该数组。一个对象可以很好地处理这个问题，所以只需跳过该数组即可。（但请注意，正如Jordan所指出的，参数名称在包含破折号时必须被引用。）

可以使用括号语法使用变量访问对象属性：

var activeFilterBg;
var filterBgColor = {
    'filtercolor-black':      '#171710',
    'filtercolor-blue':       '#4C94B6',
    'filtercolor-brown':      '#50443D',
    'filtercolor-gold':       '#F6D069',
    'filtercolor-green':      '#96B14D',
    'filtercolor-grey':       '#A8AAA5',
    'filtercolor-orange':     '#DB5E46',
    'filtercolor-pink':       '#E78EB1',
    'filtercolor-purple':     '#59547E',
    'filtercolor-red':        '#D22200',
    'filtercolor-silver':     '#EBEBEB',
    'filtercolor-white':      '#FFF'
};

$('.facet-options-list li input[id*=filtercolor]').each(function() {
    var filterColor = $(this).attr('id');
    activeFilterBg = filterBgColor[filterColor];
});

var color=filterBgColor[filterbcolor]
正如Guffa在下面指出的那样，您在这里所做的是将一个空数组分配给一个变量（
var filterBgColor=[]；
），然后扔掉它并将一个对象分配给同一个变量（
filterBgColor={…}
）。了解JavaScript中数组和对象之间的区别很重要。仅当需要数字键时才应使用数组，例如
var a=[“a”、“B”、“C”]；console.log（a[0]）；//=>“A”
。否则您应该使用一个对象：
varo={foo:X'，bar:Y'，…}；console.log（o.foo）；//=>“X”
谢谢@Jordan，我刚刚开始涉入JS，这是一个非常有用的区别。
var color=filterBgColor[filterbcolor]
正如Guffa在下面指出的，这里要做的是给变量分配一个空数组（
var filterBgColor=[]；
）然后扔掉它，将一个对象赋给同一个变量（
filterBgColor={…}
）。了解JavaScript中数组和对象之间的区别很重要。仅当需要数字键时才应使用数组，例如
var a=[“a”、“B”、“C”]；console.log（a[0]）；//=>“A”
。否则您应该使用一个对象：
varo={foo:X'，bar:Y'，…}；console.log（o.foo）；//=>“X”
谢谢@Jordan，我刚刚开始涉入JS，这是一个非常有用的区别。+1指出数组是不必要的。但是值得注意的是，需要引用带有破折号的属性名称（例如，
filtercolor black
）：
var filtercolor={“filtercolor black”：“#171710”，…}
@Jordan:很好，我在复制代码时没有想到这一点。+1指出数组是不必要的。但是值得注意的是，需要引用带有破折号的属性名称（例如，
filtercolor black
）：
var filtercolor={“filtercolor black”：“#171710”，…}
@Jordan：很好，我在复制代码时没有想到这一点。