Получение undefined при попытке получить член JSON

Question

Я пытаюсь получить JSON и получить доступ к его объектам для извлечения данных, все мои пути, кажется, работают хорошо, но один специально не работает. Я только что проверил, и путь тот же, что и другие объекты, к которым я пытаюсь получить доступ, в консоли я все время становлюсь неопределенным. я буду признателен, если вы, ребята, можете сказать мне, что не так с кодом, я оставлю вас структурой JSON, а также java Scripti надеюсь, что вы, ребята, можете помочь мне разобраться, а также было бы хорошо, если бы вы могли дать мне несколько советов по моей кодировке потому что я учусь.

Java Script: Эта функция вызывается, когда вы нажимаете на какой-либо элемент в списке.

function checkUser(){ 
    console.log("clicked"); 
    var user = $(this).html(); 
    $.getJSON("js/options.json", function(json){ 
     var itemsLength = json.chat.OnlineContacts.length; 
     for (var i = 0; i < itemsLength; i++) { 
      var jsonUserName = json.chat.OnlineContacts[i].name; 
      var jsonUserStatus = json.chat.OnlineContacts[i].status; 
      var jsonUserAvatar = json.chat.OnlineContacts[i].avatar; 
      if(user == jsonUserName){ 
       /*displayChatWindow(jsonUserName, jsonUserStatus, jsonUserAvatar);*/ 
       console.log(jsonUserAvatar); 
      } 
     }; 
    }); 
} 

function displayChatWindow(user, status, avatar){ 
    /*var template = _.template($("#windowTemplate").html(), {userName: user, userStatus: status, userAvatar: avatar}); 
    $("body").prepend(template);*/ 
    $(".messages-container").slimScroll({ 
     height: '200', 
     size: '10px', 
     position: 'right', 
     color: '#535a61', 
     alwaysVisible: false, 
     distance: '0', 
     railVisible: true, 
      railColor: '#222', 
     railOpacity: 0.3, 
     wheelStep: 10, 
     disableFadeOut: false, 
     start: "bottom"  
    }); 
} 

И это JSON:

{ 
"chat": { 
    "NumberOfOnlineContacts": "7", 
    "NumberOfOfflineContacts": "800", 
    "OnlineContacts": [ 
     { 
      "name": "Nandy Torres", 
      "status": "online", 
      "avatar": "img/profile-picture2.jpg" 
     }, 
     { 
      "name": "Catherine Varela", 
      "status": "Busy", 
      "avatar": "img/profile-picture3.jpg" 
     }, 
     { 
      "name": "Jhonnatan Gonzalez", 
      "status": "online", 
      "avatar": "img/profile-picture4.jpg" 
     }, 
     { 
      "name": "Juan Prieto", 
      "status": "away", 
      "avatar": "img/profile-picture5.jpg" 
     }, 
     { 
      "name": "Alexander Barranco", 
      "status": "Busy", 
      "avatar": "img/profile-picture6.jpg" 
     } 
    ], 
    "OfflineContacts": [ 
     { 
      "name": "Nandy Torres" 
     }, 
     { 
      "name": "Catherine Varela" 
     }, 
     { 
      "name": "Jhonnatan Gonzalez" 
     }, 
     { 
      "name": "Juan Prieto" 
     }, 
     { 
      "name": "Jhonathan Sanchez" 
     } 
    ] 
} 
} 

Когда я пытаюсь сделать журнал консоли на аватаре, как в примере, я просто получить неопределен, но если я делать console.log имени или status y просто получите правильные значения.

Answer 1

Рассмотрите возможность реструктуризации оригинального объекта JSON, чтобы вы могли получить доступ к пользователям напрямую по их уникальному идентификатору - в этом случае оно выглядит как «имя».

Например:

{ 
    "chat": { 
     "NumberOfOnlineContacts": "7", 
     "NumberOfOfflineContacts": "800", 
     "OnlineContacts": [ 
      { 
       "Nandy Torres" : { 
        "status": "online", 
        "avatar": "img/profile-picture2.jpg" 
       } 
      }, 
      { 
       "Catherine Varela" : { 
        "status": "Busy", 
        "avatar": "img/profile-picture3.jpg" 
       } 
      }, 
      {...} 
     ] 
    } 
} 

Это может быть доступ к следующим образом, не за счет цикла:

json.chat.OnlineContacts[0].avatar 
json.chat.OnlineContacts["Nandy Torres"].avatar 
json.chat.OnlineContacts[user].avatar 

Там очевидная затрат и здесь, но вы можете получить лучшее как путем обозначения «имени» attr:

"Nandy Torres" : { 
    "name": "Nandy Torres", 
    "status": "online", 
    "avatar": "img/profile-picture2.jpg" 
} 

И, в конечном итоге, переход к более f НПУ уникальный идентификатор:

"123abc" : { 
    "name": "Nandy Torres", 
    "status": "online", 
    "avatar": "img/profile-picture2.jpg" 
} 

Там много отличных идей для структурирования JSON в json.com

Answer 2

Jhonnatan, я рад, что вы получили ваш код работает. Так что это не «ответ» на ваш оригинальный вопрос. Но вы также попросили совета по кодированию и как его улучшить. Это здорово, что вы ищете способы улучшить свой код!

Вот одно предложение для вас, более простой способ записи функции checkUser(). Это просто прямое преобразование вашей функции, которая должна работать с одним и тем же форматом данных.

function checkUser() { 
    console.log("clicked"); 
    var user = $(this).html(); 
    $.getJSON("js/options.json", function(json) { 
     $.each(json.chat.OnlineContacts, function(i, contact) { 
      if(user == contact.name) { 
       displayChatWindow(contact.name, contact.status, contact.avatar); 
       console.log(contact.avatar); 
      } 
     }); 
    }); 
} 

Обратите внимание, как использование contact объекта делает ненужным создавать все эти jsonUserXxxx переменные, так как код, как contact.avatar так же просто и ясно, как jsonUserAvatar.

Я также очень рекомендую @DaveRomero's excellent answer для более стратегического взгляда на вопрос о том, как лучше структурировать данные JSON.

Дополнительная информация по этому вопросу: this discussion of JSON restructuring, который я опубликовал сегодня в ответ на this question.