Search code examples
jqueryarraysecmascript-5

How do I iterate this array?


I have an array in an array which i need the data from.

I have to get the events array inside each index to be one array with the events array as index.

This is my try:

//array

    var events = {
    "events": [{
        "id": 3,
        "user_id": "48f8fd57-5116-419c-b43a-cff90a4ae39b",
        "event_id": 102,
        "created_at": "2019-06-13 20:46:40",
        "updated_at": "2019-06-13 20:46:40",
        "events": [{
            "id": 102,
            "title": "asdsadsa",
            "description": "dsadsadsa",
            "url": "asdsad",
            "color": "#000000",
            "start": "2019-06-04 08:30:00",
            "end": "2019-06-04 13:00:00"
        }]
    }, {
        "id": 9,
        "user_id": "48f8fd57-5116-419c-b43a-cff90a4ae39b",
        "event_id": 108,
        "created_at": "2019-06-14 10:41:13",
        "updated_at": "2019-06-14 10:41:13",
        "events": [{
            "id": 108,
            "title": "GC",
            "description": "FDGDFGDFG",
            "url": "DFGFDG",
            "color": "#000000",
            "start": "2019-06-25 22:00:00",
            "end": "2019-06-29 22:00:00"
        }]
    }]
}

    // events = this array
    var parseEvents = function(events) {
            var eventArray = [];

            jQuery.each(events, function(index, item) {
                eventArray.push(item['events']);
            });

            return (eventArray);
        }

     console.log(parseEvents(events));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

result should be:

{ 1 //index : [{
        "id": 102,
        "title": "asdsadsa",
        "description": "dsadsadsa",
        "url": "asdsad",
        "color": "#000000",
        "start": "2019-06-04 08:30:00",
        "end": "2019-06-04 13:00:00"
    }],
2: [{
        "id": 102,
        "title": "asdsadsa",
        "description": "dsadsadsa",
        "url": "asdsad",
        "color": "#000000",
        "start": "2019-06-04 08:30:00",
        "end": "2019-06-04 13:00:00"
    }],
}

something like this, i want each events array in the events array to be an index

How do i get the array events out of each index and push to an array.


Solution

  • Assuming you want a single array of all of the events, there's no reason to use jQuery for this, just the JavaScript standard library.

    In ES5:

    var parseEvents = function(events) {
        var eventArray = [];
        events.events.forEach(function(item) {
            eventArray.push.apply(eventArray, item.events);
        });
        return eventArray;
    };
    

    Your events object has an events property which is an array of objects that have an events property, so the above loops through those objects and pushes their events into eventArray. This line:

    eventArray.push.apply(eventArray, item.events);
    

    effectively called eventArray.push(event, event, event, event) for as many events as there are in item.events. See apply on MDN for details.

    Live Example:

    var events = {
      "events": [{
        "id": 3,
        "user_id": "48f8fd57-5116-419c-b43a-cff90a4ae39b",
        "event_id": 102,
        "created_at": "2019-06-13 20:46:40",
        "updated_at": "2019-06-13 20:46:40",
        "events": [{
          "id": 102,
          "title": "asdsadsa",
          "description": "dsadsadsa",
          "url": "asdsad",
          "color": "#000000",
          "start": "2019-06-04 08:30:00",
          "end": "2019-06-04 13:00:00"
        }]
      }, {
        "id": 4,
        "user_id": "48f8fd57-5116-419c-b43a-cff90a4ae39b",
        "event_id": 103,
        "created_at": "2019-06-13 20:46:45",
        "updated_at": "2019-06-13 20:46:45",
        "events": [{
          "id": 103,
          "title": "asdsad",
          "description": "sadsad",
          "url": "",
          "color": "#000000",
          "start": "2019-06-04 08:30:00",
          "end": "2019-06-04 13:00:00"
        }]
      }]
    }
    
    var parseEvents = function(events) {
        var eventArray = [];
    
        events.events.forEach(function(item) {
            eventArray.push.apply(eventArray, item.events);
        });
        return eventArray;
    };
    
    console.log(parseEvents(events));

    It's clearer in ES2015+:

    const parseEvents = function(events) {
        const eventArray = [];
        for (const item of events.events) {
            eventArray.push(...item.events);
        }
        return eventArray;
    };
    

    That uses for-of to loop through events.events and spread notation to push all of the entries in item.events into eventArray.

    Live Example:

    const events = {
      "events": [{
        "id": 3,
        "user_id": "48f8fd57-5116-419c-b43a-cff90a4ae39b",
        "event_id": 102,
        "created_at": "2019-06-13 20:46:40",
        "updated_at": "2019-06-13 20:46:40",
        "events": [{
          "id": 102,
          "title": "asdsadsa",
          "description": "dsadsadsa",
          "url": "asdsad",
          "color": "#000000",
          "start": "2019-06-04 08:30:00",
          "end": "2019-06-04 13:00:00"
        }]
      }, {
        "id": 4,
        "user_id": "48f8fd57-5116-419c-b43a-cff90a4ae39b",
        "event_id": 103,
        "created_at": "2019-06-13 20:46:45",
        "updated_at": "2019-06-13 20:46:45",
        "events": [{
          "id": 103,
          "title": "asdsad",
          "description": "sadsad",
          "url": "",
          "color": "#000000",
          "start": "2019-06-04 08:30:00",
          "end": "2019-06-04 13:00:00"
        }]
      }]
    }
    
    const parseEvents = function(events) {
        const eventArray = [];
        for (const item of events.events) {
            eventArray.push(...item.events);
        }
        return eventArray;
    };
    
    console.log(parseEvents(events));