大前端请求之——原生ajax

此前一直对原生的ajax有一种恐惧的感觉，现在让我们来克服它。在不考虑兼容性的情况下，使用原生ajax仅需求new一个XMLHttpRequest对象。本质上XMLHttpRequest就是一个类，名字其实非常有规律XML-Http-Request，我们通过控制台打印一下XMLHttpRequest实例化对象

可以看到我们常用的属性，但是没有方法，其实方法在__proto__里面

proto

里面可以看到常用的

下面是一个实例

        // 创建原生ajax对象
        var xhr
        if (window.XMLHttpRequest) {
            //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
            xhr = new XMLHttpRequest();
        }
        else {
            // IE6, IE5 浏览器执行代码
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }
        // 定义回调函数，该回调函数在readyState改变时都会被调用
        xhr.onreadystatechange = function () {
            if (xhr.readyState != 4) return
            if (xhr.readyState == 4 && xhr.status == 200) {
                console.log(xhr.responseText))
            } else {
                console.log('服务器错误')
            }
        }
        // 规定请求类型，url，是否异步等
        xhr.open('get', url)

        // 发送请求，参数可以为空，post请求时可以发送字符串形式的数据
        xhr.send(null)