Question

我使用JQuery从网页抓取一些数据，但是当我尝试将值设置为局部变量时，它变得未定义。我已经在$ .get（）方法的范围以及其他返回时未定义变量的实例中进行了搜索，但是在打印到控制台时却没有，而且我已经走到了死胡同。有什么我想念的吗？为什么我不能指向$ .get（）中的变量？

function scrape(url) {

  let imageUrl = "";

  $.get(url, function(response) {
    imageUrl = response.toString().split("<meta property=\"og:image\" content=")[1].split("\"")[1];
    console.log(imageUrl); // THIS PART WORKS AND PRINTS DESIRED URL
  });

  console.log(imageUrl); // this prints nothing...
  return imageUrl; // returns undefined...
}

scrape("https://www.instagram.com/p/BfKjQxcgv-E/");

Answer 1

$.get是异步的。因此，在$.get方法返回响应之前，您是否返回空白imageUrl。

这是一个简写的Ajax函数，相当于：
$.ajax({
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

要调试它并查看其工作原理，您可以尝试：

function scrape(url) {

    let imageUrl = "";

    $.get(url, function(response) {
        imageUrl = response.toString().split("<meta property=\"og:image\" content=")[1].split("\"")[1];
        console.log(imageUrl); // THIS PART WORKS AND PRINTS DESIRED URL
        console.log('Running secondly');
    });
    console.log('Running first');
    console.log(imageUrl); // this prints nothing...
    return imageUrl; // returns undefined...
}

解决方案：

使用$.ajax并按照您的需要进行配置，并将async设置为false。或者您可以使用以下方法全局更改jQuery的ajax设置：

jQuery.ajaxSetup({async:false});

Answer 2

你正在做的ajax调用是异步的。收到$ .get（url）的响应后，将打印console.log。函数$ .get本身在此之前完成。因此，$ .get完成后，imageUrl仍然是空的

在作为$ .get一部分的函数中，你应该处理imageUrl。如果你想更改你的HTML中的图像，你应该在那里。如果使用异步，则不能只返回url。

javascript函数返回undefined但console.log（）打印预期值

2 个答案: