Javascript 无法在image.onload内生成输出

因为我没有得到我在onload函数中所做的任何更改？我存储在onload函数中的结果无法全局使用？

问题是，

img.onload中的函数在警报（值）之后执行；`

时间线：


value=“旧值”

img.onload设置为函数（尚未执行）
警报（值）

图像已加载
value=“新值”


如果在加载图像后在浏览器控制台中键入
value
，则该值应为“新值”。
根据您的代码，
警报将显示“旧值”，因为它在
onload
回调之前执行。由于异步代码的魔力，执行顺序概述如下：

var img = new Image();
var url = "some url "
var value = "old value"

img.onError = function() {
  alert('Cannot load image: "'+som+'"');
};

img.crossOrigin = '';
img.onload = function() {
  // do something
  value = "New value"
};
img.src = som;

alert(value);// pops with "old value"

如果您不相信我，请在警报中添加延迟：

// 1: Declare variables
var img = new Image();
var url = 'some url';
var value = 'old value';

// 2: Assign callback
img.onload = function () {
  // 4: Update value
  value = 'new value';
};

// 3: Alert value
alert(value);

只要图像加载时间不超过10秒，这将为您提供预期的输出。
加载后的代码不会等待它完成后再执行

// THIS IS BAD CODE. It's just to prove that your callback is executing.
setTimeout(function () {
  alert(value);
}, 10000);

由于在显示
alert（）
之前没有执行
onload
，因此该值没有更改。你需要一个回调或类似的东西

var value = 'old value';

img.onload = function () { // image did not load yet, still waiting
    // do something
    value = "New value"
};

alert(value); // doesn't care if onload is done or not

文档中的函数准备好了吗？没有，因为它是mu代码的一小部分。在img.onload中放置一个警报，无论它是否触发。如果我想使用img.onload函数中获得的结果来获得最终输出，我该怎么做？因为它不能在img.onload中使用返回函数。基本上，我希望在img.onload之后，我的下一行代码应该是executed@SomPathak这就是我答案中第二个代码的含义。你能看一看最后的评论吗@SomPathak我不确定我应该找什么，如果你有问题，请在这里提问，或者创建一个新的问题，请看这个
var value = 'old value';

img.onload = function () {
    // do something
    value = "New value"

    imageLoaded();
};

function imageLoaded() { // or just give the value as parameter
    alert(value);
}