Why isn't Parse saving the objects in order in the following _.each loop?

Question

I'm looping through an array of objects called $scope.points which looks like this:

[
  {"x": 200, "y": 200, "index": 0}
  {"x": 200, "y": 200, "index": 1}
  {"x": 200, "y": 200, "index": 2}
]

This is the JS, which loops through $scope.points and saves them using Parse:

var createPanodatas = function() {
  console.log('POINTS:', $scope.points)
  _.each($scope.points, function(point) {
    console.log('INDEX:', point.index)
    var Panodata = AV.Object.extend('PanoramaData'),
      panodata = new Panodata()
    var json = {
      'index': point.index,
      'x': point.x,
      'y': point.y,
      'roomModelId': $scope.pano.id
    }
    panodata.save(json, {
      success: function(panodata) {
        console.log('Panodata saved.')
      },
      error: function(panodata, error) {
        console.log('Failed to create new pano object, with error message: ' + error.message)
      }
    })
  })
}

The saved items are saved ordered by date but with random index:

[
  {
    "objectId": "56a1e3dc7db2a2005a15533a",
    "index": 1,
    "roomModelId": "56a1e3d72e958a00515cfe3e",
    "createdAt": "2016-01-22T08:10:04.646Z"
  },
  {
    "objectId": "56a1e3dcc24aa8005415772f",
    "index": 0,
    "roomModelId": "56a1e3d72e958a00515cfe3e",
    "createdAt": "2016-01-22T08:10:04.646Z"
  },
  {
    "objectId": "56a1e3dc816dfa005919182b",
    "index": 2,
    "roomModelId": "56a1e3d72e958a00515cfe3e",
    "createdAt": "2016-01-22T08:10:04.670Z"
  },
]

Which confused me since console.log('POINTS:', $scope.points) outputs the items in correct index order:

And console.log('INDEX:', point.index) too:

INDEX: 0
INDEX: 1
INDEX: 2

Why are the items saved with random index? How to save the index in order? (e.g. 0, 1, 2 ...)?

Answer 1

This looks like the items are being saved just fine and with the correct index.

The underscore _.each function will iterate through the array in-order as you would expect, which will also result in the creation of the PanoramaData in the same order.

The crucial bit of information to be aware of is that saving with Parse is an asynchronous process and you will have no guarantees about which actually completes first. Intuitively, you would expect that the saves which are executed first would fulfill their promises first and that will probably be the case, however you still cannot make any guarantees about that.

This doesn't seem to be the case in your example since the data appears to be saved just fine, but if you need to know that they are saved in the exact same order as the array then you can use promise chaining, in particular serial promise chaining.

Again, it looks like the data is being properly set but the creation time is causing concern for you since in your example index 1 and 0 both were created at 2016-01-22T08:10:04.646Z. Unless you have a particular use-case for it, try not to rely too heavily on serial processes.