axios源码入口以及公用方法

axios学习笔记（公用方法）

源码地址

找到入口文件

axios/lib/axios.js

	var utils  =  require('./utils');
	var bind = require('./helpers/bind')
	...

学习bind

axios/lib/helpers/bind.js

为什么要先看bind呢，因为utils中引入了bind

	//目的将fn的执行上下文换成thisArg，并返回
	function bind(fn, thisArg){
		return functuon wrap(){
			//将类数组转化为数组，
			//es5 Array.prototype.slice.call(arguments) || [].slice.call(arguments)
			//es6 Array.form(arguments) || [...arguments]
			var args = new Array(arguments.length)
			for(var i = 0; i < arg.length; i++){
				args[i] = arguments[i];
			}
			//使用apply改变fn执行环境上下文，并返回
			return fn.apply(thisArg, args)
		}
	}

axios公共方法学习

axios/lib/utils.js

将稍微复杂的方法挑选出来

forEach方法

//对obj进行循环，并将每一项val和key(数组为index)和本身(obj)变成fn的参数
fcunction forEach(obj, fn) {
	//obj非空处理
	if(obj == null || typeof obj == 'undefined'){
		return;
	}
	//非array 和Object处理
	if(typeof obj != 'object') {
		obj  = [obj];
	}
	//判断当前obj是否为数组，es6//Array.isArray(obj)
	if(Object.prototype.toString.call(obj) === '[object Array]') {
		//对数组for循环，对fn进行逐个绑定参数并执行
		for(var i = 0; i < obj.length; i++){
			return fn.call(null, obj[i], i obj);
		}
	}else{
		//对象for循环，对fn进行逐个绑定参数并执行
		for(var key in obj){
			return fn.call(null, obj[key], key, obj);
		}
	}
}

merge方法

function merge(/*obj1, obj2, obj3...*/){//浅合并
	var result = {}
	for(var i = 0; i < arguments.length; i++){
		//val为argument[i]中各项对应的值，key为对应的关键字或者下标
		function assginValue(val, key){
			//如果当前key对应的值已经在result存在且为对象，且val也为对象，需要进一步合并（即合并嵌套的对像）
			if(typeof result[key] === 'object' && typeof val === 'object'){
				result[key] = merge(result[key], val)
			}else{
				result[key] = val
			}
		}
		forEach(arguments[i], assginValue)
	}
	retutn result
}

deepMerge方法

functuon deepMerge(/*obj1, obj2, obj3...*/){//深度合并,区别遇到数组和对象不能直接复制，需要进行一个深度拷贝
	var result = {}
	function assginValue(val, key){
		if(typeof result(key) == 'object' && typeof val == 'object'){
			result[key] = deepMerge(result[key], val)
		}else if(typeof val === 'object'){//对赋值对象进行深度拷贝
			result[key] = deepMerge({}, val)
		}else{
			result[key] = val
		}
	}
	for(var i = 0;i < arguments.length; i++){
		forEach(arguments[i], assginValue)
	}
	return result
}

extend方法

function extend(a, b, thisArg){//a为需要被扩展项，b为具体需要扩展到a上的项，thisArg可选，为b对象上方法需要的执行上下文
	function assignValue(val, key){
		if(thisArg && typeof value === 'function'){
			a[key] = bind(val, thisArg)//将thisArg变成val方法的this指向，然后挂到对象a上，key为键值
		}else{
			a[key] = val//直接将val挂到a上，key为键值
		}
	}
	forEach(b, assignValue);
	return a;//返回新的a对象
}

总结

在合并过程中，两对象如果有相同的key，后对象的key的值覆盖前对象

在forEach中虽然有做数组判定，但是由于ket取的下标，如果2数组合并，同下标后面值取带前方值，故合并方法传参皆为对象比较合适