promise.js

function get_async_data(url, callback) {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if (4 === xmlhttp.readyState && 200 === xmlhttp.status) {
      // console.log(xmlhttp.response);
      callback(JSON.parse(xmlhttp.response));
    }
  }
  xmlhttp.open("GET", url, true);
  xmlhttp.send()
}

function get_channel_data(callback) {
  get_async_data('/channels/1.json', callback);
}

function render_channel(channel) {
  var html = "<p> Channel Name:" + channel.name + "</p>";
  $('body').append(html);
}

get_channel_data(render_channel);

// promise style
// var promise = get_channel_data();
// promise.then(render_channel);


// function Promise(fn) {
//   var data = { state: 0, data: null, callback: null };
//   fn(function(xhr) {
//     data.data = xhr;
//     if (0 === data.state && data.callback) {
//       data.callback(data.data);
//       data.state = 2;
//     } else {
//       data.state = 1;
//     }
//   })
//   return {
//     then: function(callback) {
//             if (0 === data.state) {
//               data.callback = callback;
//             } else if (1 === data.state) {
//               callback(data.data);
//               data.state = 2;
//             } else if (2 === data.state) {
//               console.warn('This promise has been resolved aready!!')
//             }
//           }
//   }
// }

// var promise = Promise(get_channel_data);
// promise.then(render_channel);