提问者:小点点

函数中的数组已更改,但函数外的数组没有更改?[副本]


所以我有一个数组,我在函数中使用.push()将其添加到数组中,但是如果我试图将数组console.log添加到函数之外,它将显示数组为空。我在第一行代码中声明了数组,这样每个函数都可以访问它,但是在我更改的函数之外的任何东西都只显示数组为空。有什么方法可以从另一个函数中获取数组的内容吗?如有任何帮助,将不胜感激:)

我使用JavaScript/jQuery,如果有帮助的话。

代码如下:

var id64List = [];

<other functions>

function handle(e) {
    if (e.keyCode === 13) {
        e.preventDefault();

        var searchBox = document.getElementById("search").value;

        var isnum = /^\d+$/.test(searchBox);

        if (searchBox.length == 17 && isnum === true) {
            useAPI();
        } else {
            alert("Not a valid steam url!");
        }
    }
}

    function useAPI() {
        var friendsRequest = new XMLHttpRequest();
            friendsRequest.open("GET", "<api im using>/friends/id64/" + id64);

            friendsRequest.onreadystatechange = function () {
                if (friendsRequest.readyState === 4) {

                    var friendsResponse = JSON.parse(friendsRequest.responseText);
                    var wrapperDiv = document.getElementById('friends-body');

                    var count = 0;

                    var friendFilter = 1;
                    var friendFilter2 = 0;

                    var arrayLength = friendsResponse.friendslist.friends.length;

                    for (var i = 0; i < arrayLength; i++) {

                        count++;

                        friendFilter = friendFilter + 2;
                        friendFilter2 = friendFilter2 + 2;

                        var friendDiv1 = document.createElement('div');
                        var friendDiv2 = document.createElement('div');

                        if (count < 9) {

                            friendDiv1.id = "friendDiv";
                            friendDiv1.innerHTML = "<div id='friendProfilePicture'></div>" + friendsResponse.friendslist.friends[friendFilter].steamid;
                            wrapperDiv.appendChild(friendDiv1);

                            id64List.push(friendsResponse.friendslist.friends[friendFilter].steamid);

                            friendDiv2.id = "friendDiv2";
                            friendDiv2.innerHTML = "<div id='friendProfilePicture'></div>" + friendsResponse.friendslist.friends[friendFilter2].steamid;
                            wrapperDiv.appendChild(friendDiv2);

                            id64List.push(friendsResponse.friendslist.friends[friendFilter2].steamid);

                        } else {

                            break;

                        }

                    }

                    document.body.appendChild(wrapperDiv);


                }
            };

            friendsRequest.send();

            alert(id64List);


    }

在最底部的警报中,它只显示一个空白。


共2个答案

匿名用户

所以对您的问题的评论是正确的,您手上有一个异步问题。

基本上,每当您启动AJAX调用时,程序就会执行此操作,然后继续执行。触发请求,程序继续执行警报,然后接收请求的答案,并将值赋给数组。(您不会看到,因为警报之前已被触发)。

为了使您的代码工作,您有一些选项。您可以使用回调或承诺。

以下是有关该主题的更多阅读材料:http://cwbuecheler.com/web/tutorials/2013/javascript-callbacks/

匿名用户

更新:看到您的代码后,我建议查看承诺,并阅读这篇关于如何承诺您的功能的文章。Javascript是单线程的,这意味着当代码运行时需要很长时间(就像一个很长的ajax请求),它会阻止其他代码运行。这会导致事情变得非常非常缓慢。所以我们有异步函数来帮助。Asyncronous基本上意味着您可以进行类似于此API调用的调用,在此过程中,其他代码可以继续运行。所以你的程序更有效率。这里发生的情况是,您正在进行一个调用,甚至在您进入数组之前,alert()正在运行。因此,您需要在推送发生之前记录数组。这说得通吗?您想要的是完成您的调用,并然后调用您的警报函数。

你需要做的是承诺你的代码。

下面的内容不再与您的问题相关,但我会留在这里让您检查范围,以及,因为这是另一个重要的概念需要理解。

你能在你的问题中显示你的代码吗?这样就更容易帮你了。

如果没有看到,我想你可能会重新分配函数中的数组。如果是这种情况,您可能想要谷歌并阅读有关scope的内容。当你在一个函数中时,你就有了局部作用域。如果用相同的名称声明一个数组,它实际上将是一个不同的数组。

null

var arr = []

function changeArr(){
   var arr = [];
   arr.push(1)
   console.log(arr) // arr will be [1]
}

changeArr();

console.log(arr) // arr will be []