JSFiddle - React, Tailwind, and code Playground

JavaScript

// func1, func2 を並列処理しつつ、結果は順次処理していく
$(function() {

    // 結果は順次処理
    const wrap = async function(func, ...args) {
      const res = await func(...args);
      console.log(res); 
      return res;
    }
    
    // func1, func2 を並列処理
    console.log("並列処理開始");
    Promise.all([
      wrap( func1, 'apple' ),
      wrap( func2 )
    ]).then(res=>{
        console.log(res);
        console.log("並列処理すべて終了");
    });

    // AJAXでデータを取得
    function func1(str=''){
      var def = new $.Deferred();
      console.log('start func1')
      setTimeout(function(){
          const ajaxResponse1 = [{name:str+'太郎'},{nane:str+'次郎'}];
          def.resolve( ajaxResponse1 );
      },1000);
      return def.promise();  
    }

    // AJAXでデータを取得
    function func2(){
      var def = new $.Deferred();
      console.log('start func2');
      setTimeout(function(){
          const ajaxResponse2 = [{name:'花子'},{nane:'良子'}];
          def.resolve( ajaxResponse2 );
      },2000);
      return def.promise();   
    }

});