手写Ajax封装函数

<script>
    // 手写封装ajax
    function ajax1(options) {
        // 1.判断程序员有没有传入 没有传采用默认的
        options.type = options.type || 'get'
        options.url = options.url || ''
        options.data = options.data || ''
        options.dataType = options.dataType || 'json'

        // 2.参数处理： 把对象（{uname:'zs',age:10}）改造成字符串 uname=zs&age=10
        var arr = [];
        for (var k in options.data) {
            arr.push(k + '=' + options.data[k])
        }
        var str = arr.join("&")
        // 3.创建ajax对象 发请求
        var xhr = new XMLHttpRequest();
        // 4.判断程序员输入的是post还是get
        if (options.type.toUpperCase() == 'GET') {
            // 4.1 get请求  xhr.open('get', 'http://www.liulongbin.top:3006/api/addbook?uname=zs')
            xhr.open(options.type, options.url + "?" + str)
            xhr.send()
        } else {
            // 4.2 post请求
            xhr.open(options.type, options.url);
            // 告诉服务器 当前传输的属于什么 文本
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
            xhr.send(str)
        }
        // 5.接受服务器返回来的数据
        xhr.onreadystatechange = function () {
            // 5.1判断浏览器是否接受完毕
            if (xhr.readyState == 4) {
                // 5.2 判断服务器和浏览器是正确得处理
                if (xhr.status == 200) {
                    if (options.dataType == 'text') {
                        // 5.4返回文本的形式
                        options.success(xhr.responseText)
                    } else {
                        // 5.5返回json格式
                        options.success(JSON.parse(xhr.responseText))
                    }
                } else {
                    // 6.失败走的函数
                    options.error()
                }
                // 7.不管成功还是失败 complete都会执行
                // 找错： 有错直接输出 没有错输出最后一个
                options.complete && options.complete()
            }
        }
    }
    ajax1({
        type: "get",
        url: "http://www.liulongbin.top:3006/api/getbooks",
        data: {
            uname: 'zs',
            age: 10
        },
        dataType: "json",
        success: function (response) {
            console.log(response);
        },
        error: function () {
            console.log('失败的');
        },
        complete: function () {
            console.log('执行了');
        }
    });
</script>

手写Ajax封装函数