函数类型中,比较常用的是匿名函数和回调函数,一般来说,回调函数是以匿名函数的形式来进行表现的。回调函数在事件监听,异步的执行等,都会用到的是回调函数的作用。
回调函数的概念
第一:在js中,函数是个特殊的对象,确实是Function函数的创建的实例,我们可以通过new关键字来进行创建函数,比如:
var fn = new Function(''num1'',"num2","return (num1 + num2);");
这样,也就是可以创建函数了。
传统函数是以传参数的形式,来输入数据,并使用返回语句来进行获取返回值。事实上,在函数的末尾使用return 来返回函数加工好的数据,来作为结束点。函数的传参是作为函数的开始点,这样,一个开始点和一个结束点,来形成一一对应的映射关系。其实函数,就是输入和输出实现过程的映射关系。
假设,我们在定义函数时,出现函数的执行结果过程比较长,我们是等待函数的执行呢?还是用异步来进行回调执行结果呢?所以,使用回调函数来进行异步的处理就显得是非常重要的了。比如:我们的Ajax请求的回调函数,事件监听的函数,还是我们自定义的函数传参的回调函数都是运用这个机制。
后续子的逻辑依赖于主干逻辑行为的执行结果。等主干逻辑行为执行完毕,在主逻辑的函数的参数中,是回调函数的执行逻辑代码。如果,一个对象的行为有后续行为的话,我们就可以传入回调函数作为参数,来进行执行后续的逻辑。
第二 : 我们要注意的是,回调函数是作为主逻辑的参数是可传可不传的,所以,我们要进行健壮性处理,也就是利用逻辑与来进行健壮性的构建。以防止不传回调函数的情况下,出现代码执行错误。
我们在生活中,也会有这样的执行顺序的。我们不确定的是,主逻辑的执行结果,是什么,就先传入一个回调函数,放到回调函数的下面,来进行执行。在主逻辑中,我们可以传入匿名函数来进行回调,这样,就比较满足我们主逻辑的执行结果后的灵活的执行了。这个是回调函数的主要作用。比较灵活的执行,依赖于主逻辑的执行结果。
···
function fn (num,callback) {
for (var i = 0;i < num; i++) {
if ( i > 100) {
callback && callback();
}
}
};
···
fn (101,function () {
console.log('想玩什么就玩什么');
});
2: 异步的执行过程,我们需要回调函数来进行保存我们用ajax请求下来是值。还有新语法的Promise/then,我们都可以用这些来进行使用回调函数。
仿ES6 Promise
function Promise () {
this.takes = [];
this.error = function () {
console.log('数据获取失败');
};
};
3 : 通过call方法,来进行Promise构造函数添加方法.
(function () {
this.success = function (result) {
this.complate('success',result);
};
this.error = function (result) {
this.complate('error',result);
};
this.complate = function (type,result) {
if (this.takes.length > 0) {
this.takes.shift()[type](result);
};
};
this.then = function (successHanle,errorHanle) {
this.takes.push({
success : successHanle,
error : errorHanle
});
return this;
};
}).call(Promise.prototype);
// test实例
var promise = new Promise();
function start () {
在setTimeout延迟定时器中,我们传入一个回调函数。我们可以通过
setTimeout来延迟其执行函数,进行模拟ajax请求。
setTimeout (function () {
promise.success('数据请求成功了');
},1000);
return promise;
};
var callback1 = function (re) {
console.log(re);
promise.error('数据请求失败了');
};
var callback2 = function (re) {
console.log(re);
}
4:执行Promise对象
start().then(callback1,promise.err).then(callback2,promise.err);
这个是回调函数的执行过程,还有事件监听,一旦触发事件,就可以通过回调函数进行事件逻辑的处理或者是操作。这个是比较常见的回调函数的使用场景。事件监听是我们要经常用的是回调函数使用场景。
6 : 在项目中,我们也经常用到的翻页效果,也经常会回调函数的执行逻辑。
1 : function myFn (num1,num2,callback) {
num1 > num2 ? num1 : num2;
// 执行完比较大小的时候,触发回调函数。
callback && callback ();
};
2 : function myFn2 (max,min,callback) {
var num = Math.ceil( Math.random()* (max - min) + min);
callback(num);
}
// 调用函数的执行
myFn2(12,4,function (num2) {
console.log(num2);
});
这些都是我们自定义的回调函数的执行。
网友评论