javascript中call与apply的使用

业务场景:原有业务逻辑已经封装好,现如今需要在现有逻辑上增加逻辑处理。

实现分析:该业务场景类似于java的AOP,我们可以通过javascript中的call与apply方法实现。

代码:

		var func1 = function(arg){
			console.info('this is func1 ' + arg);
		}
		
		var func2 = function(arg){//先执行func2中的代码,在执行func1中的代码
			console.info('this is func2');
			arg.call(this,'test');
		}
		
		var func3 = function(arg){//先执行func3中的代码,再执行func1中的代码
			console.info('this is func3');
			arg.apply(this,['test']);
		}
		//调用新方法
		func2(func1);
		func3(func1);

 

这里需要注意call与apply方法传参的方式。通过以上代码,我们可以看到在执行方法func1时,我们增加了其他的处理逻辑。

上边例子不带直观,举一个实际的应用。

开发web应用,免不了使用AJAX技术。也会经常用到jquery框架。在jquery框架中已经有封装好的ajax调用方法。

jquery中的ajax方法示例:

		$.ajax({
			url : url,
			dataType : 'json',
			type : 'post',
			data : {a : 'a', b : 'b'},
			success : function(result){
                                checkSession(result);
			        1.业务逻辑1
                                2.业务逻辑2
				//执行业务逻辑代码
			}
		});

 

在回调函数中编写业务逻辑时,避免不了有相同的业务逻辑,最常见的就是对session的判断。为了避免每次使用$.ajax都要编写调用checkSession代码,我们可以将这个方法封装以下

$.extend({
	/**
	 * 封装jquery的ajax方法,
	 * 传入参数为以下格式
	 * arg : {url : url, data : data, func : function}
	 * url : 将会自动添加baseUrl
	 * data: 请求参数, 格式为:{param :param}
	 * func : 回调处理方法 格式为 function(result){}
	 * @param arg
	 */
	ajaxPost : function(arg){
		$.ajax({
			url : baseUrl + '/' +arg.url,
			type : 'post',
			dataType : 'json',
			data : arg.data,
			success : function(result){
				checkSession(result);//检查session
				arg.func.call(this,result);
			}
		});
	}
});

 

我们可以使用ajaxPost方法来代替ajax方法(这里只封装了post类型),并且不用在每次请求时再手动的编写checkSession代码。

这只是call与apply应用的一个小例子,一般在框架中会经常出现call与apply。

说明:本文来自iteye本人同一博客。