前端之ajax解析

最近一直有老哥问我，能不能说一下跨域，讲一下前后端通信，其实我就想说一句，这么大的题你让我怎么说，一时半会也说不完，索性就把各种方法拆开来解析，讲一下它们是如何实现通信，自己封装了几个方法，不定时更新~
今天说一下ajax，ajax到现在应该说除了不能跨域，别的通信功能该有的都有了，但是有的老哥只会用API，怎么实现的都不会，这就有点说不过去了。好了下面贴一个封装好的代码

var opt = {
    //这里就是ajax的参数以及回调函数
         url: '',
         type: 'get',
         data: {},
         success: function () {},
         error: function () {},
     };
util.extend(opt, options);
     if (opt.url) {
     //因为ajax是基于XMLHttpRequest对象，在IE低版本中是基于
     //ActiveXObject，首先要做兼容性判断，如果浏览器存在
     //XMLHttpRequest对象，则new一个XMLHttpRequest对象，如果不存
     //在则创建一个ActiveXObject对象
         var xhr = XMLHttpRequest
            ? new XMLHttpRequest()
            : new ActiveXObject('Microsoft.XMLHTTP');
         var data = opt.data,
             url = opt.url,
             type = opt.type.toUpperCase(),
             dataArr = [];
         for (var k in data) {
             //将需要传递数据封装
             dataArr.push(k + '=' + data[k]);
         }
         //判断get或者post方法，当然还有别的方法我暂时没写
         if (type === 'GET') {
             url = url + '?' + dataArr.join('&');
             //打开ajax连接
             xhr.open(type, url.replace(/\?$/g, ''), true);
             //发送数据
             xhr.send();
         }
         if (type === 'POST') {
             xhr.open(type, url, true);
             //定义请求头可以忽略
             xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
             xhr.send(dataArr.join('&'));
         }
         //响应onload事件（也就是请求成功）
         xhr.onload = function () {
             if (xhr.status === 200 || xhr.status === 304) {
                 var res;
                 if (opt.success && opt.success instanceof Function) {
                     res = xhr.responseText;
                     if (typeof res ==== 'string') {
                     //这里返回数据类型可以自己定义，比如jquery的
                     //xml，json等
                         res = JSON.parse(res);
                         opt.success.call(xhr, res);
                     }
                 }
             } else {
             //请求失败
                 if (opt.error && opt.error instanceof Function) {
                     opt.error.call(xhr, res);
                 }
             }
         };
     }
 };

原理就是如此简单，过几天不定时讲一下jsonp的实现原理。