将值附加到属性名称

Question

我正在尝试将属性设置为JavaScript模型。 我想为每个循环将名称添加为logo0，logo1，logo2。 以下代码段行是错误的徽标+ [i]。

for (var i = 0; i <= paths.length - 1; i++) {
  Polygon.attr({
        logo+i: {
          d: paths[i],
          stroke: 'red',
          strokeWidth: "15",
          cursor: 'pointer',
          event: 'element:path-click',
          strokeLinecap: "square"
        }
      });
}

如何实现？

Answer 1

u可以使用计算出的属性名称

只需将徽标+ i换成[]

我的猜测是 ["logo" + i]

在此处了解更多信息

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#Computed_property_names

for (var i = 0; i <= paths.length - 1; i++) {
  Polygon.attr({
        ["logo"+i]: {
          d: paths[i],
          stroke: 'red',
          strokeWidth: "15",
          cursor: 'pointer',
          event: 'element:path-click',
          strokeLinecap: "square"
        }
      });
}

Answer 2

首先创建对象，然后使用方括号设置logoX属性：

for (var i = 0; i <= paths.length - 1; i++) {
    var attr = {};
    attr["logo"+i] = {
        d: paths[i],
        stroke: 'red',
        strokeWidth: "15",
        cursor: 'pointer',
        event: 'element:path-click',
        strokeLinecap: "square"
    };

    Polygon.attr(attr);
}

Answer 3

在动态对象文字的computed property names旁边，您可以从以下位置更改for循环

for (var i = 0; i <= paths.length - 1; i++) {
//                 ^              ^^^

到

for (var i = 0; i < paths.length; i++) {
    Polygon.attr({
        [logo + i]: {
            d: paths[i],
            stroke: 'red',
            strokeWidth: "15",
            cursor: 'pointer',
            event: 'element:path-click',
            strokeLinecap: "square"
        }
    });
}