数组在功能上有所改变,但功能数组之外没有改变?

时间:2017-03-02 01:27:40

标签: javascript jquery arrays function

所以我有一个数组,我在一个函数中使用.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 个答案:

答案 0 :(得分:0)

更新:看到您的代码后,我建议您查看promises并阅读此post了解如何宣传您的功能。 Javascript是单线程的意思,当代码运行时需要很长时间(就像一个非常长的ajax请求)它会阻止其他代码运行。这可能会导致事情变得非常缓慢。所以我们有异步函数来帮助。 Asyncronous基本上意味着您可以像这个API调用一样进行调用,并且在执行其他代码时可以继续运行。所以你的程序更有效率。所以这里发生的事情是你正在打电话,在你进入阵列之前,alert()正在运行。因此,您在推送发生之前记录数组。这有意义吗?您想要的是完成通话并then拨打您的提醒功能。

您需要做的是宣传您的代码。

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

您可以在问题中显示您的代码吗?它可以帮助您更轻松。

没看到,我想象你可能会在你的功能中重新分配数组。如果是这种情况,您可能需要谷歌并阅读scope。当您在函数内部时,您具有本地范围。如果声明一个具有相同名称的数组,它实际上将是一个不同的数组。

&#13;
&#13;
var arr = []

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

changeArr();

console.log(arr) // arr will be []
&#13;
&#13;
&#13;

答案 1 :(得分:0)

因此,对您的问题的评论是正确的,您手头有一个异步问题。

基本上每当你关闭一个AJAX调用时,程序就会这样做然后再继续。您触发请求并且程序继续进入警报然后它接收请求的答案并将值分配给数组。 (你不会看到,因为之前已触发警报)。

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

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