个人对异步的一些理解

异步编程

简单来理解就是：同步按你的代码顺序执行，异步不按照代码顺序执行，异步的执行效率更高。

以上是关于异步的概念的解释，接下来我们通俗地解释一下异步：异步就是从主线程发射一个子线程来完成任务。

同步编程

严格按照从上往下顺序执行

console.log("Start");
console.log("Show Data");
console.log("End");

/*
		这就是一个同步的代码
		
		按顺序执行
*/

回调函数

在JS中 只要有异步的地方就会有回调函数的存在。

回调函数就是一个函数，它是在我们启动一个异步任务的时候就告诉它：等你完成了这个任务之后要干什么。

这样一来主线程几乎不用关心异步任务的状态了，他自己会善始善终。

异步案例

假设我要做如下三件事

用同步编程的方式来做的话就是先打扫卫生，然后洗衣服，这样效率非常低。

如果用时器来模拟的话就是：

setTimeout(() => {
    console.log("打扫卫生");
}, 4000);

setTimeout(() => {
    console.log("洗衣服");
}, 3500);

setTimeout(() => {
    console.log("做饭");
}, 2000);

等一件事情做完再到下一件事情，这样用的时间非常的多，效率非常低。

OK重点来了，我可以把打扫卫生交给扫地机器人、衣服交给洗衣机、用电饭锅来做饭。

然后躺在沙发上打王者，任务结束了提示一下我去处理。

// 用扫地机器人来做这件事
function clean(callback) {
    setTimeout(() => {
        let msg = "叮，给您打扫干净了。。。";
        callback(msg);
    }, 4000);
}


// 衣服交给洗衣机
function wash(callback) {
    setTimeout(() => {
        let msg = "叮，衣服已经洗好了。。。。";
        callback(msg);
    }, 3500);
}

// 做饭交给电饭锅
function cook(callback) {
    setTimeout(() => {
        let msg = "叮，饭已经熟了。。。。";
        callback(msg);
    }, 2000);
}

// 回调函数 设备完成任务了通知一下你
function callback(data) {
    console.log(data);
}


// 开始干活
clean(callback);
wash(callback);
cook(callback);


/*
		>>>	叮，饭已经熟了。。。。
				叮，衣服已经洗好了。。。。
				叮，给您打扫干净了。。。
*/

总结：看吧，这么一个小小的案例，谁先完成任务就使用 callback() 回调函数通知一下我，放到真实的网页案例中也是这样。

​ 假如我打开一个网页，里面有很多张图片要加载。。。总不能等一张加载完了到下一张吧，谁先加载完就使用回调函数，回调函数

把图片的路径信息返回出来，那既然有了图片的路径信息，