手写简易的ajax

原创于 2020-04-28 23:33:16 发布 · 147 阅读

CC 4.0 BY-SA版权

本文介绍了一种使用Promise封装AJAX请求的方法，通过这种方式可以更优雅地处理异步操作，包括成功响应和错误处理。文章详细展示了如何创建一个自定义的AJAX函数，该函数接收URL参数，发起GET请求，并在请求完成后返回解析后的JSON数据，同时处理了404错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function ajax(url) {
    const p = new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest()
        xhr.open('GET', url, true)
        xhr.onreadystatechange = function(){
            if (xhr.readyState === 4) {
                if (xhr.status === 200) {
                    resolve(
                        JSON.parse(xhr.responseText)
                    )
                }else if (xhr.status === 404){
                    reject(new Error('404 not found'))
                }
            }
        }
        xhr.send(null)
    })
    return p
}
const url = '/data/test1.json'
ajax(url)
.then(res => console.log(res))
.catch(err => console.error(err))