Javascript / jquery函数返回undefined

Question

如果我这样做：

test();

function test(){
  $('img').load(function(){
  alert(this.width);
 })
}

显示的图像宽度正确。

但是，当我这样做时：

alert(test());

function test(){
  $('img').load(function(){
  return this.width;
 })
}

...警报显示'未定义'

这两个示例都是在$（document）.ready函数中运行的。我认为它与load（）有关。但我无法弄清楚为什么警报有效，但返回没有。

THX！

Answer 1

您的test函数始终返回undefined，因为它没有return语句。

代码中的

return属于匿名回调函数。

Answer 2

我还不是JS忍者，但我觉得这与范围有关。我怀疑这两种情况下的关键字都指向不同的对象。

final：在调用alert的第二个例子中，没有什么可以返回它以显示任何内容。这是因为返回是异步定义的;只要图像加载完毕，它就会返回。

Answer 3

图像是异步加载的，所以在这种情况下你最好忘记return。 （请参阅How do I return the response from an asynchronous call?的详细说明。）

如果您在加载后必须处理图像的尺寸，请从回调中执行此操作：

function test(){
    $('img').load(function(){
        // If you need to use this.width or this.height, do it from here
    });
}

您也可以将回调传递给测试：

function test(callback){
    $('img').load(callback);
}
function doSomething() {
    alert(this.width);
}
test(doSomething);