Question

下面的AJAX调用返回一个带有几个JSON条目的JSON文件，就像这样，一个接一个。我从控制台中取出这些。注意，条目不会到达数组。

{"display_name":"ESL_SC2","_id":30220059,"name":"esl_sc2","type":"user","bio":"For standings, schedule, and results, visit http://www.intelextrememasters.com/","created_at":"2012-05-02T09:59:20Z","updated_at":"2017-12-12T19:05:29Z","logo":"https://static-cdn.jtvnw.net/jtv_user_pictures/esl_sc2-profile_image-d6db9488cec97125-300x300.jpeg","_links":{"self":"https://api.twitch.tv/kraken/users/esl_sc2"}}
{"display_name":"RobotCaleb","_id":54925078,"name":"robotcaleb","type":"user","bio":null,"created_at":"2014-01-13T04:07:33Z","updated_at":"2017-12-12T18:02:11Z","logo":"https://static-cdn.jtvnw.net/jtv_user_pictures/robotcaleb-profile_image-9422645f2f0f093c-300x300.png","_links":{"self":"https://api.twitch.tv/kraken/users/robotcaleb"}}

我对每个文件中的每个键/属性都不感兴趣，而只是想要将一些值注入到DOM中。

这是我的JQ。它是有争议的updateUserInfo功能。它会触发每个JSON文件中的每个键，这是我希望避免的。

           $(document).ready(function () {
                var streamersArr = ["ESL_SC2", "OgamingSC2", "cretetion", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
                  $("#all-btn").on("click", function () {
                    streamersArr.forEach(function(user) {
                        getUserInfo(user);
                        console.log(user);
                    });
                });

                function getUserInfo (user) {
                    $.ajax({
                        crossDomain: true,
                        dataType: "jsonp",
                        url: "https://wind-bow.gomix.me/twitch-api/users/" + user,
                        data: {
                            "stream_type": "all"
                        },
                        // take contents of JSON file from API and update html
                        success: function (json) {
                            console.log(JSON.stringify(json));
                            updateUserInfo(json);
                        },
                        // display when AJAX request fails
                        error: function () {
                            alert("AJAX user info request has failed!");
                        }
                    });
                }

                function updateUserInfo (json) {
                    var htmlMediaClass;
                    var htmlMediaBody;
                    Object.keys(json).forEach(function(key) {
                        htmlMediaClass += '<div class="media">';
                        htmlMediaClass += '<div class="media-left media-top">';
                        if (key.match(/_links.self/gi)){
                            htmlMediaClass = '<a href="' + json[key] + '"' + '>';
                        }
                        if (key.match(/logo/gi)){
                            htmlMediaClass = '<img class="media-object" src="' + json[key] + '"' + 'alt="user logo">';
                        }
                        htmlMediaClass += '</a>';
                        htmlMediaClass += '</div>';
                        htmlMediaBody += '<div class="media-body">';
                        htmlMediaBody += '<div class="row">';
                        htmlMediaBody += '<div class="col-md-4">';
                        if (key.match(/display_name/gi)){
                            htmlMediaBody = json[key];
                        }
                        htmlMediaBody += '</div>';
                        htmlMediaBody += '<div class="col-md-8">';
                        if (key.match(/bio/gi)){
                            htmlMediaBody = json[key];
                        }
                        htmlMediaBody += '</div>';
                        htmlMediaBody += '</div>';
                        var finalHTML = htmlMediaClass + htmlMediaBody;
                        updateDOM(finalHTML);
                    });
                }

                function updateDOM (html) {
                    $("#data-row").append(html);
                }

            });

Answer 1

如果这些值显示在表示一组对象的一组行中，那么您将无法获得真正的JSON文件。

如果JSON文件格式正确，请考虑创建一个包含您关注的键的数组，如下所示：

var myKeys = ["display_name","_id","type","logo"];

并遍历它而不是整个对象。

myKeys.forEach(function(key) {
  // Your code here

Answer 2

您收到的文件格式称为JSON Lines。您可以手动将此格式转换为数组

const input = ...; // This is the string which is encoded as a json object per line
const array = input.split('\n').map(function(line) { return JSON.parse(line);});

基本上，您创建一个数组，其中原始的每一行现在都是数组的一个条目。然后，将每个值从String映射到对象。

在您的方法中，您可以循环生成的数组

通过没有数组的嵌套JSON文件进行迭代

2 个答案: