JSON JQUERY Uncaught TypeError: Не удается прочитать свойство 'length' undefined

Question

Я новичок в программировании. Я пытаюсь отобразить данные JSON в файл HTML с помощью JQuery. Я получаю сообщение об ошибке Uncaught TypeError: Cannot read property 'length' of undefinedresumeBuilder.js:147 education.displayresumeBuilder.js:178 (anonymous function) в моей консоли, и я не уверен, почему. Любой свет, который вы можете пролить на эту ошибку, будет очень благодарен!

Вот мой resumeBuilder.js файл:

var eduction = { 
    "schools": [ 
     { 
      "name": "McGill University", 
      "location": "Montreal, Quebec, Canada", 
      "degree": "Master of Arts", 
      "major": "Second Language Education", 
      "url": "mcgill.ca" 
     } 
    ], 
    "onlineCourses": [ 
     { 
      "title": "Full Stack Web Development Course", 
      "school": "Bloc.io", 
      "url": "bloc.io" 
     } 
    ] 
}; 

education.display = function() { 
    if(education.schools.length > 0 || education.onlineCourses.length > 0) { 
     for(i in education.schools) { 
      $("#education").append(HTMLschoolStart); 

      var formattedSchoolName = HTMLschoolName.replace("%data%",  education.schools[i].name).replace("#", education.schools[i].url); 
      var formattedSchoolDegree = HTMLschoolDegree.replace("%data%",  education.schools[i].degree); 
      var formattedSchoolLocation = HTMLschoolLocation.replace("%data%", education.schools[i].location); 
      var formattedSchoolMajor = HTMLschoolMajor.replace("%data%", education.schools[i].major); 

      $(".education-entry:last").append(formattedSchoolName + formattedSchoolDegree); 
      $(".education-entry:last").append(formattedSchoolLocation); 
      $(".education-entry:last").append(formattedSchoolMajor); 
     } 

     if(education.onlineCourses.length > 0) { 
      $("#education").append(HTMLonlineClasses); 
      for(i in education.onlineCourses) { 
       $("#education").append(HTMLschoolStart); 
       var formattedOnlineTitle = HTMLonlineTitle.replace("%data%", education.onlineCourses[i].title).replace("#", education.onlineCourses[i].url); 
       var formattedOnlineSchool = HTMLonlineSchool.replace("%data%", education.onlineCourses[i].school); 
       var formattedOnlineURL = HTMLonlineURL.replace("%data%", education.onlineCourses[i].url).replace("#", education.onlineCourses[i].url); 

       $(".education-entry:last").append(formattedOnlineTitle); 
       $(".education-entry:last").append(formattedOnlineSchool); 
       $(".education-entry:last").append(formattedOnlineURL); 
      } 
     } 
    } 
} 

education.display(); 

Вот мой helper.js файл:

var HTMLschoolStart = '<div class="education-entry"></div>'; 
var HTMLschoolName = '<a href="#">%data%'; 
var HTMLschoolDegree = ' -- %data%</a>'; 
var HTMLschoolLocation = '<div class="location-text">%data%</div>'; 
var HTMLschoolMajor = '<em><br>Major: %data%</em>'; 

var HTMLonlineClasses = '<h3>Online Classes</h3>'; 
var HTMLonlineTitle = '<a href="#">%data%'; 
var HTMLonlineSchool = ' - %data%</a>'; 
var HTMLonlineURL = '<br><a href="#">%data%</a>'; 

Answer 1

Вы, кажется, опечатка в вашем первом объекте JSON.

var eduction = {

Должен иметь "а" в нем.

Answer 2

вы орфографическое образование - Образование линия 1

Answer 3

У вас есть опечатка в вашем var eduction = { =>var education = {

Вы также можете захотеть изменить:

var HTMLonlineClasses = '<h3>Online Classes</h3>'; 

, чтобы соответствовать переменным вы сравниваете в вашем javascript.

education.onlineCourses 

var HTMLonlineCourses = '<h3>Online Courses</h3>'; 

Так что в будущем было бы легче найти и ссылки на обновления для этой переменной