从JSON制作地图/数组

时间:2016-05-02 17:07:50

标签: javascript arrays json

我有以下对象结构,

    {
        carMaker: {
            Id: '01',
            Name: 'Audi',
            Headquarter: 'Germany'
        },
        modelName: 'R8',
        Id: '1',
        CarMaker: 'Audi',
        color: 'black'
    }

基本上,这是一个按名称引用其CarMaker的汽车列表。 并且CarMaker的细节也嵌套在具有关键CarMaker的json中。

我想要的是填充一个JSON结构,其中包含CarMaker列表以及它们在关键carsList下的数组中创建的汽车。

任何人都可以建议一种有效的方法来做到这一点,而不使用两个for循环,这将是一个简单的出路,并会影响较大值的性能。

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script src="../content/vendor_js/AngularJS/angular.js"></script>
        <script>

            var testmodule = angular.module('testmodule', []);

            testmodule.controller('testcontroller', ['$scope', function         ($scope) {
                $scope.carList = [
                    {
                        carMaker: {
                            Id: '01',
                            Name: 'Audi',
                            Headquarter: 'Germany'
                        },
                        modelName: 'R8',
                        Id: '1',
                        CarMaker: 'Audi',
                        color: 'black'
                    }, {
                        carMaker: {
                            Id: '01',
                            Name: 'Audi',
                            Headquarter: 'Germany'
                        },
                        modelName: 'A7',
                        Id: '2',
                        CarMaker: 'Audi',
                        color: 'red'
                    }, {
                        carMaker: {
                            Id: '02',
                            Name: 'Nissan',
                            Headquarter: 'Japan'
                        },
                        modelName: 'GTR',
                        Id: '4',
                        CarMaker: 'Nissan',
                        color: 'yellow'
                    }, {
                        carMaker: {
                            Id: '03',
                            Name: 'Volkswagen',
                            Headquarter: 'Germany'
                        },
                        modelName: 'Polo',
                        Id: '5',
                        CarMaker: 'Volkswagen',
                        color: 'black'
                    }
                ];

                $scope.carMakerList = {};
                $scope.createJSONArray = function () {
                    angular.forEach($scope.carList, function (car) {
                        $scope.carMakerList[car.carMaker.Name] =         car.carMaker;
                    });

                    angular.forEach($scope.carMakerList, function (carMaker)         {
                        carMaker.cars = [];
                    });

                    angular.forEach($scope.carList, function (car) {
                        $scope.carMakerList[car.CarMaker]["cars"].push(car);
                    });
                };

                $scope.createJSONArray();

            }]);
        </script>
    </head>
    <body ng-app="testmodule" ng-controller="testcontroller">
        <table border="1">
            <tr ng-repeat="carmaker in carMakerList">
                <td><p ng-bind="carmaker.Id"></p></td>
                <td><p ng-bind="carmaker.Name"></p></td>
                <td>
                    <ul>
                        <li ng-repeat="cars in carmaker.cars">
                            <p ng-bind="cars.modelName"></p>
                        </li>
                    </ul>
                </td>
            </tr>
            <tr>
                <h3></h3>
            </tr>
        </table>
    </body>
    </html>

1 个答案:

答案 0 :(得分:2)

这是一个包含Array#forEach()的单循环提案,以及一个对象作为carsList的引用。

&#13;
&#13;
var data = [{ carMaker: { Id: '01', Name: 'Audi', Headquarter: 'Germany' }, modelName: 'R8', Id: '1', CarMaker: 'Audi', color: 'black' }, { carMaker: { Id: '01', Name: 'Audi', Headquarter: 'Germany' }, modelName: 'A7', Id: '2', CarMaker: 'Audi', color: 'red' }, { carMaker: { Id: '02', Name: 'Nissan', Headquarter: 'Japan' }, modelName: 'GTR', Id: '4', CarMaker: 'Nissan', color: 'yellow' }, { carMaker: { Id: '03', Name: 'Volkswagen', Headquarter: 'Germany' }, modelName: 'Polo', Id: '5', CarMaker: 'Volkswagen', color: 'black' }],
    grouped = [];

data.forEach(function (a) {
    var key = a.carMaker.Name, o;
    if (!this[key]) {
        o = { Id: a.carMaker.Id, Name: a.carMaker.Name, Headquarter: a.carMaker.Headquarter, carsList: [] };
        this[key] = o.carsList;
        grouped.push(o);
    }
    this[key].push({ modelName: a.modelName, Id: a.Id, color: a.color });        
}, Object.create(null));

document.write('<pre>' + JSON.stringify(grouped, 0, 4) + '</pre>');
&#13;
&#13;
&#13;