前言
昨天看到了有关回调函数的问题,由于之前没学明白,导致遇到这个函数直接就懵了,昨晚潘老师讲了很久,当时也是没理解太多,后来自己细细理解了一下,在此做一个总结吧。
理解1.0
var map = function(callBack){
callBack(6)
};
map((a) => {console.log(a)});
上述代码的执行结果是6,其实回调函数的执行顺序是这样的,先来看一下下面这段代码:
var map = function(callBack){
console.log(callBack);
};
map((a) => {console.log(a)});
这段代码的执行结果是 (a) => {console.log(a)},因为map方法接收的第一个参数为一个函数,对于最下面这行代码来说,它的参数只有一个,并且是一个函数,对应上面对它的定义,callBack是map方法要接收的第一个参数,那么 callBack 就等于 (a) => {console.log(a)} ,callBack现在就是一个函数,他可以接收一个参数,然后把这个参数打印出来,callBack(6),callBack方法此时接收的函数是6,那么输出结果自然就是6.
理解2.0
假如map接收多个参数,想要输出,那要怎样实现呢,来看下面一段代码:
var map = function(first,second){
first('hello');
second('world');
};
map((a) => {console.log(a);}, (b) => {console.log(b);});
输出结果自然是
hello
world
对于多个参数来说,函数与函数之间要用 “ , ” 间隔,用以表示不同参数,调用原理同上。
理解3.0
对于下面这种参数里面还有函数的又怎么理解呢:
var map = function (callBack){
callBack((message)=>{
console.log(message);
});
};
map((b) => {b(6)});
上面的代码执行后打印的值是6,来看一下为啥吧:
var map = function (callBack){
callBack((message)=>{
console.log(message);
});
};
map((b) => {console.log(b)});
map在定义时接收到的第一个参数是一个函数表达式,下面接收到的第一个参数是b,那么毋庸置疑,b就等于
(message)=>{console.log(message);}
再看上面的b(6),b就是一段函数,它接收一个参数,并把它打印出来,那么这个参数就是6,执行结果也就是6.
理解4.0
对于更复杂的怎么理解呢:
var map = function(callback) {
callback( function(messageSecond) {messageSecond('hello')} );
}
map( function callback(messageFirst) { messageFirst((abc) => console.log(abc));} );
我们先来打印一下各自的值:
var map = function(callback) {
callback( function(messageSecond) {
console.log(2);
console.log(messageSecond);
messageSecond('hello')} );
}
map( function callback(messageFirst) {
console.log(1);
console.log(messageFirst);
messageFirst((abc) => console.log(abc));} );
对于messageFirst来说,它是callBack里面的内容,对于map的定义来说,里面的内容是一个方法,那么messageFirst就是里面的方法,这个方法需要一个参数,这个参数也是一个方法,此时messageSecond是messageFirst的参数,也是一个方法,即(abc) => console.log(abc));
messageSecond('hello')就相当于给方法(abc) => console.log(abc));传参为'hello',然后打印出来。
总结
当时没理解太清楚,就感觉比较懵,当自己亲自进行实践,发现其实也还算好理解,好在终于搞明白回调函数啥意思了。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。