如何向数组推入键值对数据？AngularJS数组输出格式问题

1. 通用技术：如何向数组中推入带键和值的数据 #

这事其实很简单，有两种常用的顺手写法：

• 直接创建键值对对象并推入数组：

  const myArray = [];
  // 直接把带键值的对象push进去
  myArray.push({ myKey: 'myValue' });
  

• 先定义对象再赋值推入：

  const myArray = [];
  const newObj = {};
  // 用方括号或点语法赋值都可以
  newObj['myKey'] = 'myValue'; 
  // 或者 newObj.myKey = 'myValue';
  myArray.push(newObj);
  

两种方法本质完全一致，选你觉得舒服的写法就行。

2. 具体场景：让控制台输出不带索引的对象 #

你现在看到控制台显示0:{VariableName:'Total Active Energy'}，核心原因是$scope.filters.Variables是数组类型，浏览器控制台默认会把数组的索引和对应元素一起展示。要只看到对象本身，有几个针对性的解决方案：

方案一：直接打印单个对象 #

如果你只需要查看刚推入的那个对象，直接打印它就行，不用打印整个数组：

var obj = {};
obj['VariableName'] = response.data[0].AutoReportVariable;
$scope.filters.Variables.push(obj);
// 直接打印这个对象，就不会有索引了
console.log(obj);
// 或者打印数组的最后一个元素，效果完全一样
console.log($scope.filters.Variables[$scope.filters.Variables.length - 1]);

方案二：把数组转成字符串输出 #

如果你想查看整个数组，但不想看到索引格式，可以用JSON.stringify()把数组转成JSON字符串：

console.log(JSON.stringify($scope.filters.Variables));
// 输出会是：[{"VariableName":"Total Active Energy"}]

方案三：修改Variables的类型为对象（如果业务允许） #

如果你的需求根本不是要一个数组，而是单个对象，那一开始就别把Variables定义成数组，改成对象就行：

// 修改初始的filters定义
$scope.filters = { 
  Sites: [], 
  Regions: [], 
  Devices : [], 
  Variables : {}, // 这里改成空对象，不是数组
};
// 直接赋值，不用push
$scope.filters.Variables.VariableName = response.data[0].AutoReportVariable;
// 此时打印 $scope.filters.Variables 就会直接显示 {VariableName:'Total Active Energy'}

不过注意这会改变Variables的类型，要确认你的业务逻辑是否允许它是单个对象而非数组。

内容的提问来源于stack exchange，提问作者devRena