How to get values (item ids) from executeQueryAsync and store them as arrays CSOM

 Hi All,
 I have been trying to do an update via CSOM but I have had issues with timeout so it was recommended I do it in batches.
I have got the batches running but i'm having issues on how to get the item ids in executeQueryAsync  and using it to update items.

Please see my code below

  //I want the below returned as an array
   var IDs = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30]; // List of our item IDs
   
   // how can i get the above usiing something like the below?
   //var IDs = listArray();

I have read about having to use callbacks to achieve this scenario but looking for help to achieve this.
Any help would be appreciated

 Full code below

<script language="javascript" type="text/javascript">
var items;
var oList;
var oListItem;
var IDs;

function getItemsToBeUpdated()
{

  $('#lblprogress').text("Updating items please wait.... ");
  $('#lblprogress').show();

  
    var siteUrl = '/sites/Team/';

    var clientContext = new SP.ClientContext(siteUrl);
    //var clientContext = new SP.ClientContext.get_current();
   
    oList = clientContext.get_web().get_lists().getByTitle('Test');
   
    var camlQuery = new SP.CamlQuery();
 camlQuery.set_viewXml('<View><Query></Query><RowLimit>100</RowLimit></View>');
    items = oList.getItems(camlQuery);
 clientContext.load(items);   
    clientContext.executeQueryAsync(onUpdateSucceeded, onUpdateFailed);
   

   //I want the below returned as an array
   var IDs = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30]; // List of our item IDs
   
   // how can i get the above usiing something like the below?
   //var IDs = listArray();
  

    var itemsToLoadForUpdate = Array(); // Holds our "current" items to update
    var totalItemsToUpdate = 30;
    var limitItemsToUpdate = 10; // Update every 90 items
   
    var batchUpdatesCounter = Math.ceil(totalItemsToUpdate / limitItemsToUpdate); // If you need to count the remaining batch updates
    var restItemsToUpdate = 0; // Items to update after (see below)
    for (var i = 0; i < IDs.length; i++) {
        var oListItem = oList.getItemById(IDs[i]);
      
         oListItem.set_item('Force_x0020_Update', 'Force Update');

        oListItem.update();
        itemsToLoadForUpdate[i] = oListItem;
        clientContext.load(itemsToLoadForUpdate[i]);
        if (i && i % limitItemsToUpdate == 0) {
            console.log('Updating ' + limitItemsToUpdate + ' items...');
            clientContext.executeQueryAsync(this.onUpdateSucceeded, this.onUpdateFailed);
            restItemsToUpdate = 0;
        }
        else { // Remaining items to update
            restItemsToUpdate = i % limitItemsToUpdate;
        }
    }
    if (restItemsToUpdate) {
         //console.log('Updating rest items...');
         console.log('Updating ' + restItemsToUpdate + ' items...');

        clientContext.executeQueryAsync(this.onUpdateSucceeded, this.onUpdateFailed);
    }
        
}

function listArray()
{

 var IDs = [];

   var itemEnumerator = items.getEnumerator();
    while(itemEnumerator.moveNext()){
   
   
       
        var item = itemEnumerator.get_current();
       
        // You now have the item you were looking for!
        // console.log(item.get_item("ID"));
        
         IDs = item.get_item("ID");
        
    }
   
   return IDs;

}

 

function onUpdateSucceeded() {
  
$('#lblprogress').text("Items Updated Successfully");
    //alert('Items Updated');
    $('#reset').show();
   
listArray();

}

 

function onUpdateFailed(sender, args)
    {   

    //alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
     $('#lblprogress').hide();
     $('#lblerror').text('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
     $('#reset').show();

    }
 
</script>