javascript变量未按预期工作

我试图获得图像的宽度，但它总是未定义。这是代码的一部分

var w;

var _URL = window.URL || window.webkitURL;
var img = new Image();
img.src = _URL.createObjectURL(files[i]);
img.onload = function  () {
    w = this.width;
    console.log(w); // works
};

console.log(w); // undefined

我注意到，首先调用的是最后一个控制台日志，而不是函数（）中的控制台，这是正确的行为吗？因为我认为它会逐行调用函数

---

如果我输入4个文件，结果将是4

undefined

，然后是图像的实际宽度。

Javascript是异步的，您不能在onload之外调用

console.log（w）

onload

func将异步执行

---

JavaScript逐行执行

img.onload

函数在加载图像时也会调用，这意味着它是异步的。但同时

console.log（w）以同步方式执行，不依赖于
img.onload
函数。如果您首先声明
w
变量，则不会打印
未定义的

var-w//全局变量（避免此）
var URL=window.URL | | window.webkitURL；
var img=新图像（）；
img.src=https://cdn.sstatic.net/Sites/stackoverflow/img/sprites.svg?v=8c1c8cba242e';
img.onload=函数（）{
w=此宽度；
console.log（'内部函数：'+w）；//有效
};
document.getElementById（'content'）.appendChild（img）
console.log（'外部函数：'+w）；//因为这是在调用onload函数之前发生的

img.onload=fun…
只需将函数注册到加载事件并传递到下一条指令。当加载事件发出时，即在使用
w
的
未定义的
值执行后面的
console.log（w）
之后，调用该函数。您应该阅读有关同步调用和异步调用的内容。
onload是异步调用的，当映像加载时。。。w将是未定义的，直到出现这种情况，onload函数之外的代码不会等待映像被删除load@JaromandaX那么，我如何获得this.width的值并在onload之外使用它呢？简单答案，复杂答案，您不能学习如何使用回调或promises@markoverflow您需要使用回调。您可以调用onload中的函数来使用width变量，也可以将内容放入
onload
。你也可以根据图像的样式来预测图像的宽度（不确定用例是什么）