js为什么回调？-木庄网络博客

本文摘自PHP中文网，作者little bottle，侵删。

在Javascript中，函数是第一类对象，这意味着函数可以像对象一样按照第一类管理被使用。既然函数实际上是对象：它们能被“存储”在变量中，能作为函数参数被传递，能在函数中被创建，能从函数中返回。因为函数是第一类对象，我们可以在Javascript使用回调函数。下面我们一起了解一下回调。

简单地讲：回调是指在另一个函数执行完成之后被调用的函数

稍复杂地讲：在 JavaScript 中，函数也是对象。因此，函数可以传入函数作为参数，也可以被其他函数返回。这样的函数称为高阶函数。被作为参数传入的函数就叫做回调函数。

下面说说为什么我们需要回调？

有一个非常重要的原因――JavaScript是事件驱动的语言。这意味着，JavaScript不会因为要等待一个响应而停止当前运行，而是在监听其他事件时继续执行。

来看一个基本的例子：

function first(){
  console.log(1);
}
function second(){
  console.log(2);
}
first();
second();

正如你所料，first 函数首先被执行，随后 second 被执行 ―― 控制台输出下面内容：

1 2	`// 1` `// 2`

但如果函数 first 包含某种不能立即执行的代码会如何呢？

例如我们必须发送请求然后等待响应的 API 请求？为了模拟这种状况，我们将使用 setTimeout，它是一个在一段时间之后调用函数的 JavaScript 函数。我们将函数延迟 500 毫秒来模拟一个 API 请求，新代码长这样：

function first(){
// 模拟代码延迟
  setTimeout( function(){
console.log(1);
  }, 500 );
}
function second(){
  console.log(2);
}
first();
second();

现在理解 setTimeout() 是如何工作的并不重要，重要的是你看到了我们已经把 console.log(1); 移动到了 500 秒延迟函数内部。那么现在调用函数会发生什么呢？

first();
second();
// 2
// 1

即使我们首先调用了 first() 函数，我们记录的输出结果却在 second() 函数之后。

这不是 JavaScript 没有按照我们想要的顺序执行函数的问题，而是 JavaScript 在继续向下执行 second() 之前没有等待 first() 响应的问题。

所以为什么给你看这个？

因为你不能一个接一个地调用函数并希望它们按照正确的顺序执行。

回调正是确保一段代码执行完毕之后再执行另一段代码的方式。

以上就是js为什么回调？的详细内容，更多文章请关注木庄网络博客！

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者