Promise resolve 亂鬥

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title></title>
    <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <link rel="stylesheet" href="style.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/q.js/1.4.1/q.min.js"></script>
    <script src="https://www.promisejs.org/polyfills/promise-7.0.4.min.js"></script>
    <script data-require="jquery" data-semver="2.1.4" src="https://code.jquery.com/jquery-2.1.4.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <div class="container">
      <h2>
        Promise resolve 亂鬥
      </h2>
      <pre id="log"></pre>
    </div>
  </body>

</html>

// Add your javascript here
$(function(){
  // $.when
  log('# $.when()');
  log(1);
  $.when(true).then(function () {
    log('2 async [jquery]');
  });
  log(3);
  
  log('\n');
  
  
  // Promise.resolve
  log('# Promise.resolve()');
  log(1);
  Promise.resolve(true).then(function () {
    log('2 async [Promise]');
  });
  log(3);
  
  log('\n');
  
  
  // Q.when
  log('# Q()');
  log(1);
  Q(true).then(function () {
    log('2 async [Q]');
  });
  log(3);
});

function log() {
  var args = Array.prototype.slice.call(arguments);
  $('#log')[0].innerHTML += args.join(' ') + '\n';
}

/* Put your css in here */

h1 {
  color: red;
}