js 回调 同步回调 异步回调

一、回调
回调来说有一个关键词:函数参数,即把函数A当做参数传递到另一个函数B之中,这样当B(A)时,在B中会“”回过头“”再调用函数A(),把函数A叫做回调函数。
为了更方便的记忆:请记住 函数参数 回过头再调用。
二、首先先看一下没有用回调的情形

function f1() {
  var name = prompt('请输入你的名字。');
  return name
}

function f2(name) {
  alert('Hello ' + name);
}

var name = f1()
f2(name)
log(333333333)
上述代码先执行f1,再执行f2,如果f1需要消耗很长时间来执行,f2需要等待,故是同步操作,且没有用到回调。最后执行log(333333333)

三 、同步回调 的情形

function f2(name) {
  alert('Hello ' + name);
}

function f1(callback) {
  var name = prompt('请输入你的名字。');
  callback(name);
}
f1(f2);
log(222222222222)
上述代码,f2作为f1的回调函数,执行的时候,按顺序执行f1内的部分,f1执行到f2时,执行f2,再一次执行f1内剩下的部分,此时同样是同步操作。最后执行log(222222222222)

四、异步回调的情形

function f2(name) {
  alert('Hello ' + name);
}

function f1(callback) {
  setTimeout(function () {
    var name = prompt('请输入你的名字。');
    callback(name);
    }, 10000);
}
f1(f2);
log(11111111111111)
此时f1内多了setTimeout函数,作用:延迟10000执行该函数内function部分。

注意:此时实验结果:是首先执行log(11111111111111),当延迟10000之后,执行function,再回调f2,此时是异步操作。

文献:
http://www.ruanyifeng.com/blog/2012/12/asynchronous_javascript.html Javascript异步编程的4种方法
https://developer.mozilla.org/zh-CN/docs/Glossary/Callback_function 回调函数

原文地址:https://www.cnblogs.com/mengmengzhang/p/10030636.html