JavaScript中回调函数及区分下同步和异步回调的示例分析

小编给大家分享一下JavaScript中回调函数及区分下同步和异步回调的示例分析，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

1.回调函数

我们编写一个问候的函数，首先创建一个函数greet(name)，该函数返回欢迎消息：

function greet(name) {
  return `Hello, ${name}!`;
}

greet('小智'); // => 'Hello, 小智!'

如果要向一些人问候怎么做？这里，我们可以使用 array.map() 方法：

const persons = ['小智', '王大冶']
const messages = persons.map(greet)

messages // ["Hello, 小智!", "Hello, 王大冶!"]

persons.map(greet)接受person数组的每一项，并使用每一项作为调用参数来调用函数greet()：greet('小智')，greet('王大冶')。

有趣的是persons.map(greet)方法接受greet()函数作为参数。 这样做会使reet()成为回调函数。

persons.map(greet)是一个接受另一个函数作为参数的函数，因此将其命名为高阶函数。

高阶函数承担调用回调函数的全部责任，并为其提供正确的参数。

在前面的示例中，高阶函数persons.map(greet)负责调用greet()回调函数，并将数组的每个项目作为参数：'小智'和'王大冶'。

我们可以可以自己编写使用回调的高阶函数。例如，这里有一个等价的array.map()方法

function map(array, callback) {
  const mappedArray = [];
  for (const item of array) { 
    mappedArray.push(
      callback(item)
    );
  }
  return mappedArray;
}

function greet(name) {
  return `Hello, ${name}!`;
}

const persons = ['小智', '王大冶']

const messages = map(persons, greet);

messages // ["Hello, 小智!", "Hello, 王大冶!"]

map(array, callback)是一个高阶函数，因为它接受回调函数作为参数，然后在它的函数体内部调用回调函数:callback(item)。

2.同步回调

回调的调用方式有两种：同步和异步回调。

同步回调是在使用回调的高阶函数执行期间执行的。

换句话说，同步回调处于阻塞状态：高阶函数要等到回调完成执行后才能完成其执行。

转载：感谢您对IDCBT博客网站平台的认可，以及对我们原创作品以及文章的青睐，非常欢迎各位朋友分享到个人站长或者朋友圈，但转载请说明文章出处“来源IDCBT博客”。

标签：

很赞哦！ ()