Question

我有一个文件data.json，内容为：{"id": "foo", "value": "bar"}。我在同一目录中有另一个文件index.html，其中包含以下内容：

<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
  var datavar;
  d3.json("data.json", function(d) { datavar = d; console.log(datavar); });
  console.log(datavar);
</script>

当我在网络浏览器中打开index.html时，第一个console.log(datavar)来电输出{id: "foo", value: "bar"}。第二个输出undefined。我的印象是，自从我在函数之外初始化datavar之后，我对它做出的更改将在我们退出函数后持续。如何在函数内部存储数据？

Answer 1

您的假设是正确的，即在全局级别定义的变量，然后在函数内更改的变量将保持在所述函数之外的更改。

然而，这是输出＆＃39; undefined＆＃39;因为它是一个异步操作。这意味着代码更改了＆＃39; datavar＆＃39;在您登录之前可能没有执行。如果您在控制台日志中添加了一个注释，例如console.log('inside d3', datavar)和console.log('outside d3', datavar)，您可能会惊讶地看到“d3＆＃39;先执行。

异步加载绝对是你想要的 - 所以你应该相应地定制你的实际代码。如果您遇到问题，请随时提供更多详细信息。

如果您绝对需要同步加载数据，请参阅以下SO答案： How do I load JSON data synchronously with d3.js?

Answer 2

您的假设是因为变量在函数之外被初始化，所以它将被存储的时间长于函数的正确性。不正确的是它们被命中的顺序。 d3.json调用一个异步函数，它允许应用程序的其余部分在加载时继续运行。因此d3.json调用之后的console.log发生（未定义），然后在稍后的某个时间加载data.json并记录正确的信息。

如果要使用此数据，则需要等待它返回并仅在回调函数中使用它。您当前设置变量的方式可行，但您必须告诉任何使用它的代码重新运行，以便在加载文件中的数据后运行。

javascript存储设置函数内的变量

2 个答案: