jquery - 我如何迭代这个数组？

Question

我在一个数组中有一个数组，我需要其中的数据。

我必须让每个索引内的事件数组成为一个以事件数组作为索引的数组。

这是我的尝试：

//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>

结果应该是：

{ 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"
    }],
}

像这样，我希望事件数组中的每个事件数组都是一个索引

如何从每个索引中获取数组事件并推送到数组。

标签： jqueryarraysecmascript-5

Answer 1

假设您想要一个包含所有事件的数组，没有理由为此使用 jQuery，只需使用 JavaScript 标准库即可。

在 ES5 中：

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

您的events对象具有一个events属性，该属性是具有属性的对象数组events，因此上述循环遍历这些对象并将它们的事件推送到eventArray. 这一行：

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

有效地呼吁eventArray.push(event, event, event, event)尽可能多的事件item.events。有关详细信息，请参阅applyMDN。

现场示例：

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));

在 ES2015+ 中更清晰：

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

这用于for-of循环events.events和传播符号以将所有条目推item.events入eventArray.

现场示例：

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));