封装ajax 实战

封装get
url：
query：
callback：

<script>
		function run() {
            get('./data.php', null, function(resp) {
                console.log(resp)
            })
        }
        
        function get(url, query, callback) {
            if (query) {
                url += '?'
                for (var key in query) {
                    url += `${key} = ${query[key]}& `
                }
                url = url.slice(0, -1)
            }

            var xhr = new XMLHttpRequest()
            xhr.open('get', url)
            xhr.send()
            xhr.onreadystatechange = function() {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        callback(xhr.responseText)
                    }
                }
            }
        }
    </script>

接口封装：

var util = {
    get: function(url, query, callback, isJson) {
        if (query) {
            url += '?'
            for (var key in query) {
                url += `${key} = ${query[key]}& `
            }
            url = url.slice(0, -1)
        }

        var xhr = new XMLHttpRequest()
        xhr.open('get', url)
        xhr.send()
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4) {
                if (xhr.status === 200) {
                    callback(xhr.responseText)
                }
            }
        }
    },
    post: function(url, query, callback, isJson) {
        if (query) {
            url += '?'
            for (var key in query) {
                url += `${key} = ${query[key]}& `
            }
            url = url.slice(0, -1)
        }

        var xhr = new XMLHttpRequest()
        xhr.open('get', url)
        xhr.send()
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4) {
                if (xhr.status === 200) {
                    callback(xhr.responseText)
                }
            }
        }
    },
    ajax: function(paramas) {
        var xhr = new XMLHttpRequest()
        if (paramas.method.toLowerCase() === 'get') {
            if (paramas.query) {
                url += '?'
                for (var key in paramas.query) {
                    url += `${key} = ${paramas.query[key]}&`
                }
                url = url, slice(0, -1)
            }
            xhr.open('get', paramas.url)
            xhr.send()
        } else {
            var str = ''
            if (paramas.query) {
                for (var key in paramas.query) {
                    str += `${key} = ${paramas.query[key]}&`
                }
                str = str.slice(0, -1)
            }
            xhr.open('post', paramas.url)
            xhr.setRequestHeader('Content-Type', 'application/x-www-form--urlencoded')
            xhr.send(str)
        }
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4) {
                if (xhr.status === 200) {
                    var resp = paramas.isJson ? JSON.parse(xhr.responseText) : xhr.responseText
                    paramas.callback(resp)
                }
            }

        }
    }
}