使用 jQuery 从 JSON 对象值创建一个数组答案

【问题标题】：Make an Array from JSON object values with jQuery使用 jQuery 从 JSON 对象值创建一个数组
【发布时间】：2014-03-29 08:19:38
【问题描述】：

我有这个简单的 JSON 文件 (test.json)：

{"personnes":[
            {
                "name":"Super",
                "firstname":"Mario",
                "adresse":["45 rue du poirier","6700","Strasbourg"],
                "departement": "bas-rhin",
            },
            {
                "name":"Super",
                "firstname":"Luigi",
                "adresse":["10 rue du muguet","6700","Strasbourg"],
                "departement": "eure",
            }
]}

由于某些原因，我需要将每个“部门”值存储在一个数组中，如下所示：["bas-rhin","eure"]

我了解到 $.makeArray() 可以完成这项工作，但不知道如何。这是我的 jQuery：

$( document ).ready(function() {
    $.getJSON( "ajax/test.json", function( data ) {
        console.log('loaded');
        var departement;
        var departements = $.each(data.personnes, function (index, personne) {
            departement = personne.departement;
            var arr = $.makeArray(departement);
            console.log(arr)
        });
    });
});

使用该代码，我得到 2 个单独的数组：["eure"] 和 ["bas-rhin"]。

这是一个问题：我怎样才能解决它并将这些值放在一个数组中？

【问题讨论】：

标签： javascript jquery arrays json

【解决方案1】：

要声明一个数组有很多。选择任何一个：

var arr = $.makeArray();
or
var arr = [];
or
var arr = new Array();

列出了三种从 json 对象创建数组的方法：

1.

$.each(data.personnes, function (index, personne) {
    arr[index] = personne.departement;
});

2.

var arr = personnes.personnes.map(function (element) {
    return element.departement;
});

3.

for(var index = 0;  index < data.personnes.length; index++) {
    arr[arr.length] = data.personnes[index].departement;
}

现在你已经看到图像了：

【讨论】：

【解决方案2】：

使用map。它更简单：

var arr = data.personnes.map(function (el) {
  return el.departement;
});

console.log(arr); // ["bas-rhin", "eure"]

或者，使用 jQuery 的 $.map:

var arr = $.map(data.personnes, function (el) {
  return el.departement;
});

Fiddle

如果你需要一个用于地图的 polyfill：

if (!('map' in Array.prototype)) {
  Array.prototype.map = function (mapper, that /*opt*/) {
    var other = new Array(this.length);
    for (var i = 0, n = this.length; i < n; i++) {
      if (i in this) { other[i] = mapper.call(that, this[i], i, this); }
    }
    return other;
  };
}

【讨论】：

很好，但 ie8 的 .map() 有问题。
您可以使用 $.map 以获得更兼容的解决方案。

【解决方案3】：

这是一种使用简单数组逻辑的方法：

$( document ).ready(function() {
    $.getJSON( "ajax/test.json", function( data ) {
        console.log('loaded');
        var departements = [];
        $.each(data.personnes, function (index, personne) {
            departements[departements.length] = personne.departement;
        });
        console.log(arr);
    });
});

【讨论】：

【解决方案4】：

JavaScript 没有关联数组；您只能将一个值推送到数组中。如果您正在寻找以下最终结果：

   ['abc','dg','erte']

// 0 1 2

使用 .each

var arr= new Array();
$.each( personnes, function(i, obj) {
      arr.push( obj.personnes)
});

或者你可以使用 .map

var arr = $.map( personnes, function( obj, i ) { return obj.personnes; } );

【讨论】：

【解决方案5】：

我认为你应该这样尝试：

$.getJSON( "ajax/test.json", function( data ) {
    console.log('loaded');
    var departement = []; // create array here
    $.each(data.personnes, function (index, personne) {
        departement.push(personne.departement); //push values here
    });
    console.log(departement); // see the output here
});

【讨论】：

【解决方案6】：

试试这个

$( document ).ready(function() {
    $.getJSON( "ajax/test.json", function( data ) {
        console.log('loaded');
        var departement_arr = [];
        var departements = $.each(data.personnes, function (index, personne) {
            departement_arr.push(personne.departement);
        });
        console.log(departement_arr);
    });
});

【讨论】：