将值附加到属性名称答案

【问题标题】：Appending value to attribute name将值附加到属性名称
【发布时间】：2018-08-15 09:44:24
【问题描述】：

我正在尝试为 JavaScript 模型设置属性。我想为每个循环添加名称为 logo0、logo1、logo2。下面的代码 sn -p 行是错误的 logo+[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"
        }
      });
}

如何做到这一点？

【问题讨论】：

什么是多边形？
它是一个模态。我只需要为每个循环添加值 0 、 1 的徽标。
不知道语法，怎么实现？

标签： javascript arrays attr

【解决方案1】：

你可以使用计算属性名

只需将徽标 +i 包裹在 []

我的猜测是它看起来像 ["logo" + 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"
        }
      });
}

【讨论】：

请注意，IE 不支持计算属性名称。
我觉得babel应该可以搞定
当然，但是这个问题没有用 babel 标记。

【解决方案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);
}

【讨论】：

【解决方案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"
        }
    });
}

【讨论】：