访问数组中的对象时出错

Question

我正在创建一个应用程序，用于从星球大战API中检索星球大战角色的对象。字符在8个单独的页面上，所以我想将所有字符对象推送到一个我可以全局访问的数组。当我记录charArray时，我有一个完整的对象数组，但是当我尝试使用括号表示法访问对象时，它会记录未定义。当我记录typeof（charArray）时，我得到'对象'。任何有关此问题的帮助将不胜感激！

$(document).ready(function() {
  let url = 'http://swapi.co/api/people/?page=';
  let charArray = [];

  getCharacters();
  makeCharacterList();


  function getCharacters() {
    for (var i = 1; i < 10; i++) {
      $.getJSON(url + i)
        .then(function(people) {
            let charResults = people.results;
            for (var i = 0; i < charResults.length; i++) {
              charArray.push(charResults[i]);
            }
          });
    }
  }

  function makeCharacterList() {
    console.log(charArray); //array of objects
    console.log(charArray[0]); //undefined
    console.log(typeof(charArray)); //object
  }