如何排查API无法填充变量问题：学院数据获取失败调试

核心问题分析 #

你的代码无法获取数据的关键原因有两个：

• 严格匹配导致匹配失败：使用===做完全相等匹配，而CSV中的学院名称可能包含空格、后缀（比如"University" vs "U."）或格式差异，输入的名称很难完全一致。
• 字段理解错误：CURROPER字段并非学位时长，它表示学院是否在运营（1=运营中，0=已关闭），你要的学位相关信息应该用PREDDEG字段。

修复后的完整代码 #

JavaScript 部分

// Function to retrieve school information
function getSchoolInformation() {
  var schoolName = document.getElementById("schoolName").value.trim();
  if (!schoolName) {
    console.error("请输入学院名称");
    return;
  }
  
  fetch('https://raw.githubusercontent.com/rfordatascience/tidytuesday/master/data/2020/2020-03-10/tuition_cost.csv')
    .then(response => response.text())
    .then(csvData => {
      var schoolInfo = findSchoolInformation(schoolName, csvData);
      displaySchoolInformation(schoolInfo);
    })
    .catch(error => {
      console.error('获取数据出错:', error);
    });
}

// Function to find school information based on school name
function findSchoolInformation(schoolName, csvData) {
  var parsedData = Papa.parse(csvData, {
    header: true,
    skipEmptyLines: true
  }).data;
  var schoolInfo = [];
  const targetName = schoolName.toLowerCase();

  parsedData.forEach(function(row) {
    var collegeName = row["INSTNM"]?.trim();
    var isOperating = row["CURROPER"];
    var degreeType = row["PREDDEG"]; // 1=证书, 2=副学士, 3=学士, 4=研究生
    var inStateTuition = row["TUITIONFEE_IN"];
    var outStateTuition = row["TUITIONFEE_OUT"];

    if (collegeName && collegeName.toLowerCase().includes(targetName)) {
      // 转换数据类型并验证
      const degreeTypeNum = parseInt(degreeType);
      const inStateCost = parseFloat(inStateTuition);
      const outStateCost = parseFloat(outStateTuition);

      if (!isNaN(degreeTypeNum) && (!isNaN(inStateCost) || !isNaN(outStateCost))) {
        schoolInfo.push({
          collegeName: collegeName,
          isOperating: isOperating === "1" ? "运营中" : "已关闭",
          degreeType: getDegreeLabel(degreeTypeNum),
          inStateTuition: inStateCost || "无数据",
          outStateTuition: outStateCost || "无数据"
        });
      }
    }
  });

  // 调试用：打印匹配到的数量
  console.log(`匹配到 ${schoolInfo.length} 条学院数据`);
  return schoolInfo;
}

// 辅助函数：转换学位类型为可读标签
function getDegreeLabel(typeNum) {
  switch(typeNum) {
    case 1: return "证书项目";
    case 2: return "副学士学位";
    case 3: return "学士学位";
    case 4: return "研究生项目";
    default: return "未知类型";
  }
}

// Function to display school information in the console
function displaySchoolInformation(schoolInfo) {
  if (schoolInfo.length === 0) {
    console.log("未找到匹配的学院信息，请检查输入的名称");
    return;
  }

  schoolInfo.forEach(info => {
    console.log("学院名称: " + info.collegeName);
    console.log("运营状态: " + info.isOperating);
    console.log("学位类型: " + info.degreeType);
    console.log("州内学费: " + (typeof info.inStateTuition === "number" ? `$${info.inStateTuition.toFixed(2)}` : info.inStateTuition));
    console.log("州外学费: " + (typeof info.outStateTuition === "number" ? `$${info.outStateTuition.toFixed(2)}` : info.outStateTuition));
    console.log("------------------------------");
  });
}

HTML 部分

<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.3.0/papaparse.min.js"></script>

<label for="schoolName">输入学院名称:</label>
<input type="text" id="schoolName" />
<button onclick="getSchoolInformation()">获取信息</button>

额外优化点 #

1. 输入校验：添加了空输入判断，避免无效请求。
2. 模糊匹配：用includes()替代严格相等，支持部分名称匹配（比如输入"Harvard"就能匹配"Harvard University"）。
3. 字段修正：替换了错误的CURROPER字段，改用正确的学位类型字段PREDDEG，同时补充了州外学费数据。
4. 可读性提升：将数字类型的学位和运营状态转换为可读文本。
5. 调试提示：添加了匹配数量的日志，方便排查问题。

内容的提问来源于stack exchange，提问作者user22026187