0

我有以下功能：

function get_stoplight_color(count, position) {
    console.log(count + ', ' + position);

    var colors = {
        'QB' : ['#8b3a25', '#ceca63', '#68c24c', '#68c24c', '#68c24c'],
        'RB' : ['#8b3a25', '#ceca63', '#ceca63', '#ceca63', '#68c24c'],
        'WR' : ['#8b3a25', '#ceca63', '#ceca63', '#ceca63', '#ceca63'],
        'TE' : ['#8b3a25', '#ceca63', '#68c24c', '#68c24c', '#68c24c'],
        'DST' : ['#8b3a25', '#68c24c', '#68c24c', '#68c24c', '#68c24c'],
        'K' : ['#8b3a25', '#68c24c', '#68c24c', '#68c24c', '#68c24c']
    };

    console.log(colors);
    if (count <= 4) return colors.position[count];
    else return '#68c24c';
}

正如你所看到的，我已经在控制台上记录了几个变量，它们在那里看起来很好。但是，在运行时我收到以下错误：

未捕获的类型错误：无法读取未定义的属性“4”

（那时count= 4。）

同样，该对象colors显然存在，因为console.log(colors)输出：

Object {QB: Array[5], RB: Array[5], WR: Array[5], TE: Array[5], DST: Array[5]…}

所以我希望在= 'QB' 和= 4时colors.position[count]返回。#68c24cpositioncount

为什么undefined在这种情况下对象仍然返回？谢谢，如有必要，我会提供更多详细信息（我已经提供了我预先想到的所有内容）。

4

2 回答 2

4

如果 position 是一个变量，那么你应该说colors[position][count]. 否则 JS 会认为position是一个属性colors而不解析它的值。

于 2013-07-29T02:30:50.000 回答
4

该表达式colors.position[count]使用position上的属性colors。我认为您的意思是colors[position][count]，它将查找由变量position（例如，QB）colors命名的属性，然后在结果中查找由count（例如，4）命名的属性。

如果有position可能没有定义，我会在最后稍微改变一下。代替：

if (count <= 4) return colors.position[count];
else return '#68c24c';

也许：

return (colors[position] && colors[position][count]) || '#68c24c';

...它利用了 JavaScript 的强大功能||和&&操作符。

在下面回复您的评论：

哇，好的，这有效，但我不确定如何？我什至没有尝试过，因为我将 [] 操作数视为数组的索引，而颜色是一个对象（不是数组）。

在 JavaScript（与许多语言不同）中，您可以通过两种方式访问​​对象属性：

  1. 使用点表示法和文字属性名称，例如obj.foo（如果属性名称是有效的标识符名称），或

  2. 使用括号表示法和字符串属性名称，例如obj["foo"]（在这种情况下，属性名称可以是任何东西，它不必是有效的标识符名称）。

在第二种情况下，字符串可以来自任何表达式，包括变量查找。所以所有这些都是指obj.foo：

obj.foo
obj["foo"]
obj["f" + "o" + "o"]
var x = "o";
obj["f" + x + x]

...事实上，这与您在处理数组时使用的表示法相同，因为在 JavaScript 中，数组并不是真正的数组，它们只是对象。

于 2013-07-29T02:30:58.267 回答