[HTML/CSS/JS] 对JavaScript回调函数的深入理解

• 使用函数的构造函数： 在这种方法中，函数是在“函数”的构造函数的帮助下创建的。从技术上讲，这种方法比使用函数表达式语法和函数声明语句语法去声明函数的方法效率要低。
• 使用函数表达式： 通常这种方法与变量分配相同。简而言之，函数主体被视为一个表达式，并且该表达式被分配给一个变量。使用这种语法定义的函数可以是命名函数或匿名函数。
• 没有名称的函数被称为匿名函数。匿名函数是自调用的，这意味着它会自动调用起自身。这种行为也称为立即调用的函数表达式（IIFE）。
• 使用函数声明： 这种方法是 JavaScript 中常用的老派方法。在关键字“function”之后，你必须指定函数的名称。之后，如果函数接受多个参数或参数，也需要提及它们。虽然这部分是完全可选的。& O9 D) `& p. p! d/ e
  

• 发生事件时，例如，用户单击按钮，或者用户从下拉列表中选择某些选项等等。
• 从 javascript 代码中调用该函数时。
• 该函数可以自动调用。3 O# {0 @9 {% U$ s* k( T
  

• 通过对某些端点进行 API 调用来获取数据。
• 通过发送网络请求从远程服务器获取一些资源（例如，文本文件、图像文件、二进制文件等）。
  - Q9 s( u! y! I% Q

复制代码
http.get('https://api.github.com/users', function(users) {
  /* Display all users */
  console.log(users);
  http.get('https://api.github.com/repos/javascript/contributors?q=contributions&order=desc', function(contributors) {
  /* Display all top contributors */
    console.log(contributors);
    http.get('https://api.github.com/users/Jhon', function(userData) {
    /* Display user with username 'Jhon' */
      console.log(userData);
    });
  });
});

• 使用promise
• 借助 async-await
• 使用 async.js 库
  3 H3 W1 O  A% T* h# r  K

复制代码
var async = require('async');
async.waterfall([
    function(callback) {
      /*  
        Here, the first argument value is null, it indicates that
        the next function will be executed from the array of functions.
        If the value was true or any string then final callback function
        will be executed, other remaining functions in the array 
        will not be executed.
      */
        callback(null, 'one', 'two');
    },
    function(param1, param2, callback) {
        // param1 now equals 'one' and param2 now equals 'two'
        callback(null, 'three');
    },
    function(param1, callback) {
        // param1 now equals 'three'
        callback(null, 'done');
    }
], function (err, result) {
    /*
      This is the final callback function.
      result now equals 'done'
    */
});

复制代码
async.series([
    function(callback) {
        // do some stuff ...
        callback(null, 'one');
    },
    function(callback) {
        // do some more stuff ...
        callback(null, 'two');
    }
],
// optional callback
function(err, results) {
    // results is now equal to ['one', 'two']
});