在javascript中将JSON对象转换为数组数组

Question

我试图从 JSON 对象中获取特定的 key 数组值并将其存储在一个数组中，如下所示。

示例：

var obj = { "1":{"class":2,"percent":0.99,"box":[0.2,0.3,0.4,0.5]},
            "2":{"class":2,"percent":0.99,"box":[0.12,0.23,0.45,0.56]},
            "3":{"class":2,"percent":0.99,"box":[0.52,0.83,0.34,0.59]}
           } 

诸如此类

现在我需要获取键“box”的值并存储在一个数组中。

var list = []
list = [[0.2,0.3,0.4,0.5],[0.12,0.23,0.45,0.56],[0.52,0.83,0.34,0.59]]

但是，我尝试了多种方法将数组存储在数组中，但是当我打印列表时我可以得到这样的结果

list = 0.2,0.3,0.4,0.5,0.12,0.23,0.45,0.56,0.52,0.83,0.34,0.59

Answer 1

试试这个：

Object.values(obj).map(x=>x.box);

var obj = { "1":{"class":2,"percent":0.99,"box":[0.2,0.3,0.4,0.5]},
            "2":{"class":2,"percent":0.99,"box":[0.12,0.23,0.45,0.56]},
            "3":{"class":2,"percent":0.99,"box":[0.52,0.83,0.34,0.59]}
           } 
           
let list = Object.values(obj).map(x=>x.box);

console.log(JSON.stringify(list))

Object.values 返回 obj 值数组，然后我们使用 map 迭代该值（我们使用 arrow function）并使用框值创建新数组。

Answer 2

您可以使用 Object.keys（它返回一个包含您的 json 的所有键的数组）结合数组的映射将您的 json 转换为一个新数组：

const boxes = Object.keys(obj).map(key => obj[key].box)

您也可以使用 Object.values，这在您的情况下实际上更好：

const boxes = Object.values(obj).map(value => value.box)

工作原理

Object.keys 返回一个数组：

Object.keys(obj) // ["1", "2", "3"]

然后您可以映射它们以获取每个项目的值：

Object.keys(obj).map(key => obj[key]) // [{box: [...]}, {box: [...]}, {box: [...]}]

那么在array.map的回调中，你可以简单的只返回box值：

Object.keys(obj).map(key => obj[key].box) // [[...], [...], [...]]

---

没有 Object.keys()

function getBoxes (object) {
  var boxes = [];
  for (var key in object) {
    if (!object.hasOwnProperty(key)) continue;
    boxes.push(object[key].box);
  }
  return boxes;
}

console.log(getBoxes(obj))

for...in 可以循环遍历对象的属性，但它也会循环遍历继承的属性，因此我们需要用object.hasOwnProperty(key) 保护循环。

---

Object.keys(): 返回一个对象的所有可枚举属性名的数组

Object.values(): 返回一个对象的所有可枚举值的数组

array.map(): 返回一个新数组，原始数组的每一项都在给定的回调函数中转换

array.slice(): 返回原始数组的浅拷贝

Answer 3

查看下一个示例：

1)首先，使用Object.keys()得到一个包含对象键的数组。

2) 其次，循环每个key 并访问与每个键关联的对象的box 属性，然后将此box 属性推送到新数组上。

var obj = {
    "1": {"class":2, "percent":0.99, "box":[0.2,0.3,0.4,0.5]},
    "2": {"class":2, "percent":0.99, "box":[0.12,0.23,0.45,0.56]},
    "3": {"class":2, "percent":0.99, "box":[0.52,0.83,0.34,0.59]}
};

var arrayOfArrays = [];

Object.keys(obj).forEach(function(k){
    arrayOfArrays.push(obj[k].box);
});

console.log(arrayOfArrays);

这是（只是为了好玩）使用reduce() 方法的另一种替代方法：

var obj = {
    "1": {"class":2, "percent":0.99, "box":[0.2,0.3,0.4,0.5]},
    "2": {"class":2, "percent":0.99, "box":[0.12,0.23,0.45,0.56]},
    "3": {"class":2, "percent":0.99, "box":[0.52,0.83,0.34,0.59]}
};

const reducer = (accumulator, currVal) => {
    accumulator.push(currVal.box);
    return accumulator;
};

arrayOfArrays = Object.values(obj).reduce(reducer, []);

console.log(arrayOfArrays);