Start of front-end development-OO-based Ajax class

I have never written a blog for a year. I am not lazy. I don't know what to write... Now I am switching from a background development. net to front-end development...

When I went to the interview, I asked the interviewer if there were any ajax classes of my own. It was strange at the time, because I basically used jquery for ajax development. I thought about it later, you should also write one.

First look at the call method:

1 ajax. request ("ajax.html", {v: Math. random (), num: 1}, function (data ){
2 // do something
3}, 'get ');

 

The method is like jquery... I still think this call is more convenient...

1 var ajax = {
2 // Xmlhttprequest class
3 Xmlhttprequest: function (){
4 this. xhr = false;
5 },
6 // external call interface
7 request: function (url, data, callback, type ){
8 // create an Xmlhttprequest object each time, so that ajax calls do not affect each other
9 var xhr = new this. Xmlhttprequest ();
10 xhr. request (url, data, callback, type );
11}
12}
13 // convert the json data format {num: 1, t: 'A'} to the string format num = 1 & t =.
14 var json2str = function (data ){
15 var _ data = [];
16
17 for (var name in data ){
18 _ data. push (name + "=" + data [name]);
19}
20 return _ data. join ('&');
21}
22 // Method for extending the Xmlhttprequest class
23 ajax. Xmlhttprequest. prototype = {
24 // create XMLHttpRequest
25 createXmlHttpRequest: function (){
26
27 if (window. XMLHttpRequest ){
28 return new XMLHttpRequest ();
29}
30 else {
31 var a = ["Msxml2.XMLHTTP", "Microsoft. XMLHTTP", "Msxml2.XMLHTTP. 5.0", "Msxml2.XMLHTTP. 4.0", "Msxml2.XMLHTTP. 3.0"];
32 for (var I = 0, l = a. length; I <l; I ++ ){
33 try {
34 return New activexobject (A [I]);
35} catch (e ){};
36}
37}
38 },
39 // callback function
40 fncallback: function (callback ){
41
42 if (this. xhr. readyState ===4 & this. xhr. status === 200 ){
43 callback? Callback (this. xhr. responseText): void (0 );
44}
45 },
46 // ajax request
47 request: function (url, data, callback, type ){
48
49 var that = this;
50 var ispost = type = 'post '? True: false;
51
52! Ispost & (URL + = (URL. indexof ('? ') + 1? '&':'? ') + Json2str (data ));
53
54 This. xhr = This. createxmlhttprequest ();
55
56 this. xhr. Open (type, URL, true );
57 ispost? This. xhr. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded "):'';
58 this. xhr. onreadystatechange = function () {That. fncallback (callback );};
59 This. xhr. Send (ispost? Json2str (data): NULL );
60}
61}

 

 

There must be some shortcomings in this category. Please click it! Everyone has their own habits. The most important thing is that you can use them!