Smileyby|星空灬

JS中常用的编码解码方式

正常的编码解码（非加密）

1. escape/unescape：主要就是把中文汉字进行编码和解码（一般只有JS语言支持，也经常应用于前端页面通信时候的中文汉字编码）

let str = '我是一串中文 @China'
escape(str); //=> "%u6211%u662F%u4E00%u4E32%u4E2D%u6587%20@China"
unescape('%u6211%u662F%u4E00%u4E32%u4E2D%u6587%20@China'); //=> "我是一串中文 @China"

2. encodeURI/decodeURI：基本上所有的编程语言都支持

let str = '我是一串中文 @China'
encodeURI(str); //=> "%E6%88%91%E6%98%AF%E4%B8%80%E4%B8%B2%E4%B8%AD%E6%96%87%20@China"
decodeURI('%E6%88%91%E6%98%AF%E4%B8%80%E4%B8%B2%E4%B8%AD%E6%96%87%20@China'); //=> "我是一串中文 @China"

3. encodeURIComponent/decodeURIComponent：和第二种方式非常类似，区别在于encodeURIComponent/decodeURIComponent 会将关键字和保留字也转码掉

let obj = {
    name: '小明'，
    age: 12,
    url: 'http://www.baidu.com?lx=1&Thyme &time=again',
}
//=> 此处不能使用encodeURI，因为不能处理特殊字符
for (let key in obj){
    str += '${key}=${encodeURIComponent(obj[key])}&';
}
str = str,replace(/&$/g, '');

//=> 后期获取URL问号参数的时候，我们把获取的值依次解码即可
String.prototype.myQueryUrlParameter = function myQueryUrlParameter(){
    let reg = /[?&]([^?&=]+)(?:=([^?&=]*))?/g;
    obj = {};
    this.repalce(reg, (...arg)=> {
        let [,key, value] = arg;
        obj[key] = decodeURIComponent(value);
    });
    return obj;
}

a加密编码方式

1. 可逆转加密 （一般使用内部约定的规则加密解密）
2. 不可逆转加密（一般都是基于MD5加密完成，可能会把MD5加密后的结果进行二次加密）

AJAX中同步和异步

ajax这个任务：发送请求接收到相应主题内容（完成一个完整的HTTP请求）

xhr.send()：任务开始

xhr.readyState === 4; 任务结束

同步-一定要等主任务队列完成后，再执行等待任务队列任务

let xhr = new XMLHttpRequest();
xhr.open('get', 'test.json', false);
xhr.onreadystatechange = () => {
    console.log(xhr.readyState);
}
xhr.send();
//=> 只输出一次，结果是4
// 由于采用的是异步编程，所以主任务队列没有完成（其他事情都做不了）1=>2 2=>3 3=>4状态改变3次
// xhr.readyState === 4 AJAX任务完成，主任务队列也执行完成，执行等待任务队列中的事情
// 此时的onreadystatechange只是别到1=>4，执行一次输出结果是4

let xhr = new XMLHttpRequest();
xhr.open('get', 'test.json', false);

//=> 同步，开始发送ajax发送，开启ajax任务，在任务没有完成之前什么都做不了（下面绑定事件也做不了） => loading => 当readyState === 4的时候ajax任务完成，开始执行下面的操作
xhr.send();
xhr.onreadystatechange = () => {
    console.log(xhr.readyState);
}
//=> 绑定方法之前状态已经是4，此时ajax的状态不会改变成其他值，所以事件不会被触发，一次都没有执行（使用ajax同步变成，不要把send放在事件监听前，这样我们无法再绑定的方法中获取到相应主体的内容）

let xhr = new XMLHttpRequest();
xhr.open('get', 'test.json');
xhr.onreadystatechange = () => {
    console.log(xhr.readyState);
}
xhr.send();
// 不需要等待ajax任务结束，此时等待任务队列就已经完成了
// 1=>2 响应头信息返回 状态改变会触发事件监听，把绑定的方法执行（2）
// 2=>3 绑定的方法再次执行（3）
// 3=>4 绑定的方法再次执行（4）
// ajax任务完成

let xhr = new XMLHttpRequest();
xhr.open('get', 'test.json');
xhr.send();
xhr.onreadystatechange = () => {
    console.log(xhr.readyState);
}
// 2=>3=>4

let xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
    console.log(xhr.readyState);
}
xhr.open('get', 'test.json', false);
// xhr.readyState === 1 AJAX特殊处理的一件事，执行open状态变为1，会主动把之前监听的方法执行一次，然后再去执行send方法
xhr.send();