Question

我从远程端点获取JSON字符串，并希望将值用作键。所以我要遍历这样的结果：

(function() {
// Create the connector object
var myConnector = tableau.makeConnector();

var definitions = [];

// Define the schema
myConnector.getSchema = function(schemaCallback) {

$.ajax({
    url: apiUrl,
    type: 'GET',
    crossDomain: true,
    cache: false,
    headers: {
        'X-Auth-Token':'123',
        'X-Auth-User':'user1'
    },
    dataType: "json",
    success: function(response){

        $.each(response,function(key,value){

                console.log("inside loop");
                console.log(value);
                definitions[value.id]
                     = value.name;

        }); 

        console.log("inside ajax");
        console.log(definitions);
    }

});

console.log("done");
console.log(definitions);

// this is where I want to loop through my result
// whithout success (no console output
for (var key in definitions) {
        console.log(key);

    }

}; //     myConnector.getSchema = function(schemaCallback) {

})(); //function() {

这是API的响应：

[
{
    "id": 123,
    "name": "Name1"
},
{
    "id": 456,
    "name": "Name2"
},
{
    "id": 789,
    "name": "Name3"
}]

这是循环内第一个log命令的输出：

{id: 123, name: "Name1"}
id: 123
name: "Name1"
__proto__: Object

问题是，最后一个日志如下：

[123: "Name1", 456: "Name3", 789: "Name4"]
123: "Name1"
456: "Name2"
789: "Name3"
length: 0
__proto__: Array(0)

问题很明显：数组长度显示为零。而且我不明白。

在此脚本后面，我想再次遍历该数组，但是由于这个奇怪的结果，我无法处理索引键。

我做错了什么事？

其他信息

我正在为Tableau开发Web连接器，该连接器将连接到RESTful服务的端点。不幸的是，我无法发布实际的RESTful URL，因为它提供了私有数据。

我正在使用此模拟器：http://tableau.github.io/webdataconnector/Simulator/

我将所有环境添加到上层源代码中。源代码很少，但是绝对与我的工作无关（还有另一种不同的循环和变量定义）。

我现在在Firefox（以前的Chrome）中尝试了该脚本。我得到的唯一结果是

done myConnector.js:97:5
[]

length: 0

<prototype>: Array []

所有其他console.log均未触发。

Firefox也抱怨CORS，这是众所周知的，因为我已经修复了CORS标头服务器端。 但是尽管如此，最后还是接收到数据并将其填充到我正在使用的模拟器中（请参见上面的URL）！显然我误解了这里的某些东西...

Answer 1

您可以尝试将定义初始化为对象而不是数组，即。 var definitions = {}及其ids属性。这样您就可以轻松地通过for..in循环遍历它。

由于AJAX调用是异步的，因此日志可能在空数组definitions上运行。

for (id in definitions) {
// Logic
}
var len = Object.keys(definitions).length

Answer 2

尝试一下。在IE中不起作用。对于跨浏览器的支持，请使用常规的for循环。

for (var object of response) {
    console.log(object.id);
    console.log(object.name);
}

常规

var len = response.length;

for ( var i = 0; i < len; i++ ) {
    var currentObject = response[i];

    console.log(currentObject.id);
    console.log(currentObject.name);
}

通过这种方式，您可以获得属性，然后可以将其用作遍历另一个数组/对象的键。

Answer 3

好的，这是我的事，并且是对Ajax和异步请求的误解。关于我的问题的评论有助于发现问题。

如上所述，我正在从另一台服务器（http://tableau.github.io/webdataconnector/Simulator/）调用此脚本。脚本本身将请求发送到第三台服务器。

强制ajax函数同步工作：

    $.ajax({
        url: apiUrl,
        type: 'GET',
        crossDomain: true,
        cache: false,
        async: false,

        ...})

现在控制台显示实际填充的数组：

(790) [empty × 123, "Name1", empty × 123, "Name2", empty × 333, "Name3"]
123: "Name1"
456: "Name2"
789: "Name3"
length: 929
__proto__: Array(0)

最后，这不是关于错误地引用数组/对象，而是关于异步调用。

JavaScript：如何正确遍历数组并将值用作键？

其他信息

3 个答案: