axios底层
自动判断用户当前环境,如果是浏览器则使用XMLHttpRequests,nodejs则使用内置http模块
- XMLHttpRequests(AJAX)
function send(config){
return new Promise(resolve => {
const {url = '', method = 'get', data = {}} = config;
// 发送ajax请求
const xhr = new XMLHttpRequest();
xhr.open(method, url, true);
xhr.send(data);
xhr.onload = function() {
console.log(xhr.responseText)
resolve(xhr.responseText);
};
})
}
- http modules(nodejs)
//待补充
跨域
- JSONP
原理:动态创建一个script标签。利用script标签的src属性不受同源策略限制。因为所有的src属性和href属性都不受同源策略限制。可以请求第三方服务器数据内容。
//去创建一个script标签
var script = document.createElement("script");
//script的src属性设置接口地址 并带一个callback回调函数名称
script.src = "http://127.0.0.1:8888/index.php?callback=jsonpCallback";
//插入到页面
document.head.appendChild(script);
//通过定义函数名去接收后台返回数据
function jsonpCallback(data){
//注意 jsonp返回的数据是json对象可以直接使用
//ajax 取得数据是json字符串需要转换成json对象才可以使用。
}
//其实很蛋疼还得服务器配合返回字段里要调用jsonpCallback(data)让客户端解析才行...
keep-alive 生命周期
- activated: 页面第一次进入的时候,钩子触发的顺序是created->mounted->activated
- deactivated: 页面退出的时候会触发deactivated,当再次前进或者后退的时候只触发activated
parseInt
parseInt(num,radix);
num:string 填入一个待解析的数字
radix:Number 基数(跟进制没有关系) 2~36之间,其余报错
设num为三位数,记Num为N2N1N0
则结果
=N2*radix^2+N1*radix^1+N0*radix^0
N0N1N2均不可以大于基数radix,大于则会直接被抛弃。
所以parseInt相当于一个进制的直接转换器。
parsePath
/**
* Parse simple path.
* 把一个形如'data.a.b.c'的字符串路径所表示的值,从真实的data对象中取出来
* 例如:
* data = {a:{b:{c:2}}}
* parsePath('a.b.c')(data) // 2
*/
export function parsePath(path) {
const bailRE = /[^\w.$]/; 不匹配字母、数字、下划线、点号和$符号,在这里就是找形如arr[0]的位置
const segments = path.split(".");
return function (obj) {
for (let i = 0; i < segments.length; i++) {
if (!obj) return;
if (bailRE.test(segments[i])) {
//this.arr[0] this[arr[0]]
const match = segments[i].match(/(\w+)\[(.+)\]/);
//(\w+) ->任意多个字母数字下划线
//\[(.+)\] ->匹配[]内的内容
obj = obj[match[1]];
obj = obj[match[2]];
continue;
}
obj = obj[segments[i]];
}
return obj;
};
}