javascript - 如何正确轻松地将数据分配给 json 中的变量？

Question

我主要是一个自学成才的程序员，最近我一直在摆弄英雄联盟 API，它使用了我以前从未使用过的 JSON。

这是我检索玩家 ID 的代码的一部分:

function RiotAPI(phrase) {
...
this.request = function() {
    return $.ajax({
        url: url,
        type: 'GET',
        dataType: 'json',
        data: {

        },
    });
}
}

function getID(key, name) {
phrase = getPhrase(2, key, 0, name);
api = new RiotAPI(phrase);
api.request().done(function(data)
    {
        window.console&&console.log(data[name]['id']);
        document.getElementById("sID").innerHTML = data[name]['id'];
    });
}

在这种情况下，控制台正确地将数据记录在数据[名称]['id'] 中。但是，如果我做类似的事情

id = data[name]['id']

那么变量“id”是未定义的。我知道这是由于 json 的性质所致，但处理该问题的常用方法是什么？

现在我有

document.getElementById("sID").innerHTML = data[name]['id'];

令人惊讶的是，它确实有效，而且它的功能就像一个非常可悲的变量。显然必须有更好的方法来处理这个问题，对吧？

谢谢

Answer 1

In this case the console properly logs...data[name]['id']. However...id = data[name]['id']...then the variable 'id' is undefined.

不，如果 console.log 有效，该代码将成功地将相同的值分配给 id。

I understand that this is due to the nature of json

不，它与 JSON 无关。一方面，当您处理 data 变量时，您并不是在处理 JSON。它只是一个 JavaScript 对象。 JSON 是一种文本 表示法。如果您正在编写 JavaScript 代码，而不是处理字符串，那么您就不是在处理 JSON(它已被解析)。

仅根据您的 getID 函数的名称和参数，我的猜测是您正在尝试返回 id 值 获取ID。你不能。 Ajax 是异步的。这意味着当 getID 返回时，ajax 调用尚未完成。

您需要向您的 getID 传递一个回调，以便在数据可用时调用，或者让它返回一个 promise 等。更多信息请参见 this question and its answers .

下面是使用回调的 getID 示例:

function getID(key, name, callback) {
    var phrase = getPhrase(2, key, 0, name);
    var api = new RiotAPI(phrase);
    var api.request().done(function(data)
    {
        var id = data[name]['id'];
        window.console&&console.log(id);
        document.getElementById("sID").innerHTML = id;
        callback(id);
    });
}

用法:

getID("the key", "the name", function(id) {
    // Use `id` here
});

您在评论中说过要将 id 放入全局变量中。如果是这样，你会这样做:

var id;

getID("the key", "the name", function(receivedId) {
    id = receivedId;
});

...但请注意，在您调用 getID 之后和 ajax 请求完成之前，id 将是 undefined。

旁注:您的代码似乎成为 The Horror of Implicit Globals 的牺牲品.您需要确保在 getID 中声明您的变量，例如 phrase 和 api。