手写原生ajax

重要参考
ajax与XMLHttpRequest
阮一峰 XMLHttpRequest Level 2 使用指南

  1. 手写 原生js实现ajax请求
const xhr = new XMLHttpRequest();
// 注意这里其实是可以用四三个参数的,
// true表示异步请求
// false表示同步请求,
xhr.open('GET', 'http://www.zhengshengliang.com:9999/'); 

xhr.onreadystatechange = () => {
    if (xhr.readyState === 4) { // 注意readyState大写
        console.log('请求都相应完毕了');
        if (xhr.status >= 200 && xhr.status < 300) {
          console.log('相应成功');
          const res = xhr.responseText; // 你才返回对象,你全家才返回对象 作为http的第四部分,返回的永远是字符串
          console.log(typeof res); // "string"
          
          let obj = window.JSON.parse(res);
        } else if (xhr.status >= 400) {
           console.log('相应失败');
        }
    }
}

xhr.ontimeout = (e) => {
  alert('请求超时了');
}

xhr.timeout = 3000; // 3000ms超时
xhr.send();

// 若为异步(true),则先打印1,后打印请求内容
// 若为同步(false),则先打印请求内容,后打印1
console.log(1); 

  1. json 和 js的区别
    json是一门语言,javascript也是一门语言(发明者Brendan Eich 布兰登·艾克)。json(发明者道格拉斯·克罗克福特 Douglas Crockford)是抄袭JavaScript的。

  2. JSON没有抄袭 js中的function 和 undefined

  3. JSON的字符串首尾必须是 ""

https://www.json.org/ 火车图
"leon" 是json
null 是json
{'name': leon} 不是json 因为首尾没有双引号

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. 什么是跨域? 跨域一词从字面意思看,就是跨域名嘛,但实际上跨域的范围绝对不止那么狭隘。具体概念如下:只要协议...
    他在发呆阅读 830评论 0 0
  • ios网络请求,之前从来没有接触过iOS,最近要做一个app,做到网络请求这(就是通过URL来请求数据),自己总结...
    我的小太阳果果阅读 318评论 1 0
  • 前言 关于前端跨域的解决方法的多种多样实在让人目不暇接。以前碰到一个公司面试的场景是这样的,好几个人一起在等待面试...
    andreaxiang阅读 492评论 1 4
  • 我想你了,大叔 我总爱说我是个成熟的女孩子,其实我一点也不成熟,我希望你有时间能陪我又有时间能打拼自己的事业。我其...
    琪琪巫阅读 406评论 0 1
  • 肤浅的思考 你没钱,别人有钱,你会怎么想?你没钱,马云有钱,你会怎么想?你没钱,你的同学、同事、朋友、或者亲戚有钱...
    兔龙象阅读 262评论 0 0