Question

我有一个表，在firs行中是列名（它们的数目可变），我想将此表转换为javascript对象。

示例表如下所示：

Ticket  | Created    | State
--------+------------+-------
#102314 | 2018-11-12 |  1
#102315 | 2018-11-14 |  5

如果我想将其放在对象中，它将看起来像：

var toReturn = [];
var table = [['Ticket', 'Created', 'State'],
            ['#102314', 2018-11-12, 1],
            ['#102315', 2018-11-14, 5]];
           /*This is how i recieve data from google Spreadsheets*/
for(var k = 1; k < table.length; k++) {
  toReturn.push({'Ticket': table[k][0],
                 'Created': table[k][1],
                 'State': table[k][2]});
} //This is working for me

// But I'm trying something like this and it not working
for(var k = 1; k < table.length; k++) {
    toReturn.push({table[0][0]: table[k][0],
                   table[0][1]: table[k][1],
                   table[0][2]: table[k][2]});
}

最终的目标是创建具有表中所有属性的对象，而与表中有多少列无关。

Answer 1

一种可能的方法是使用Array.prototype.reduce()

reduce()方法在数组的每个成员上执行 reducer 函数（由您提供），从而产生单个输出值。

减速器功能具有四个参数：


累加器（acc）

当前值（当前）

当前索引（idx）

源数组（src）


您的 reducer 函数的返回值分配给累加器，该累加器的值在整个数组的每次迭代中都会被记住，并最终成为最终的单个结果值。

var table = [
  ['Ticket', 'Created', 'State'],
  ['#102314', '2018-11-12', 1],
  ['#102315', '2018-11-14', 5]
];

var transformedTable = table.reduce(function(result, currentRow, rowIndex) {
  // skip the "header row"
  if (rowIndex === 0) {
    return result;
  }

  // create the actual row from the "header row" and the values of the current row
  var row = table[0].reduce(function(resultRow, caption, captionIndex) {
    resultRow[caption] = currentRow[captionIndex];
    return resultRow;
  }, {})

  result.push(row);

  return result;
}, []);

console.log(transformedTable);

Answer 2

我认为最简单的方法是像Andreas所说的那样进行循环，并在每个循环中获取键名。

类似的东西：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="menu">
    <ul class="list">
        <li class="active">
            <a href="/Employee/Profile">
                <i class="material-icons">person</i>
                <span>Profile</span>
            </a>
        </li>
        <li>
            <a href="javascript:void(0);" class="menu-toggle">
                <i class="material-icons">subject</i>
                <span>Leaves</span>
            </a>
            <ul class="ml-menu">
                <li>
                    <a href="/Admin/AllEmployees">Show My Leaves</a>
                </li>
                <li>
                    <a href="/Leaves/RequestForLeave">Request for Leave</a>
                </li>
                
            </ul>
        </li>
    </ul>
</div>

表Javascript中具有动态属性的对象

2 个答案: