这是我参与「掘金日新计划 · 6 月更文挑战」的第15天，点击查看活动详情

回调

function loadScript(src) { 
// 创建一个 <script> 标签，并将其附加到页面 
// 这将使得具有给定 src 的脚本开始加载，并在加载完成后运行
let script = document.createElement('script');
script.src = src;
document.head.append(script); 
}

// 在给定路径下加载并执行脚本
loadScript('/my/script.js');

解释：这段代码，document.head.apend就是将script标签添加到head标签中。
分析：这段代码就是典型的异步代码，原因是脚本虽然已经编写好了，但是需要等待函数的执行，脚本中的函数才可能被执行。如下代码就会报错

loadScript('/my/script.js'); // 这个脚本有 "function newFunction() {…}" 

newFunction(); // 没有这个函数！

由此可见，代码的脚本是“异步执行”的，因此下面加载脚本中的函数会报错的原因是，这个调用脚本的函数还没开始执行。
一般情况下，浏览器可能没有时间加载脚本。到目前为止，loadScript 函数并没有提供跟踪加载完成的方法。但我们希望了解脚本何时加载完成，以使用其中的新函数和变量。这里我们添加一个 callback 函数作为 loadScript 的第二个参数，该函数应在脚本加载完成时执行：

function loadScript(src, callback) {
  let script = document.createElement('script');
  script.src = src;

script.onload = () => callback(script);

  document.head.append(script);
}

现在，如果我们想调用该脚本中的新函数，我们应该将其写在回调函数中：

loadScript('/my/script.js', function() {
  // 在脚本加载完成后，回调函数才会执行
  newFunction(); // 现在它工作了
  ...
});

异步执行某项功能的函数应该提供一个 callback 参数用于在相应事件完成时调用。（译注：上面这个例子中的相应事件是指脚本加载）

这里我们在 loadScript 中就是这么做的，但当然这是一种通用方法。

ES6：Promise，async/await

回调