异步与回调

异步

我对异步的理解：

1. 异步是不等结果，往下执行；同步是等结果出现后，再往下执行
2. 代码中出现异步程序时，如例2中，执行顺序就会发生变化
3. 使用回调，就是让执行顺序不会发生变化

但这肯定不是异步要表达的意思，因为下面的例子是完全是异步的负面效果，那异步到底有啥作用？

下面的例子是解决异步带来的问题，而非异步的优点。

例子：

1、下面的程序f1()，f2()，...，f5()，它会按照顺序从上往下的顺序执行，就是同步。

f1 =function(){console.log(1)}
f2 =function(){console.log(2)}
f3 =function(){console.log(3)}
f4 =function(){console.log(4)}
f5 =function(){console.log(5)}

f1()
f2()
f3()
f4()
f5()

2、假如f1()是个异步函数，它的执行顺序就会发生变化f2()，...，f5()，f1()

f1 =function(){
    setTimeout(function(){
        console.log(1)
    },10)
}
f2 =function(){console.log(2)}
f3 =function(){console.log(3)}
f4 =function(){console.log(4)}
f5 =function(){console.log(5)}

f1()
f2()
f3()
f4()
f5()

3、这不是我们想要的结果，我们想要的结果是f1()、f2()依次运行，就需要使用回调函数，定义是将函数A作为参数，传入函数B

f1 =function(fn){
    setTimeout(function(){
        console.log(1)
        fn.call()
    },10)
}
f2 =function(fn){console.log(2);fn.call()}
f3 =function(fn){console.log(3);fn.call()}
f4 =function(fn){console.log(4);fn.call()}
f5 =function(fn){console.log(5);fn.call()}

f1(()=>{
    f2(()=>{
        f3(()=>{
            f4(()=>{
                f5()
            })
        })
    })
})

4、或者使用Promise，更能体现执行的顺序

f1 =function(){
    return new Promise(function(resolve){
        setTimeout(function(){
            console.log(1)
            resolve.call()
    },10)
    })
}
f2 =function(){console.log(2)}
f3 =function(){console.log(3)}
f4 =function(){console.log(4)}
f5 =function(){console.log(5)}

f1().then(f2).then(f3).then(f4).then(f5)

回调

把函数 A 作为参数传入函数 B 中

function async(f1, f2) {
    setTimeout(function() {
        f1.call();
        f2.call();
    }, 0);
}
function foo(){
    console.log('foo');
}
function bar(){
    console.log('bar');
}

console.log('异步开始');
async(foo, bar)
console.log('异步结束');

//打印结果：
//异步开始
//异步结束
//foo
//bar