通常，图像在创建时加载。因此，当我们在页面中添加 <img> 时，用户不会立即看到图片。浏览器需要先加载它。

为了立即显示图像，我们可以“提前”创建它，如下所示

let img = document.createElement('img');
img.src = 'my.jpg';

浏览器开始加载图像并将其保存在缓存中。稍后，当相同的图像出现在文档中（无论如何）时，它会立即显示。

创建一个函数 preloadImages(sources, callback)，它从数组 sources 中加载所有图像，并在准备好后运行 callback。

例如，这将在图像加载后显示一个 alert

function loaded() {
  alert("Images loaded")
}

preloadImages(["1.jpg", "2.jpg", "3.jpg"], loaded);

如果发生错误，函数仍应假定图片已“加载”。

换句话说，当所有图片都已加载或出错时，将执行callback。

例如，当我们计划显示一个包含许多可滚动图片的画廊，并希望确保所有图片都已加载时，此函数非常有用。

在源文档中，您可以找到指向测试图片的链接，以及用于检查它们是否已加载的代码。它应该输出300。

打开一个沙箱来完成此任务。