由于拖延症的严重以及年前准备年会(借口*^__^*)
导致这个小的的思考  现在才算完成
再怎么说也算是上班以来带我的前辈第一次这么正式的给我出题
不管是出于尊重还是自我要求我都决定把它简要的记下来
......
 
1.了解prototype
       原型对象的作用,就是定义所有实例对象共享的属性和方法。具体理解见实际操作中
 
2.给String Date等对象增加继承方法
  要求结果:比如var date = "2016-01-01 00:00:00";date.format();要求输出"2016-01-01";
eg:
String.prototype.format = function(){
    return this.substring(0,10);
};
var str1 = "2016-01-01 00:00:00";
alert(str1.format(str1));
 
3.了解xmlhttprequest,能发送及接受ajax,以及分析response对象
         
  response属性为只读,返回接收到的数据体(即body部分),他的类型可以是ArrayBuffer、Blob、Document、JSON对象、或者一个字符串。由XMLHttpRequest.responseType属性的值决定。
 
4.结合xmlhttprequest+prototype 自己封装一个请求
 
本以为信手拈来,就这样的随便的敷衍写了一下,发现各种对原生的ajax不熟悉
于是仔细的看了一下原生的ajax相关的各个属性,复习了下相关用法
同时也参照了一些网络博客综合一下,对ajax进行了简单的封装
XMLHttpRequest.prototype.ajax = function(type,url,data,success,error){
    var _this = this;
    if(typeof data == 'object'){
        var tempStr = '';
        for(var key in data){
            tempStr += key + '=' + data[key] + '&';
        }
        data = tempStr.replace(/&$/,'');
    }
    if(type = 'GET'){
        if(data){
            this.open('GET',url + '?' + data, true);
        }else{
            this.open('GET',url + '?version=' + Math.random(),true);
        }
        this.send();
    }else if(type == 'POST'){
        this.open('POST',url,true);
        this.setRequestHeader("content-type","application/x-www-form-urlencoded");
        this.send(data);
    }
    this.onreadystatechange = function () {
        if(this.readyState == 4){
            if(this.status == 200){
                success(this.responseText);
            }else{
                if(error){
                    error(this.status);
                }
            }
        }
    }
};

//ajax test
var xhr = new XMLHttpRequest();
xhr.ajax('GET','https://secure.ec.qa.sunyuki.com/v0/items/11111',null,function(data){
    alert(data);
});
 
 

结合prototype和xmlhttprequest封装ajax请求的更多相关文章

  1. JS利用XMLHttpRequest拦截ajax请求

    function XMLHttpRequestBreak(fun=()=>false){ let f = XMLHttpRequest.prototype.open; let add = fun ...

  2. jQuery-实现简单的Ajax请求封装

    封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...

  3. ajax02_封装自己的jQuery库和ajax请求

    封装自己的ajax类库 首先封装自己的 jQuery库 启发:css的元素选择器思想 简单的代码实现 function jQuery(selector){ if(typeof selector == ...

  4. 封装ajax库,post请求

    http状态码406是服务器无法根据客户端请求的内容特性完成请求 //整站功能方法库封装ajax请求,这里只针对post var methods = { //全站ajax请求状态处理 ajax: fu ...

  5. 封装Ajax和跨域

    目录 引言 封装ajax 案例:使用自封装ajax 案例:动态加载瀑布流 跨域 引言 对于Ajax现在相信大家已经不会陌生了,无论是原生的XMLHttpRequest方式发送还是通过jQuery框架中 ...

  6. ajax请求加全局loading , 个别特殊请求不显示loading

    项目中,请求开始前加载loading遮罩层,请求结束关闭遮罩,一般都会加在全局中,但有个别请求不需要加全局loading 的话,这时候就需要对这些请求进行配置 全局加loading: ; functi ...

  7. 前后台交互ajax请求模块

    下载依赖包axios npm i axios -d //在packge.json内配置proxy,配置请求基础路径 "proxy":"http://localhost:5 ...

  8. <day001>存储到Mysql、mongoDB数据库+简单的Ajax请求+os模块+进程池+MD5

    任务1:记住如何存储到Mysql.mongoDB数据库 ''' 存储到Mysql ''' import pymysql.cursors class QuotePipeline(object): def ...

  9. js封装ajax的方法

    常用的ajax请求方法封装 /** * ajax请求的封装代码 */ function ajaxPost(url, params, cb) { $.ajax({ type : 'post', url ...

随机推荐

  1. 5分钟了解MySQL5.7的Online DDL雷区

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://suifu.blog.51cto.com/9167728/1855872 Part ...

  2. js bool true false 比较

    .想到一个好玩的,运行如下 javascript :  if ('0') alert("'0' is true");  if ('0' == false) alert(" ...

  3. 用Redis作为Mysql数据库的缓存

    看到一篇不错的博文,记录下: http://blog.csdn.net/qtyl1988/article/details/39553339 http://blog.csdn.net/qtyl1988/ ...

  4. Oracle中 Instr 这个函数

    http://www.jb51.net/article/42369.htm sql :charindex('字符串',字段)>0 charindex('administrator',MUserI ...

  5. 关于Vue.js 使用v-cloak后仍显示变量的解决方法

    v-cloak   这个指令是防止页面加载时出现 vuejs 的变量名而设计的,但有时候添加了这个指令仍会显示变量,这是怎么回事呢?. v-cloak 用法: HTML代码: <div v-cl ...

  6. iOS 多线程NSThread理解与场景示例

    NSThread是相对GCD和NSOperationQuene而言,比较轻量级的一种多线程处理方式. 但同时,它的弊端就是需要自己管理线程的生命周期,以及线程同步:而另外两种不需要自己管理. 常见方法 ...

  7. 有关C#分部类型的一些叙述

    等待着元宵节的到来,过完元宵,这个年也算是过完了,也得开始出去挣钱了,过年回家感觉每个人都觉得很牛,只有自己太渣,为了避免年底再出现这样尴尬的局面,还是需要努力干活.争取当上CEO,赢取白富美,走上人 ...

  8. input中的disabled 和 readonly的区别

    1.Readonly只针对input(text / password)和textarea有效, 而disabled对于所有的表单元素都有效, 2.但是表单元素在使用了disabled后,当我们将表单以 ...

  9. java中函数是值传递还是引用传递?

    相信有些同学跟我一样,曾经对这个问题很疑惑.在网上也看了一些别人说的观点,评论不一.有说有值传递和引用传递两种,也有说只有值传递的,这里只说下个人见解 先看一个例子 public class Test ...

  10. 关于data-xxx属性大小写不敏感,不识别大写的几点总结

    1.所有标签属性,没有大小写区分,都是小写,如:data-userID,在输出后会变成data-userid,前者只能获取到'undefined'. 2.dataset 自动把 - 转换为驼峰.类似的 ...