为什么我的 JavaScript 循环没有被输入？

Question

我有一个 JavaScript 函数，它遍历从 Java 方法接收到的数据。我可以看到正在填充数据变量，但没有进入循环；

JavaScript - 在 Web 控制台中，数据变量填充为 data=[{"id":"1","name":"Megan","pay":100.0}] Web 控制台中显示以下错误；

jquery-3.3.1.js:3963 jQuery.Deferred exception: Cannot use 'in' operator to search for 'length' in [{"id":"1","name":"Megan","pay":100.0}] TypeError: Cannot use 'in' operator to search for 'length' in [{"id":"1","name":"Megan","pay":100.0}]
    at isArrayLike (http://localhost:8080/jquery-3.3.1.js:498:33)
    at Function.each (http://localhost:8080/jquery-3.3.1.js:359:8)
    at Object.<anonymous> (http://localhost:8080/csvTest.js:10:11)
    at mightThrow (http://localhost:8080/jquery-3.3.1.js:3665:29)
    at process (http://localhost:8080/jquery-3.3.1.js:3741:12) undefined

$(document).ready(function() {
$('#test').click(function() {

     $.ajax({
            url: "/test" 
     }).then(function(data) {

        $.each(data, function (i, item) {
          console.log(item.name);
        });

        });
  });
});

返回数据的方法；

  @GetMapping("/test") 
      @ResponseBody
        public String getEmployeePercentageMatch(HttpServletRequest request, HttpServletResponse response,String roleName, String percentageMatch) throws IOException {
          percentageMatch="50";
          List<Employee> matchEmployees = new ArrayList<Employee>();
            Optional<Role> currentRole=roleRepository.findByroleNameIs("SWEM"); 
            Optional<List<RoleMapSkill>> skillsForRoles = roleMapSkillRepository.getSkillsForRole(currentRole);
            List<RoleMapSkill> skillsForRole = skillsForRoles.get();

            for(int i=0; i<skillsForRole.size(); i++) {
                Map<String, String> roleSkillMap = new HashMap<String, String>();
                roleSkillMap.put(skillsForRoles.get().get(i).getIdSkill().getIdSkill(), skillsForRoles.get().get(i).getRating());
                System.out.println(skillsForRoles.get().get(i).getIdSkill().getIdSkill()+" "+roleSkillMap.get(skillsForRoles.get().get(i).getIdSkill().getIdSkill()));
            }
            List<Employee> allEmployees = employeeRepository.findAll();
            for(int i=0; i<allEmployees.size(); i++) {
                int totalPercentage=0;
                Employee currentEmployee = allEmployees.get(i);
                Optional<List<EmployeeMapSkill>> skillEmployeeMap = employeeMapSkillRepository.getSkillsForEmployee(currentEmployee);
                for(int j=0; j<skillsForRole.size(); j++) {

                    if(skillEmployeeMap.isPresent()){
                        Map<String,String> employeeSkillMap = new HashMap<String, String>();
                        employeeSkillMap.put(skillEmployeeMap.get().get(j).getIdSkill().getIdSkill(), skillEmployeeMap.get().get(j).getRating());

                    }

                }
                for(int k=0; k<skillsForRole.size(); k++) {
                    if(skillEmployeeMap.isPresent()){
                    int individualPercentageMatch=(100/Integer.valueOf(skillsForRoles.get().get(k).getRating()))*Integer.valueOf(skillEmployeeMap.get().get(k).getRating());
                    totalPercentage= totalPercentage+individualPercentageMatch;
                    }
                }
                int totalPercentageMatch = totalPercentage/skillsForRole.size();
                System.out.println(totalPercentageMatch);

                if(totalPercentageMatch>=Integer.valueOf(percentageMatch)) {
                    matchEmployees.add(currentEmployee);
                }


            }
            String json = new Gson().toJson(matchEmployees);
            PrintWriter writer = response.getWriter();
            writer.write(json);

            return null;
        }

Answer 1

那是JQuery；我不喜欢那样，但是（在所有人的帮助下）...dataType: 'json' 被错过了

在你的代码上

    $('#test').click(function() {

     $.ajax({
            url: "/test", 
            dataType: 'json'

     }).then(function(data) {
        $.each(data, function (i, item) {
          console.log(item.name);
        });

        });
  });

但是，我不太确定……